Maak kennis met NoState Prefetch

Katie Hempenius

Intro

NoState Prefetch is een nieuw mechanisme in Chrome dat een alternatief is voor het verouderde prerendering-proces , dat wordt gebruikt om functies als <link rel="prerender"> aan te sturen. Net als bij pre-rendering worden bronnen vooraf opgehaald; maar in tegenstelling tot pre-rendering voert het JavaScript niet uit en geeft het geen enkel deel van de pagina vooraf weer. Het doel van NoState Prefetch is om minder geheugen te gebruiken dan pre-rendering, terwijl de laadtijden van de pagina nog steeds worden verkort.

NoState Prefetch is geen API, maar eerder een mechanisme dat door Chrome wordt gebruikt om verschillende API's en functies te implementeren. De Resource Hints API en het vooraf ophalen van pagina's via de Chrome-adresbalk worden beide geïmplementeerd met behulp van NoState Prefetch. Als u Chrome 63 of hoger gebruikt, gebruikt uw browser NoState Prefetch al voor functies zoals <link rel="prerender"> .

In dit artikel wordt uitgelegd hoe NoStatePrefetch werkt, de motivaties voor de introductie ervan en instructies voor het gebruik van de histogrammen van Chrome om statistieken over het gebruik ervan te bekijken.

Motivatie

Er waren twee primaire motivaties voor de introductie van NoState Prefetch:

Verminder het geheugengebruik

NoState Prefetch gebruikt slechts ~45 MiB geheugen. Het onderhouden van de preload-scanner is de belangrijkste geheugenkosten voor NoState Prefetch en deze kosten blijven relatief constant in verschillende gebruiksscenario's. Het vergroten van de grootte of het volume van ophaalacties heeft geen significant effect op de hoeveelheid geheugen die door NoState Prefetch wordt verbruikt.

Daarentegen verbruikt pre-rendering doorgaans 100 MiB geheugen en is het geheugenverbruik beperkt tot 150 MiB. Dit hoge geheugenverbruik maakt het ongeschikt voor low-end (dat wil zeggen <= 512 MB RAM) apparaten. Als gevolg hiervan voert Chrome geen pre-rendering uit op goedkope apparaten, maar maakt het in plaats daarvan vooraf verbinding .

Ondersteuning van nieuwe webplatformfuncties faciliteren

Bij prerendering mogen er geen gebruikersgerichte (bijvoorbeeld muziek of video afspelen) of stateful acties (bijvoorbeeld het muteren van een sessie of lokale opslag) plaatsvinden. Het kan echter moeilijk en complex zijn om te voorkomen dat deze acties plaatsvinden tijdens het weergeven van een pagina. NoState Prefetch haalt alleen bronnen vooraf op: het voert geen code uit en geeft de pagina niet weer. Dit maakt het eenvoudiger om te voorkomen dat gebruikersgerichte en stateful acties plaatsvinden.

Implementatie

In de volgende stappen wordt uitgelegd hoe NoState Prefetch werkt.

1. NoStatePrefetch wordt geactiveerd.

   Een prerender-resourcehint (dat wil zeggen <link rel="prerender"> ) en sommige Chrome-functies activeren NoState Prefetch, op voorwaarde dat aan de volgende twee voorwaarden wordt voldaan: a) de gebruiker bevindt zich niet op een low-end apparaat, en b) de gebruiker bevindt zich niet op een mobiel netwerk.

2. Er is een nieuwe, speciale renderer gemaakt voor de NoState Prefetch.

   In Chrome is een ' renderer ' een proces dat verantwoordelijk is voor het nemen van een HTML-document, het parseren ervan, het samenstellen van de renderboom en het schilderen van het resultaat naar het scherm. Elk tabblad in Chrome, evenals elk NoState Prefetch-proces, heeft zijn eigen renderer om isolatie te bieden. Dit helpt de gevolgen te minimaliseren als er iets misgaat (bijvoorbeeld een tabblad dat crasht) en voorkomt dat kwaadaardige code toegang krijgt tot andere tabbladen of andere delen van het systeem.

3. De bron die wordt geladen met NoState Prefetch wordt opgehaald. De HTMLPreloadScanner scant vervolgens deze bron om eventuele subbronnen te ontdekken die moeten worden opgehaald. Als de hoofdresource of een van de subresources een geregistreerde servicemedewerker heeft, lopen deze verzoeken via de juiste servicemedewerker.

   NoState Prefetch ondersteunt alleen de GET HTTP-methode; er worden geen subbronnen opgehaald waarvoor het gebruik van andere HTTP-methoden vereist is. Bovendien haalt het geen bronnen op waarvoor gebruikersacties nodig zijn (bijvoorbeeld auth-pop-ups, SSL-clientcertificaat of handmatige overschrijvingen).

4. Subbronnen die worden opgehaald, worden opgehaald met een 'IDLE'-nettoprioriteit.

   De 'IDLE'-nettoprioriteit is de laagst mogelijke nettoprioriteit in Chrome.

5. Alle bronnen die door NoState Prefetch worden opgehaald, worden in de cache opgeslagen op basis van hun cacheheaders.

   NoState Prefetch zal alle bronnen in de cache opslaan, behalve die met de no-store Cache-Control header. Een bron wordt vóór gebruik opnieuw gevalideerd als er een Vary antwoordheader, no-cache Cache-Control-header is of als de bron meer dan 5 minuten oud is.

6. De renderer wordt afgesloten nadat alle subbronnen zijn geladen.

   Als er een time-out voor subbronnen optreedt, wordt de renderer na 30 seconden beëindigd.

7. De browser brengt geen wijzigingen aan in de status, behalve het bijwerken van de cookie-opslag en de lokale DNS-cache. Het is belangrijk om dit aan te roepen, omdat dit de “NoState” is in “NoState Prefetch”.

   Op dit punt in het ‘normale’ laadproces van de pagina zou de browser waarschijnlijk dingen doen die de browserstatus zouden wijzigen: bijvoorbeeld JavaScript uitvoeren, sessionStorage of localStorage muteren, muziek of video’s afspelen, de History API gebruiken of de gebruiker vragen . De enige statuswijzigingen die plaatsvinden in NoState Prefetch zijn het bijwerken van de DNS-cache wanneer antwoorden binnenkomen en het bijwerken van de cookie-opslag als een antwoord de Set-Cookie header bevat.

8. Wanneer de bron nodig is, wordt deze in het browservenster geladen.

   In tegenstelling tot een vooraf weergegeven pagina zal de pagina echter niet onmiddellijk zichtbaar zijn; deze moet nog steeds door de browser worden weergegeven. De browser zal de renderer die hij gebruikte voor de NoState Prefetch niet hergebruiken en zal in plaats daarvan een nieuwe renderer gebruiken. Het niet vooraf weergeven van de pagina vermindert het geheugengebruik van NoStatePrefetch, maar vermindert ook de mogelijke impact die dit kan hebben op de laadtijden van de pagina.

   Als de pagina een servicemedewerker heeft, verloopt het laden van de pagina opnieuw via de servicemedewerker.

   Als NoState Prefetch nog niet klaar is met het ophalen van subbronnen op het moment dat de pagina nodig is, gaat de browser verder met het laden van de pagina vanaf het punt waar NoState Prefetch was gebleven. De browser zal nog steeds bronnen moeten ophalen, maar niet zoveel als nodig zou zijn als NoState Prefetch niet was gestart.

Impact op webanalyse

Pagina's die worden geladen met NoState Prefetch worden op enigszins verschillende tijdstippen door webanalysetools geregistreerd, afhankelijk van of de tool gegevens verzamelt aan de clientzijde of aan de serverzijde.

Analysescripts aan de clientzijde registreren een paginaweergave wanneer de pagina aan de gebruiker wordt getoond. Deze scripts zijn afhankelijk van de uitvoering van JavaScript en NoState Prefetch voert geen JavaScript uit.

Analysetools aan de serverzijde registreren statistieken wanneer een verzoek wordt afgehandeld. Voor bronnen die via NoState Prefetch worden geladen, kan er een aanzienlijk tijdsverschil zitten tussen het moment waarop een verzoek wordt afgehandeld en het moment waarop het antwoord daadwerkelijk door de client wordt gebruikt (als dit überhaupt wordt gebruikt). Sinds Chrome 69 voegt NoState Prefetch de header Purpose: Prefetch toe aan alle verzoeken om ze te onderscheiden van normaal browsen.

Bekijken

NoStatePrefetch werd in december 2017 uitgebracht in Chrome 63. Het wordt momenteel gebruikt om:

• Implementeer de prerender resourcehint
• Haal het eerste resultaat op in de zoekresultaten van Google
• Haal pagina's op waarvan de Chrome-adresbalk voorspelt dat ze waarschijnlijk als volgende zullen worden bezocht

U kunt de Chrome Internals gebruiken om te zien hoe u NoStatePrefetch heeft gebruikt.

Ga naar chrome://net-internals/#prerender om de lijst met sites te bekijken die zijn geladen met NoState Prefetch.

Om statistieken over uw NoState Prefetch-gebruik te bekijken, gaat u naar chrome://histograms en zoekt u naar “NoStatePrefetch”. Er zijn drie verschillende NoState Prefetch-histogrammen - één voor elk gebruiksscenario van NoState Prefetch:

• “NoStatePrefetch” (statistieken voor gebruik door bronhints vooraf renderen)
• “gws_NoStatePrefetch” (statistieken voor gebruik door de Google-zoekresultatenpagina)
• “omnibox_NoStatePrefetch” (statistieken voor gebruik door de Chrome-adresbalk)