Prefetch

Prefetching bezieht sich auf die Praxis, Dokumente oder Subressourcen spekulativ im Hintergrund abzurufen, für Seiten, zu denen der Benutzer wahrscheinlich in naher Zukunft navigieren wird. Dies kann die Ladezeit für die vorab abgerufene Seite erheblich verkürzen, wenn der Benutzer sich entscheidet, zu ihr zu navigieren. Prefetching könnte zum Beispiel verwendet werden, um die Seite abzurufen, die mit einem "Weiter"-Button verlinkt ist, oder ihre Subressourcen, oder ein Link-Popup, über das ein Benutzer schwebt, oder Suchergebnisse.

Ressourcen-Prefetching

Ressourcen sollten basierend darauf vorab abgerufen werden, wie wahrscheinlich es ist, dass sie in einer zukünftigen Navigation benötigt werden. Browser können dies für einige Ressourcen automatisch ableiten, wie z.B. die aktuelle URL in der Adressleiste.

Dies kann mit <link rel="prefetch"> durchgeführt werden (die Speculation Rules API behandelt nur Dokument-Prefetches für Navigationszwecke):

html
<link rel="prefetch" href="next.html" />

Dokument-Prefetching

Entwickler können dem Browser auf verschiedene Weisen Hinweise auf Navigationsvorgänge geben, die vorab abgerufen werden sollten:

<link rel="prefetch">:

html
<link rel="prefetch" href="next.html" />

Speculation Rules API Prefetch:

html
<script type="speculationrules">
  {
    "prefetch": [
      {
        "source": "list",
        "urls": ["next.html"]
      }
    ]
  }
</script>

Die Speculation Rules API behandelt Dokument-Prefetches für Navigationen viel besser als <link rel="prefetch">; ersteres wurde speziell für diesen Zweck entwickelt, während letzteres eine Reihe von Einschränkungen aufweist; siehe <link rel="prefetch"> für Details.

DNS-Prefetching

DNS-Prefetching löst Domainnamen im Voraus auf, wodurch die Ladezeiten verkürzt werden, indem die mit der Domänenauflösung zur Anfragezeit verbundenen Zeiten reduziert werden.

html
<link rel="dns-prefetch" href="https://example.com/" />

Siehe auch