De voordelen van statische websites

Meer dan vijftien jaar geleden ben ik begonnen met het maken van websites. De eersten waren statisch. Een paar HTML-bestanden en afbeeldingen die ik gratis kon uploaden naar de 25 MB (haha) gratis webruimte van mijn internetprovider. Heel handig was dat niet, want bewerken kon alleen op je computer, en die bestanden moest je dan weer uploaden via FTP. Niet lang daarna begon ik websites te bouwen met WordPress, net als de 33% van de rest van het internet.

Van WordPress terug naar statisch

WordPress is een mooi systeem, maar het heeft ook wat nadelen. Zo is het niet heel erg snel zonder er veel tijd en energie in te steken. WordPress kan en doet ook steeds meer, vaak meer dan dat je nodig hebt. En hoe mooi het ook is dat er duizenden gratis plug-ins beschikbaar zijn, dat zorgt er ook voor dat je soms iets te makkelijk naar een plug-in grijpt. En ook dat heeft helaas geen goede invloed op de laadsnelheid. Na vijftien jaar dynamische websites te hebben gemaakt in WordPress, maak ik daarom nu weer statische websites, maar zonder de nadelen van al die jaren geleden.

JAMstack

Deze website heb ik gebouwd met behulp van de JAMstack. JAM staat voor JavaScript, API's en Markup. Hierdoor kan ik via API's content ophalen uit praktisch iedere bron. Iedere keer dat ik een wijziging doe wordt de site opnieuw gebouwd (ik gebruik hiervoor Netlify) en gepubliceerd. De voordelen zijn enorm:

Laadsnelheid

Allereerst de laadsnelheid. Omdat de server niet telkens de pagina opnieuw hoeft op te bouwen (zoals WordPress dat wel voor je doet, zonder caching dan), is de laadsnelheid van een JAMstack-site een stuk sneller. Voor deze site was het bijvoorbeeld een eitje om een score van 100 te halen in de Lighthouse benchmark van Google. Gemiddeld gezien is de laadtijd slechts 600 ms, en dat is echt enorm snel. Door het gebruik van React zijn laadtijden binnen de rest van de site zelfs 0 seconden, doordat alle inhoud slim ingeladen wordt als je eenmaal op de site bent.

Supersnel

Schaalbaarheid

Doordat de server niet telkens hoeft te rekenen, is de site ook enorm schaalbaar kan deze tienduizenden bezoekers tegelijk aan. En dat zonder enorme kosten aan servers (sterker nog, het kan gratis).

Beveiliging

Het gebruik van statische bestanden zorgt er ook voor dat de site praktisch onkwetsbaar is voor hackers. Er is immers geen systeem zoals WordPress waar lekken in zitten die misbruikt kunnen worden door kwaadwillenden.

PWA

Ook leuk, deze site is meteen een Progressive Web App. Als je de site op iOS of Android toevoegt aan je homescreen, kun je deze volledig offline blijven gebruiken.

Alles in git

Ook enorm fijn is de complete code van deze site inclusief content in versiebeheer staat. Daardoor kan ik gemakkelijk overal wijzigingen doorvoeren, of teruggaan naar een eerdere versie.

Ook vanuit het oogpunt van een developer is dit een enorm fijne manier om te werken, en voor mij persoonlijk echt een verademing ten opzichte van WordPress. Ik maak dankbaar gebruik van Gatsby, Netlify en Netlify CMS. Gatsby heeft een fantastische development omgeving en zorgt voor de snelle laadtijden, neemt het genereren van pagina's voor zijn rekening en zorgt ervoor dat deze site direct een PWA is. Via Netlify maak ik gebruik van Continuous Integration en Netlify CMS zorgt ervoor dat ik teksten online kan aanpassen, net zoals je dat bij WordPress ook kunt. Netlify CMS doet deze wijzigingen direct in Git, waarna Netlify een nieuwe build maakt en publiceert.

Je merkt het, ik ben erg enthousiast over al deze hulpmiddelen. In Nederland hebben we bijna overal 4G, en 5G komt eraan. En toch moet ik soms op mobiel nog heel lang wachten tot een pagina geladen is. Mijn website past nu weer binnen die 25 MB die ik aan het begin van het artikel nog belachelijk maakte.

Wat vond je van dit artikel?

Duimpje omlaagDuimpje omhoog