Blog

5 april 2020 Stand der techniek

Websites zoals bwnr.nl en q-scan.nl maken gebruik van een aantal basistechnieken

Interactie met de gebruiker

Het doel van de website is om gegevens aan de gebruiker te presenteren en de gebruiker de mogelijkheid tot input te geven. De server is hierbij altijd de basis. Hier wordt alles wat via de website wordt ingevoerd opgeslagen. Er zijn echter verschillende technieken om dit te doen met hun mogelijkheden, voor- en nadelen. Een belangrijke factor voor mobiele toepassingen is, of doorgewerkt kan worden met een haperende of tijdelijk verbroken internetverbinding.

Meest eenvoudige methode

Gegevens die naar de server gestuurd moeten worden zijn gegroepeerd als form(ulier), worden naar de server gestuurd met een knop ('bevestigen', 'vastleggen' etc.). Na vastleggen wordt er vanaf de server een nieuwe pagina teruggestuurd.

AJAX

AJAX staat voor Asynchronous JavaScript and XML. Een techniek die al vele jaren bestaat. De essentie van AJAX is, dat input door Javascript als kleine brokjes informatie naar de server wordt gestuurd en vastgelegd, waarna de server indien gewenst een respons stuurt, die weer met Javascript verwerkt kan worden. Groot voordeel is dat de webpagina niet in z'n geheel opnieuw hoeft te worden opgebouwd. Een voorbeeld daarvan is het invullen van postcode en huisnummer, waarna de server straat en plaats terugstuurt, die automatisch worden ingevuld.

Offline op basis van website

De twee voorgaande methoden zijn 100% afhankelijk van een internetverbinding. Zonder internetverbinding gaat het mis zodra er input is die niet gelijk verwerkt kan worden. Dat is met name bij mobiel internet een zwak punt. Bij een slechte verbinding wordt het al snel onwerkbaar, zeker als het om grotere bestanden zoals foto's gaat. Het wordt traag, of de informatie komt überhaupt niet aan.
Offline op basis van website is een stap verder dan het AJAX verhaal en ook duidelijk een stukje complexer. Zoals gezegd, met AJAX kan de server een respons geven. Als je programmeert dat de server dit altijd moet doen en de respons blijft uit, weet je dat er geen verbinding is. De truc is nu om bij te houden welke elementen gewijzigd zijn, maar geen respons hebben gekregen. Vervolgens maak je een achtergrond routine, die blijft proberen om die elementen alsnog naar de server te sturen. Zodra de verbinding hersteld is, zorgt die routine ervoor dat alles op z'n pootjes terecht komt.

Offline op basis van local storage

Dit staat ook wel bekend als 'progressive web app'. Local storage houdt in dat informatie wordt opgeslagen op de client, de notebook, PC, tablet of smartphone waarop u werkt. Hiervoor zijn verschillende mogelijkheden, maar de belangrijkste is de lokale database IndexedDB. Om te beginnen wordt de website hierin vastgelegd en vervolgens worden ook de wijzigingen en invoer in eerste instantie lokaal vastgelegd. Ook hier is een routine nodig die bijhoudt wat gesynchroniseerd is met de server en alles wat nog niet op de server staat alsnog probeert te uploaden.

Conclusie

Hou vast aan het KISS principe, hou het zo simpel mogelijk. Complexiteit leidt tot kosten. Kosten in de zin van meer programmeerwerk, juist ook bij latere toevoegingen en onderhoud. Complexiteit maakt ook foutgevoeliger, iets wat programmeurs niet graag toegeven.
Voor interactieve pagina's waar snelheid van belang is, gebruik AJAX, de complexiteit hiervan is beperkt en goed te overzien.
Indien doorwerken met gebrekkige internetverbinding een rol speelt, verdient Offline op basis van website de voorkeur. Het verhoogt de snelheid sterk en ook hier valt de complexiteit nog te overzien. De meerwaarde van het gebruik van local storage lijkt niet op te wegen tegen de kosten.



 
5 april 2020 Stand der techniek
15 februari 2020 Ingewikkelde berekeningen in Excel
8 november 2019 Hosting en uptime II
4 juni 2019 Hosting en uptime
19 januari 2019 - Progressive Web App
22 augustus 2018 - BWNR - Aansturen medewerkers
21 augustus 2018 - 'Opensource' prijsbepaling
13 februari 2018 - Afspraken- & routeplanning, woningopname en zonnepanelen
6 oktober 2017 - Routeplanning+
18 augustus 2017 - BWNR.NL - Vervolg
3 augustus 2017 - Nieuw project op BWNR.NL
21 april 2017 - Houd je computer veilig
18 april 2017 - Eigenschappen van goede software
16 april 2017 - Hoe herken je een goede website, en dus ook hoe herken je een slechte?