Prerendering

Prerendering bezeichnet das Vorladen einer Ressource in den Cache eines Browsers. Mittels des Attributs rel="prerender" und einem href-Attribut, das auf eine Website verweist, wird die Ressource im Hintergrund geladen – ohne dass der Nutzer dies bemerkt. Beim Aufruf der referenzierten Website wird diese fast unmittelbar dargestellt, weil sie bereits vorgerendert worden ist.

Allgemeine Informationen zum Thema

Prerendering ist ein Konzept, das bereits im Jahr 2011 von Google präsentiert und im Chrome-Browser im gleichen Jahr zumindest teilweise implementiert wurde. Die Grundidee besteht darin, dass bei bestimmten Websites bestimmte Inhalte als nächstes vom Nutzer geladen werden – ähnlich wie beim Link Prefetching. Dies ist zum Beispiel der Fall bei

• Newsportalen mit Artikeln, die sich über mehrere Unterseiten verteilen,
• paginierten Websites,
• Websites mit speicherintensiven Dateien oder Skripten, oder
• den ersten Ergebnissen auf einer Suchergebnisseite,
• Nutzerinteraktionen, die den Aufruf der nächsten Website vermuten lassen.

Der Browser ruft alle Ressourcen ab, die für die Darstellung der nächsten Website erforderlich sind. Dazu zählen auch Skripte, CSS, Bilder oder andere Medien. Laut Google hat dies den Effekt, dass der Nutzer die vorgerenderte Website unmittelbar verwenden kann. Google nutzt die Technik des Prerenderings ebenfalls für die Darstellung von Websites, die in den ersten Ergebnissen der SERPs zu finden sind. Die Technologie gab es schon länger.

Jedoch ist die Frage von Bedeutung, welche Ressourcen vorgerendert werden sollen. Denn lediglich große Portale können das Nutzerverhalten mithilfe ihrer Daten zuverlässig voraussagen – genauso wie Nutzer in den SERPs höchstwahrscheinlich die ersten Ergebnisse anklicken. Falls Ressourcen vorgerendert werden, die der Nutzer nicht als nächstes anklickt, kann dies die Ladezeit erhöhen. Um das Verhalten von Websites in solchen Fällen zu steuern, empfiehlt Google die Page Visibility API, um zu erkennen, ob eine Website gerade im Vordergrund oder Hintergrund angezeigt oder vorgerendert wird.

Funktionsweise

Das Rendern einer Website, bevor der Nutzer diese explizit aufruft, erfolgt über das Link-Element mit dem Attrribut rel und dem Wert prerender. Die folgende Codezeile wird auf der Website notiert, die der Nutzer gerade besucht:

<link rel="prerender" href="//www.beispiel.de">

Der Browser registriert diese Referenz und erzeugt einen versteckten Tab, in den die Inhalte der refrenzierten Website geladen werden – inklusive JavaScript-Anweisungen. Der Prerender-Hinweis wird nicht an das Netzwerk gesendet, vielmehr wird das Signal (ResourceType::Prerender) von dem sogenannten ResourceDispatcherHost aufgenommen und dazu verwendet, die PrerenderContents zu laden. Diese Inhalte werden vom PrerenderManager in einem Verzeichnis verwaltet. Dort liegen sie bis zu 30 Sekunden abrufbar bereit. Im Falle von mehreren Inhalten, die vorgerendert wurden, werden die zuletzt verwendeten Inhalte durch einen Algorithmus gespeichert und im Verzeichnis bereitgehalten.

Wenn der Nutzer eine URL in die Adresszeile des Browsers eingibt, wird geprüft, ob diese URL eine der vorgerenderten URLs matcht. Wenn der Nutzer einen Link anklickt, geschieht dasselbe. Wenn eine URL oder ein Link mit den Inhalten des Verzeichnisses übereinstimmt, wird ein Eintrag des Verzeichnisses gelöscht und der versteckte Tab (TabContentsWrapper) wird zu dem sichtbaren Tab (TabContents). Zur Steuerung des Verhaltens von Websites kann zusätzlich die Page Visibility API verwendet werden. Zum Beispiel, um herauszufinden, wie der Zustand einer Website aktuell ist – versteckt, prerendering oder potenziell sichtbar.

Praxisbezug

Es besteht beim Prerendering ein gewisses Risiko, die Ladezeiten zu erhöhen. Aufgrund der Tatsache, dass mehrere Ressourcen geladen werden, kann es zwischen diesen zu Konflikten kommen. Das führt auch dazu, dass der Cache und die CPU mehr belastet werden. Deshalb verfolgt Google eine Strategie der Priorisierung von Ressourcen: Prerendering arbeitet mit dem niedrigsten Level an Priorität. Entsprechend sind die Verbindungen im Netzwerk höher bewertet: Ist eine Verbindung aktiv, kann es Einschränkungen beim Prerendering geben, weil vorgerenderte Ressourcen geordnet werden.

Zudem sind höchstens drei Prerendering-Vorgänge pro Domain möglich und falls die Ressourcen mehr als 150 MB Cache-Speicher benötigen, wird die Verbindung gekappt. Auf CPU-Level muss ein Prozess verfügbar sein. Ansonsten findet kein Prerendering statt. Im Falle von Multimedia-Ressourcen gibt es weitere Ausnahmen, die durch ein Plug-in gesteuert werden. Zum Beispiel wird verhindert, das Ressourcen sich automatisch abspielen, wenn sie in einem versteckten Tab geladen werden. Darüber hinaus gibt es weitere Fälle, die einen Stopp des Prerenderings nach sich ziehen – Beispielsweise Authentifizierungen per Formular oder ein angefordertes SSL-Zeritifikat. Es existieren also einige Ausnahmen, die das Prerendering außer Kraft setzen.

Bedeutung für die Programmierung

Prerendering ist nur bei bestimmten Szenarien sinnvoll. Die Einbindung von rel=“prerender“ sollte sich deshalb am Kontext der Website, dem Nutzerverhalten und den Konfigurationen von Server und Client sowie dem jeweiligen Endgerät orientieren. Zwar kann die Performance um einige Millisekunden verbessert werden, aber der Einsatz des Prerenderings ist stets mit Vorsicht zu genießen. Es gibt durchaus Fälle, in denen es nicht zu empfehlen ist. So zum Beispiel bei eingeloggten Accounts und dem Vorabruf von Abmelde-Websites oder Tracking-Skripten, die auf der vorgerenderten Website ausgeführt werden. Denn das Aufrufen dieser Skripte würde die Webanalyse-Statistiken und die Daten von AdServern verfälschen. Hinzu kommt, dass die Unterstützung durch den Browser nicht immer gegeben ist. Bei Mozilla werden ähnliche Mechanismen beispielsweise als Link Prefetching bezeichnet und erfordern ein anderes Markup.

Weblinks

• Prefetching, preloading, prebrowsing
• Praxistest zum Thema Prerendering
• Mehr Infos zu Prebrowsing, Prerendering und Preloading
• Prefetching in HTML5