Wil je weten wat FID is? Heeft jouw website een slecht Core Web Vitals Assessment resultaat opgeleverd? Lees verder om meer te weten te komen en het op te lossen.
First Input Delay (FID) is de tijd die een gebruiker nodig heeft om een toets in te drukken op het toetsenbord en het resultaat op het scherm te zien. Dit is een indicator voor hoe snel de website reageert op een gebruiker. Input latency, de tijd die een gebruiker nodig heeft om een commando in te voeren en het resultaat te zien, wordt meestal gemeten in milliseconden (ms). Het is cruciaal dat een website een lage latentie heeft, omdat die van invloed is op hoe snel, responsief en gebruiksvriendelijk je website zal zijn. Hoe lager de invoervertraging, hoe responsiever een app of website aanvoelt.
De eerste invoervertraging is belangrijk omdat die van invloed is op hoe responsief je site aanvoelt voor gebruikers. Als je bijvoorbeeld een muis of trackpad gebruikt, zal er enige vertraging zijn tussen wanneer je klikt en wanneer je de cursor ziet bewegen. Hierdoor kan je site niet responsief en traag aanvoelen.
De first input delay (FID) test is een objectieve manier om te meten hoe lang het duurt voordat een app of website reageert op jouw invoer. Het meet hoeveel tijd er verstrijkt tussen wanneer je op het scherm tikt en wanneer er iets op het scherm gebeurt. Het testen van de eerste invoervertraging is belangrijk omdat het een maatstaf is voor hoe lang het duurt voordat de website op jouw invoer reageert.
Er zijn veel manieren om invoervertraging op een website te testen, maar ze hebben allemaal hun eigen voor- en nadelen. Een andere manier is door de ontwikkelaarstools van een browser of een online tool te gebruiken. Wij gebruikten een tool genaamd PageSpeed Insights om de prestaties van onze website te testen. Dit is een tool ontwikkeld door de Google Developers Studio en zijn geloofwaardigheid komt voort uit het feit dat het een tool van Google is die hun eigen technologie gebruikt om de meest nauwkeurige en bruikbare resultaten te geven.
Het geeft een score op hoe goed een website zal presteren en beoordeelt ook hoe goed de site gecodeerd is. We kregen een A- voor de codering, dus dat betekent dat de site het goed doet wat betreft de laadsnelheid van de pagina. Het eerste wat we deden was de snelheid van de homepage controleren. Deze test evalueert de tijd die je website nodig heeft om het eerste stukje tekst of afbeelding/video te tonen. Het toont ook ‘Tijd tot interactief’, wat de tijd is die je website nodig heeft om volledig interactief te worden voor de gebruiker. Verder controleert hij de tijd die nodig is om de grootste tekst, afbeelding of video zichtbaar te maken, ook wel LCP (Largest Contentful Paint) genoemd.
Al deze tests en hun resultaten worden gecombineerd om tot een conclusie te komen en te beslissen of de website goed presteert en een gebruikerservaring van hoge kwaliteit levert of niet. Als gevolg daarvan krijg je een beoordeling die ligt tussen een van de 3 categorieën. Een beoordeling van 0-49 is slecht, een beoordeling van 50-89 is voldoende of goed en een beoordeling van 90 of hoger is uitstekend. De beoordelingen die je website in afzonderlijke tests behaalde worden ook weergegeven, samen met de exacte testwaarden. Wij kregen bij deze test een score van 93/100, wat betekent dat de website gemakkelijk in minder dan een seconde laadt.
Dit komt omdat onze website een combinatie heeft van JavaScript en CSS waardoor hij sneller laadt. Bovendien ontdekten we dat er geen problemen waren met de prestaties van de site. Eén ding dat de FID-prestaties van je website sterk kan verbeteren is caching. Caching is de instelling van je browser om kopieën van eerder opgehaalde bronnen op te slaan voor later gebruik. Het is een essentieel onderdeel van de caching-theorie, die ook prefetching omvat, waarbij gegevens van een website worden opgehaald zodra je die bezoekt, en preloading, waarbij de pagina wordt geladen voordat je ergens op klikt.
Een ander zeer goed hulpmiddel om de FID- en UX-prestaties van je website te evalueren is het Chrome User Experience Report (CrUX). Het is een krachtige combinatie van de hierboven genoemde PageSpeed Insights, het Google BigQuery Data project de CrUX API. Dit hulpmiddel is vergelijkbaar met PageSpeed Insights, maar gebruikt Google BigQuery om de gegevens aan je te leveren. Daardoor kun je alle kleine details te weten komen over de dingen die ervoor zorgen dat je website langzaam laadt en niet meer reageert. Je krijgt ook te zien welk effect die veranderingen hebben en hoeveel van de prestaties van je website kunnen worden verbeterd door hun suggesties uit te voeren.
Hier zijn 3 tips om de FID-beoordeling van je website te verbeteren.
Progressief laden
Progressief laden is het tegenovergestelde van het in één keer laden van alle bronnen van je website. In plaats daarvan worden bronnen geladen naarmate ze nodig zijn en worden alleen de meest noodzakelijke gegevens eerst geladen. Een goed voorbeeld hiervan is het bundelen van alle JavaScript op je website in een enkel bestand met behulp van webpack. Het is niet de snelste oplossing, maar wel een van de gemakkelijkste en het kan veel verschil uitmaken voor de UX van je website.
Statische Content
Server rendering is het versturen van het volledige HTML-bestand van de webpagina naar een client als daarom wordt gevraagd. Dit kan echter behoorlijk veel middelen vergen en daarom leiden tot een trage, onaangename surfervaring. Om dit op te lossen kun je statische rendering van je website inschakelen via een statische site-generator van derden om een statische HTML-pagina van je website te renderen. Dit werkt misschien niet zo goed voor websites met veel content.
Taakverdeling
Elke browser heeft een hoofddraad die soms te druk kan worden voor goede laadsnelheden en snelle reactietijden. De oplossing? Maak een lijst van alle JavaScript-taken en -elementen die op je website draaien. Delegeer elke taak die groter is dan 100KB naar kleinere taken van minder dan 50KB. Hierdoor zal de hoofddraad van de browser deze taken als secundair kunnen behandelen en zullen laad- en reactietijden beslist verbeteren.
Snelle servers
De ruggengraat van elke website is de webserver waarop hij wordt gehost en uiteindelijk is het de webserver die de meeste invloed heeft op de prestaties van die website. De meeste webservers die er zijn bieden trage HDD-opslag, processoren met te weinig vermogen en gedeelde bronnen, waardoor je website gemiddelde prestaties levert en vreselijk lijdt onder grote hoeveelheden verkeer.
UltaHost is er om je te helpen! Al onze hostingplannen worden geleverd met bliksemsnelle NVMe SSD-opslag voor lage latentie en snelle laadtijden (Ja, zelfs onze gedeelde hostingplannen hebben NVMe SSD-opslag!). We bieden ook 24 uur per dag technische ondersteuning en toonaangevende uptime. Dus waar wacht je nog op? Meld je vandaag nog aan en verander je website-ervaring voorgoed!
Vond je dit artikel nuttig? Blijf onze blog lezen voor meer van dit soort dingen.
