Jetzt neu: NoState Prefetch

Katie Hempenius
Katie Hempenius

Einleitung

„NoState Prefetch“ ist ein neuer Mechanismus in Chrome, der eine Alternative zum veralteten Pre-Rendering-Prozess darstellt und Funktionen wie <link rel="prerender"> ermöglicht. Wie beim Pre-Rendering werden Ressourcen im Voraus abgerufen, aber im Gegensatz zum Pre-Rendering wird JavaScript nicht ausgeführt und kein Teil der Seite im Voraus gerendert. Das Ziel des NoState-Prefetch ist es, weniger Arbeitsspeicher als beim Pre-Rendering zu verwenden und gleichzeitig die Seitenladezeiten zu verkürzen.

NoState Prefetch ist keine API, sondern ein Mechanismus, mit dem Chrome verschiedene APIs und Funktionen implementiert. Die Resource Hints API und der Prefetch von Seiten über die Chrome-Adressleiste werden beide mit dem NoState-Prefetch implementiert. Wenn Sie Chrome 63 oder höher verwenden, verwendet Ihr Browser bereits den NoState-Prefetch für Funktionen wie <link rel="prerender">.

In diesem Artikel werden die Funktionsweise von NoStatePrefetch und die Gründe für die Einführung erläutert. Außerdem wird erläutert, wie man mithilfe der Histogramme von Chrome Nutzungsstatistiken anzeigen kann.

Ziel

Es gab zwei Hauptgründe für die Einführung von NoState Prefetch:

Arbeitsspeichernutzung reduzieren

Der NoState-Prefetch verwendet nur ca. 45 MiB Arbeitsspeicher. Die Aufrechterhaltung des Vorabladescanners ist die primäre Speicherkosten für den NoState-Prefetch und diese Kosten sind in verschiedenen Anwendungsfällen relativ konstant. Das Erhöhen der Größe oder des Volumens von Abrufen hat keine wesentlichen Auswirkungen auf den durch den NoState-Prefetch belegten Arbeitsspeicher.

Im Gegensatz dazu verbraucht das Pre-Rendering in der Regel 100 MiB Arbeitsspeicher und der Arbeitsspeicherverbrauch ist auf 150 MiB begrenzt. Aufgrund dieser hohen Speichernutzung ist er nicht für Low-End-Geräte (<= 512 MB RAM) geeignet. Aus diesem Grund führt Chrome auf Low-End-Geräten kein Pre-Rendering durch, sondern stellt stattdessen eine Verbindung vor.

Unterstützung neuer Webplattformfunktionen ermöglichen

Beim Pre-Rendering sollten keine für Nutzer sichtbaren Aktionen (z.B. Musik- oder Videowiedergabe) und keine zustandsorientierten Aktionen (z.B. Sitzungs- oder lokaler Speicher) ausgeführt werden. Es kann jedoch schwierig und komplex sein, diese Aktionen beim Rendern einer Seite zu verhindern. Der NoState-Prefetch ruft Ressourcen nur im Voraus ab: Er führt keinen Code aus und rendert die Seite nicht. Dadurch wird es einfacher, an Nutzer gerichtete und zustandsorientierte Aktionen zu verhindern.

Implementierung

Die folgenden Schritte erklären die Funktionsweise des NoState-Prefetch.

  1. „NoStatePrefetch“ wird ausgelöst.

    Ein Pre-Rendering-Ressourcenhinweis (z.B. <link rel="prerender">) und einige Chrome-Funktionen lösen den NoState-Prefetch aus, wenn die folgenden zwei Bedingungen erfüllt sind: a) Der Nutzer verwendet kein Low-End-Gerät und b) er sich nicht in einem Mobilfunknetz befindet.

  2. Für den NoState-Prefetch wird ein neuer, dedizierter Renderer erstellt.

    In Chrome ist ein Renderer ein Prozess, bei dem ein HTML-Dokument parsen, seine Rendering-Struktur erstellt und das Ergebnis auf den Bildschirm übertragen wird. Jeder Tab in Chrome und jeder NoState-Prefetch-Prozess hat einen eigenen Renderer, der isoliert wird. Dadurch werden die Auswirkungen eines Fehlers (z.B. ein Absturz eines Tabs) minimiert und es wird verhindert, dass schädlicher Code auf andere Tabs oder andere Teile des Systems zugreift.

  3. Die Ressource, die mit „NoState Prefetch“ geladen wird, wird abgerufen. Der HTMLPreloadScanner scannt diese Ressource dann, um alle Unterressourcen zu erkennen, die abgerufen werden müssen. Wenn die Hauptressource oder eine ihrer Unterressourcen einen registrierten Service Worker hat, werden diese Anfragen an den entsprechenden Service Worker weitergeleitet.

    Der NoState-Prefetch unterstützt nur die GET-HTTP-Methode. Er ruft keine Unterressourcen ab, für die andere HTTP-Methoden verwendet werden müssen. Außerdem werden keine Ressourcen abgerufen, für die Nutzeraktionen erforderlich sind (z.B. Pop-up-Authentifizierung, SSL-Clientzertifikat oder manuelle Überschreibungen).

  4. Abgerufene Unterressourcen werden mit der Nettopriorität „IDLE“ abgerufen.

    Die Nettopriorität „Inaktiv“ ist die niedrigste mögliche Nettopriorität in Chrome.

  5. Alle Ressourcen, die über den NoState-Prefetch abgerufen werden, werden entsprechend ihren Cache-Headern im Cache gespeichert.

    NoState Prefetch speichert alle Ressourcen außer denen mit dem Cache-Control-Header no-store im Cache. Eine Ressource wird vor der Verwendung neu validiert, wenn ein Vary-Antwortheader, no-cache Cache-Control-Header oder die Ressource älter als 5 Minuten ist.

  6. Der Renderer wird beendet, nachdem alle Unterressourcen geladen wurden.

    Bei einer Zeitüberschreitung für Unterressourcen wird der Renderer nach 30 Sekunden beendet.

  7. Der Browser nimmt abgesehen vom Aktualisieren des Cookiespeichers und des lokalen DNS-Cache keine Statusänderungen vor. Es ist wichtig, darauf hinzuweisen, da dies in „NoState Prefetch“ der „NoState“ ist.

    An diesem Punkt des „normalen“ Seitenladevorgangs würde der Browser wahrscheinlich Aktionen ausführen, die den Browserstatus ändern würden, z. B. JavaScript ausführen, sessionStorage oder localStorage ändern, Musik oder Videos abspielen, die History API verwenden oder den Nutzer auffordern. Die einzigen Statusänderungen, die beim NoState-Prefetch auftreten, sind die Aktualisierung des DNS-Cache beim Eintreffen von Antworten und die Aktualisierung des Cookiespeichers, wenn eine Antwort den Header Set-Cookie enthält.

  8. Wenn die Ressource benötigt wird, wird sie in das Browserfenster geladen.

    Im Gegensatz zu einer vorab gerenderten Seite ist die Seite jedoch nicht sofort sichtbar – sie muss noch vom Browser gerendert werden. Der Browser verwendet den Renderer, den er für den NoState-Prefetch verwendet hat, nicht noch einmal, sondern einen neuen Renderer. Wenn die Seite nicht im Voraus gerendert wird, verringert sich der Speicherverbrauch von NoStatePrefetch. Es werden aber auch die möglichen Auswirkungen auf die Seitenladezeiten verringert.

    Wenn die Seite einen Service Worker hat, wird der Seitenaufbau erneut durch den Service Worker geleitet.

    Wenn der NoState-Prefetch bis zum Zeitpunkt, zu dem die Seite benötigt wird, das Abrufen von Unterressourcen noch nicht abgeschlossen hat, fährt der Browser mit dem Seitenladevorgang an der Stelle fort, an der der NoState-Prefetch aufgehört hat. Der Browser muss weiterhin Ressourcen abrufen, jedoch nicht so viele, wie erforderlich wären, wenn der NoState-Prefetch nicht initiiert worden wäre.

Auswirkungen auf Webanalysen

Seiten, die mit dem NoState-Prefetch geladen werden, werden von Webanalysetools zu leicht unterschiedlichen Zeiten registriert, je nachdem, ob das Tool Daten clientseitig oder serverseitig erfasst.

Bei clientseitigen Analyseskripts wird ein Seitenaufruf registriert, wenn die Seite dem Nutzer angezeigt wird. Diese Skripts erfordern die Ausführung von JavaScript und „NoState Prefetch“ führt kein JavaScript aus.

Serverseitige Analysetools registrieren Messwerte, wenn eine Anfrage bearbeitet wird. Bei Ressourcen, die über den NoState-Prefetch geladen werden, kann es eine erhebliche Zeitverzögerung zwischen der Verarbeitung einer Anfrage und dem tatsächlichen Verwenden der Antwort durch den Client (falls überhaupt) geben. Seit Chrome 69 fügt der NoState-Prefetch allen Anfragen den Header Purpose: Prefetch hinzu, damit sie vom normalen Surfen unterschieden werden können.

Jetzt ansehen

NoStatePrefetch wurde im Dezember 2017 in Chrome 63 ausgeliefert. Sie wird derzeit für Folgendes verwendet:

  • prerender-Ressourcenhinweis implementieren
  • Erstes Ergebnis aus den Google-Suchergebnissen abrufen
  • Seiten abrufen, die laut Chrome-Adressleiste wahrscheinlich als Nächstes besucht werden

Sie können die internen Daten von Chrome verwenden, um zu sehen, wie Sie NoStatePrefetch verwendet haben.

Eine Liste der Websites, die mit NoState Prefetch geladen wurden, finden Sie unter chrome://net-internals/#prerender.

Um Statistiken zur Nutzung von NoState Prefetch zu sehen, rufen Sie chrome://histograms auf und suchen Sie nach „NoStatePrefetch“. Es gibt drei verschiedene NoState Prefetch-Histogramme – eines für jeden Anwendungsfall von NoState Prefetch:

  • „NoStatePrefetch“ (Statistiken zur Nutzung durch Pre-Rendering-Ressourcenhinweise)
  • „gws_NoStatePrefetch“ (Statistiken zur Nutzung durch die Google-Suchergebnisseite)
  • „Omnibox_NoStatePrefetch“ (Statistiken zur Nutzung durch die Chrome-Adressleiste)