Novità: NoState Prefetch

Katie Hempenius

Introduzione

La prelettura senza stato è un nuovo meccanismo di Chrome che rappresenta un'alternativa al processo di prerendering ritirato, utilizzato per supportare funzionalità come <link rel="prerender">. Come il prerendering, recupera le risorse in anticipo, ma, a differenza del prerendering, non esegue JavaScript né esegue il rendering di alcuna parte della pagina in anticipo. Lo scopo di NoState Prefetch è utilizzare meno memoria rispetto al prerendering, riducendo al contempo i tempi di caricamento della pagina.

La prelettura senza stato non è un'API, ma un meccanismo utilizzato da Chrome per implementare varie API e funzionalità. L'API Resource Hints, nonché il precaricamento delle pagine da parte della barra degli indirizzi di Chrome, sono entrambi implementati utilizzando il precaricamento senza stato. Se utilizzi Chrome 63 o versioni successive, il browser utilizza già la prelettura senza stato per funzionalità come <link rel="prerender">.

Questo articolo spiega come funziona NoStatePrefetch, le motivazioni alla base della sua introduzione e le istruzioni per utilizzare le tabelle di distribuzione di Chrome per visualizzare le statistiche sul suo utilizzo.

Motivazione

L'introduzione del prefetch NoState è stata motivata da due fattori principali:

Ridurre l'utilizzo della memoria

Il precaricamento NoState utilizza solo circa 45 MB di memoria. La gestione dello scanner di precaricamento è la spesa di memoria principale per la prelettura NoState e questo costo rimane relativamente costante nei diversi casi d'uso. L'aumento delle dimensioni o del volume dei recuperi non ha un effetto significativo sulla quantità di memoria consumata da NoState Prefetch.

Al contrario, il prerendering in genere consuma 100 MB di memoria e il consumo di memoria è limitato a 150 MB. Questo elevato utilizzo della memoria lo rende inadatto per i dispositivi di fascia bassa (ovvero con meno di 512 MB di RAM). Di conseguenza, Chrome non esegue il prerendering sui dispositivi di fascia bassa, ma eseguirà la preconnessione.

Facilitare il supporto delle nuove funzionalità della piattaforma web

Con il prerendering, non devono verificarsi azioni rivolte agli utenti (ad es. riproduzione di musica o video) o con stato (ad es. mutazione della sessione o della memoria locale). Tuttavia, può essere difficile e complesso impedire che queste azioni si verifichino durante il rendering di una pagina. La prelettura NoState recupera solo le risorse in anticipo: non esegue codice né esegue il rendering della pagina. In questo modo è più semplice evitare che si verifichino azioni rivolte agli utenti e con stato.

Implementazione

I passaggi riportati di seguito spiegano come funziona la prelettura NoState.

1. NoStatePrefetch viene attivato.

   Un suggerimento per le risorse di prerendering (ad es. <link rel="prerender">) e alcune funzionalità di Chrome attiveranno la prelettura senza stato se sono soddisfatte le due seguenti condizioni: a) l'utente non utilizza un dispositivo di fascia bassa e b) l'utente non utilizza una rete mobile.

2. Per la prelettura NoState viene creato un nuovo visualizzatore dedicato.

   In Chrome, un "renderizzatore" è un processo responsabile dell'acquisizione di un documento HTML, della sua analisi, della costruzione della relativa struttura di rendering e della visualizzazione del risultato sullo schermo. Ogni scheda di Chrome, così come ogni processo di prelettura NoState, ha il proprio visualizzatore per garantire l'isolamento. In questo modo, contribuisci a ridurre al minimo gli effetti di un eventuale errore (ad esempio, l'arresto anomalo di una scheda) e a impedire al codice dannoso di accedere ad altre schede o ad altre parti del sistema.

3. La risorsa che viene caricata con la prelettura senza stato viene recuperata. HTMLPreloadScanner scandisce quindi questa risorsa per rilevare eventuali risorse secondarie da recuperare. Se la risorsa principale o una delle sue risorse secondarie ha un servizio worker registrato, queste richieste passeranno attraverso il servizio worker appropriato.

   La prelettura NoState supporta solo il metodo HTTP GET. Non recupererà le risorse secondarie che richiedono l'utilizzo di altri metodi HTTP. Inoltre, non recupererà le risorse che richiedono azioni dell'utente (ad es. popup di autenticazione, certificato client SSL o sostituzioni manuali).

4. Le risorse secondarie recuperate verranno recuperate con una priorità di rete "IDLE".

   La priorità di rete "IDLE" è la priorità di rete più bassa possibile in Chrome.

5. Tutte le risorse recuperate dal precaricamento NoState vengono memorizzate nella cache in base alle relative intestazioni della cache.

   La prelettura senza stato memorizza nella cache tutte le risorse tranne quelle con l'intestazione no-store Cache-Control. Una risorsa verrà convalidata di nuovo prima dell'utilizzo se è presente un Varyheader di risposta,no-cache un no-cacheheader Cache-Control o se la risorsa è stata creata più di 5 minuti fa.

6. Il renderer viene interrotto dopo il caricamento di tutte le risorse secondarie.

   Se le risorse secondarie scadono, il rendering verrà interrotto dopo 30 secondi.

7. Il browser non apporta modifiche allo stato, ad eccezione dell'aggiornamento del cookie store e della cache DNS locale. È importante sottolineare questo aspetto perché si tratta del "NoState" in "Prefetch NoState".

   A questo punto del processo di caricamento della pagina "normale", il browser probabilmente eseguirà operazioni che modificheranno il suo stato: ad esempio, eseguirà JavaScript, modificherà sessionStorage o localStorage, riprodurrà musica o video, utilizzerà l'API History o chiederà all'utente di eseguire un'azione. Le solite modifiche dello stato che si verificano nella prelettura senza stato sono l'aggiornamento della cache DNS quando arrivano le risposte e l'aggiornamento del cookie store se una risposta contiene l'Set-Cookie.

8. Quando la risorsa è necessaria, viene caricata nella finestra del browser.

   Tuttavia, a differenza di una pagina pre-riferita, la pagina non sarà immediatamente visibile, ma dovrà essere ancora visualizzata dal browser. Il browser non riutilizzerà il renderer utilizzato per la prelettura NoState, ma ne utilizzerà uno nuovo. Il mancato rendering della pagina riduce il consumo di memoria di NoStatePrefetch, ma riduce anche il possibile impatto che può avere sui tempi di caricamento della pagina.

   Se la pagina ha un service worker, il caricamento della pagina verrà eseguito di nuovo tramite il service worker.

   Se il pre-caricamento senza stato non ha terminato il recupero delle risorse entro il momento in cui la pagina è necessaria, il browser continuerà il processo di caricamento della pagina da dove si era interrotto il pre-caricamento senza stato. Il browser dovrà comunque recuperare le risorse, ma non quante sarebbero necessarie se il pre-caricamento senza stato non fosse stato avviato.

Impatto su Web Analytics

Le pagine caricate utilizzando la prelettura senza stato vengono registrate dagli strumenti di analisi web in momenti leggermente diversi, a seconda che lo strumento raccolga i dati lato client o lato server.

Gli script di analisi lato client registrano una visualizzazione di pagina quando la pagina viene mostrata all'utente. Questi script si basano sull'esecuzione di JavaScript e la prelettura NoState non esegue JavaScript.

Gli strumenti di analisi lato server registrano le metriche quando viene gestita una richiesta. Per le risorse caricate tramite pre-caricamento NoState, può esserci un intervallo di tempo significativo tra il momento in cui viene gestita una richiesta e il momento in cui la risposta viene effettivamente utilizzata dal client (se viene utilizzata). A partire da Chrome 69, la prelettura senza stato aggiunge l'intestazione Purpose: Prefetch a tutte le richieste per distinguerle dalla normale navigazione.

Dai un'occhiata

NoStatePrefetch è stato rilasciato a dicembre 2017 in Chrome 63. Attualmente viene utilizzata per:

• Implementa l'indicazione della risorsa prerender
• Recuperare il primo risultato nei risultati della Ricerca Google
• Recuperare le pagine che la barra degli indirizzi di Chrome prevede che verranno visitate successivamente

Puoi utilizzare gli elementi interni di Chrome per vedere come hai utilizzato NoStatePrefetch.

Per visualizzare l'elenco dei siti che sono stati caricati con la prelettura senza stato, vai a chrome://net-internals/#prerender.

Per visualizzare le statistiche sull'utilizzo di Prefetch senza stato, vai a chrome://histograms e cerca "NoStatePrefetch". Esistono tre diverse tabelle di distribuzione di Prefetch senza stato, una per ogni caso d'uso di Prefetch senza stato:

• "NoStatePrefetch" (statistiche sull'utilizzo in base ai suggerimenti relativi alle risorse di prerendering)
• "gws_NoStatePrefetch" (statistiche relative all'utilizzo da parte della pagina dei risultati di ricerca di Google)
• "omnibox_NoStatePrefetch" (statistiche sull'utilizzo da parte della barra degli indirizzi di Chrome)