rel="preconnect"
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
Das Schlüsselwort preconnect für das rel-Attribut des <link>-Elements dient als Hinweis für Browser, dass der Benutzer wahrscheinlich Ressourcen von der Ursprungsressource benötigt. Daher kann der Browser die Benutzererfahrung wahrscheinlich verbessern, indem er proaktiv eine Verbindung zu diesem Ursprung initiiert. Preconnecting beschleunigt zukünftige Ladevorgänge von einem bestimmten Ursprung, indem es proaktiv einen Teil oder den gesamten Handshake (DNS+TCP für HTTP und DNS+TCP+TLS für HTTPS-Ursprünge) durchführt.
<link rel="preconnect"> bietet einen Vorteil für zukünftige Anforderungen, Navigationen oder Unterressourcen über eine andere Herkunft hinweg. Es hat keinen Vorteil bei Anfragen zur gleichen Herkunft, da die Verbindung bereits geöffnet ist.
Wenn eine Seite Verbindungen zu vielen Drittanbieterdomänen herstellen muss, kann es kontraproduktiv sein, sie alle vorzuverbinden. Der <link rel="preconnect">-Hinweis sollte am besten nur für die kritischsten Verbindungen verwendet werden. Für die anderen verwenden Sie einfach <link rel="dns-prefetch">, um Zeit beim ersten Schritt — dem DNS-Lookup — zu sparen.
Beispiele
<link rel="preconnect" href="https://example.com" />
Sie können Preconnect auch als HTTP-[Link](/de/docs/Web/HTTP/Reference/Headers/Link)-Header implementieren, zum Beispiel:
Link: <https://example.com>; rel="preconnect"
Spezifikationen
| Specification |
|---|
| HTML # link-type-preconnect |
Browser-Kompatibilität
Siehe auch
- Spekulatives Laden für einen Vergleich von
<link rel="preconnect">und anderen ähnlichen Funktionen zur Leistungsverbesserung.