Gepubliceerd: 20 juli 2018
Inleiding
NoState Prefetch is een nieuw mechanisme in Chrome dat een alternatief biedt voor het verouderde prerenderingproces , dat wordt gebruikt om functies zoals <link rel="prerender"> aan te sturen. Net als bij prerendering worden resources vooraf opgehaald, maar in tegenstelling tot prerendering worden er geen JavaScript-codes uitgevoerd en wordt er geen enkel deel van de pagina vooraf gerenderd. Het doel van NoState Prefetch is om minder geheugen te gebruiken dan bij prerendering, terwijl de laadtijd van de pagina toch wordt verkort.
NoState Prefetch is geen API, maar een mechanisme dat door Chrome wordt gebruikt om verschillende API's en functies te implementeren. De Resource Hints API en het prefetchen van pagina's via de adresbalk van Chrome worden beide geïmplementeerd met 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, wat de redenen zijn voor de introductie ervan en hoe u de histogrammen van Chrome kunt gebruiken om statistieken over het gebruik ervan te bekijken.
Motivatie
Er waren twee primaire redenen voor de introductie van NoState Prefetch:
Verminder het geheugengebruik
NoState Prefetch gebruikt slechts ~45 MiB geheugen. Het onderhouden van de preloadscanner is de belangrijkste geheugenkost voor NoState Prefetch en deze kost blijft relatief constant in verschillende use cases. Het vergroten van de grootte of het volume van de ophaalacties heeft geen significant effect op de hoeveelheid geheugen die NoState Prefetch verbruikt.
Prerendering daarentegen verbruikt doorgaans 100 MB geheugen en het geheugengebruik is beperkt tot 150 MB. Dit hoge geheugenverbruik maakt het ongeschikt voor low-end apparaten (d.w.z. <= 512 MB RAM). Daarom voert Chrome geen prerendering uit op low-end apparaten en maakt het in plaats daarvan gebruik van preconnect .
Ondersteuning van nieuwe webplatformfuncties vergemakkelijken
Bij prerendering mogen er geen gebruikersgerichte (bijvoorbeeld het afspelen van muziek of video) of stateful acties (bijvoorbeeld het muteren van sessies of lokale opslag) plaatsvinden. Het kan echter lastig en complex zijn om te voorkomen dat deze acties plaatsvinden tijdens het renderen van een pagina. NoState Prefetch haalt alleen resources vooraf op: het voert geen code uit en rendert de pagina niet. Dit maakt het eenvoudiger om gebruikersgerichte en stateful acties te voorkomen.
Uitvoering
De volgende stappen leggen uit hoe NoState Prefetch werkt.
NoStatePrefetch wordt geactiveerd.
Een prerender resource hint (bijv.
<link rel="prerender">) en enkele Chrome-functies activeren NoState Prefetch, mits aan de volgende twee voorwaarden wordt voldaan: a) de gebruiker gebruikt geen low-end apparaat, en b) de gebruiker is niet verbonden met een mobiel netwerk.Er is een nieuwe, speciale renderer gemaakt voor de NoState Prefetch.
In Chrome is een " renderer " een proces dat verantwoordelijk is voor het parseren van een HTML-document, het samenstellen van de rendertree en het weergeven van het resultaat op het scherm. Elk tabblad in Chrome, evenals elk NoState Prefetch-proces, heeft een eigen renderer voor isolatie. Dit helpt de gevolgen van een fout (bijvoorbeeld een crashend tabblad) te minimaliseren en voorkomt dat schadelijke code toegang krijgt tot andere tabbladen of andere delen van het systeem.
De resource die met NoState Prefetch wordt geladen, wordt opgehaald. De HTMLPreloadScanner scant deze resource vervolgens om eventuele subresources te detecteren die moeten worden opgehaald. Als de hoofdresource of een van de subresources een geregistreerde service worker heeft, worden deze aanvragen via de juiste service worker verwerkt.
NoState Prefetch ondersteunt alleen de GET HTTP-methode; het haalt geen subresources op die het gebruik van andere HTTP-methoden vereisen. Bovendien haalt het geen resources op die gebruikersacties vereisen (bijv. authenticatiepop-ups, SSL-clientcertificaten of handmatige overschrijvingen).
Opgehaalde subbronnen worden opgehaald met een 'IDLE'-netprioriteit.
De “IDLE”-netprioriteit is de laagst mogelijke netprioriteit in Chrome.
All resources retrieved by the NoState Prefetch are cached according to their cache headers.
NoState Prefetch cachet alle resources, behalve die met de
no-storeCache-Control header. Een resource wordt opnieuw gevalideerd vóór gebruik als er eenVaryresponse header,no-cacheCache-Control header of als de resource ouder is dan 5 minuten.De renderer wordt beëindigd nadat alle subresources zijn geladen.
Als de subresources een time-out krijgen, wordt de renderer na 30 seconden afgesloten.
De browser voert geen statuswijzigingen door, behalve het bijwerken van de cookie-opslag en de lokale DNS-cache. Het is belangrijk om dit te vermelden, 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 wijzigen: bijvoorbeeld JavaScript uitvoeren,
sessionStorageoflocalStoragemuteren, muziek of video's afspelen, de History API gebruiken of de gebruiker vragen om een melding. De enige statuswijzigingen die plaatsvinden in NoState Prefetch zijn het bijwerken van de DNS-cache wanneer reacties binnenkomen en het bijwerken van de cookie-opslag als een reactie deSet-Cookie-header bevat.Wanneer de bron nodig is, wordt deze in het browservenster geladen.
In tegenstelling tot een vooraf gerenderde pagina is de pagina echter niet direct zichtbaar - deze moet nog steeds door de browser worden gerenderd. De browser hergebruikt de renderer die hij voor de NoState Prefetch heeft gebruikt niet, maar gebruikt in plaats daarvan een nieuwe renderer. Door de pagina niet vooraf te renderen, wordt het geheugengebruik van NoStatePrefetch verminderd, maar ook de mogelijke impact op de laadtijd van de pagina.
Als de pagina een service worker heeft, zal de pagina opnieuw via de service worker worden geladen.
Als NoState Prefetch de subresources nog niet heeft opgehaald 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 gestopt. De browser moet nog steeds resources ophalen, maar niet zoveel als nodig zou zijn als NoState Prefetch niet was gestart.
Impact op webanalyse
Pagina's die met NoState Prefetch worden geladen, worden door webanalysetools op iets verschillende tijdstippen geregistreerd, afhankelijk van of de tool gegevens aan de clientzijde of aan de serverzijde verzamelt.
Client-side analytics-scripts 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 aanvraag wordt verwerkt. Voor resources die via NoState Prefetch worden geladen, kan er een aanzienlijke tijd zitten tussen het moment waarop een aanvraag wordt verwerkt en het moment waarop de respons daadwerkelijk door de client wordt gebruikt (als deze überhaupt wordt gebruikt). Sinds Chrome 69 voegt NoState Prefetch de header Purpose: Prefetch toe aan alle aanvragen om ze te onderscheiden van normaal browsen.
Kijk eens
NoStatePrefetch werd in december 2017 uitgebracht in Chrome 63. Het wordt momenteel gebruikt om:
- Implementeer de
prerenderresource hint - Haal het eerste resultaat op in de Google-zoekresultaten
- Haal pagina's op waarvan de adresbalk van Chrome voorspelt dat ze waarschijnlijk als volgende worden bezocht
U kunt de Chrome Internals gebruiken om te zien hoe u NoStatePrefetch hebt 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 prerender resource hints)
- “gws_NoStatePrefetch” (statistieken voor gebruik door de Google-zoekresultatenpagina)
- “omnibox_NoStatePrefetch” (statistieken voor gebruik door de adresbalk van Chrome)