Unter DNS-Prefetching versteht man das Auflösen einer Domain in seine IP-Adresse im voraus.
Jede externe Domain, die in eine Webseite eingebunden ist, verursacht einen Aufruf der externen Domain und auch ein auflösen der Domain in Ihre IP-Adresse, das benötigt eine gewisse Zeit und verlangsamt das laden der Webseite.
Das DNS-Prefetching versucht – schon bevor der Inhalt der externen Domain aufgerufen wird – die IP-Adresse aufzulösen, so dass nicht erst auf die Auflösung gewartet werden muss.
Die meissten aktuellen Browser machen das mit eingebundenem HTML-Inhalt automatisch, allerdings nicht mit Javascript-Dateien – oder ähnlichen – die im Header stehen.
Deswegen kann man explizit im <head> Bereich einer Webseite das DNS-Prefetching für einzelne Domains aktivieren:
Häufig verwendete DNS-Prefetch Links
<!-- Amazon S3 -->
<link rel="dns-prefetch" href="//s3.amazonaws.com">
<!-- Google APIs -->
<link rel="dns-prefetch" href="//ajax.googleapis.com">
<!-- Google Analytics -->
<link rel="dns-prefetch" href="//www.google-analytics.com">
<!-- Typekit -->
<link rel="dns-prefetch" href="//use.typekit.com"><link rel="dns-prefetch" href="//p.typekit.net">DNS-Prefetching abschalten
Man kann auch explizit im <head> sagen, das man kein DNS-Prefetching möchte:
<meta http-equiv="x-dns-prefetch-control" content="off">Warnung: Diese Angabe wird die Webseite, wenn externe Inhalte eingebunden sind, verlangsamen. Außer man hat zusätzliche DNS-Prefetch Angaben gemacht, diese werden dennoch ausgeführt.
DNS-Prefetching wird von folgenden Browsern unterstützt:
- Firefox 3.5+
- Chrome
- Safari 5+
- Opera (unbekannt)
- IE 9 (wird auf blogs.msdn.com «Pre-resolution» genannt)
Quelle & weitere Informationen
Ist DNS-Prefetching sinnvoll?
Wenn man (viele) externe Inhalte hat die nicht gleich an erster Stelle im Quelltext stehen, macht DNS-Prefetching Sinn und kann ein paar (Milli-)Sekunden an Ladezeit rausholen.
Wenn man keine externen Inhalte hat, kann man es auch getrost weglassen oder gar abschalten (s.o.).
WordPress Plugins & Snippet für DNS-Prefetching
Ein eigens Plugin ist dafür wenig sinnvoll.
Man kann das z.B. mit diesem Snippet im Child-Theme in der functions.php einbinden:
// Set custom "dns-prefetch" and "preconnect" headers at top of <head>
function my_dns_prefetch()
{
// List of domains to set prefetching for
$prefetchDomains = [
'//beispiel.de',
'//example.com',
];
$prefetchDomains = array_unique($prefetchDomains);
$result = '';
foreach ($prefetchDomains as $domain) {
$domain = esc_url($domain);
$result .= '<link rel="dns-prefetch" href="' . $domain . '" crossorigin />';
$result .= '<link rel="preconnect" href="' . $domain . '" crossorigin />';
}
echo $result;
}
add_action('wp_head', 'my_dns_prefetch', 0);Quelle: ansas-meyer.de
Wenn man sein WordPress Theme im Template nicht anpassen kann oder will gibt es Plugins die Dir die DNS-Prefetching Codes in den Headbereich einfügen. z.B. Plugins wie SWIFT Performance (Light / Pro) oder WP Rocket fügen, wenn externe Quellen gefunden werden, die DNS Prefetch Angaben automatisch selber hinzu.
Beispiel Output des SWIFT Performance Plugins im Frontend:
Hat Dir dieser Artikel weitergeholfen?
Was sind Deine Erfahrungen mit DNS-Prefetching und Geschwindigkeitsoptimierungen? Hast Du weitere Tipps zur Geschwindigkeitsoptimierung? Lass es mich in den Kommentaren wissen.
