Z doświadczenie wiem, że przekazywanie osobie odpowiedzialnej za wprowadzanie zaleceń z audytu najbardziej podnosi ciśnienie właśnie sekcja związana z optymalizacją szybkości ładowania strony. Mi też to podnosi ciśnienie jak widzę 10s..

Sposobów na przyspieszenie czasu ładownia strony jest kilka (nie wszystkie): kompresja obrazków, lazy load obrazków, kompresja js i css, kilka sztuczek w pliku .htaccess. Jeżeli uda nam się to wszystko wprowadzić w życie to strona powinna znacząco przyspieszyć. Wszystkie wymienione te rzeczy odbywają się po stronie serwera. DNS prefetch to sposób na przyspieszenie ładowania strony po stronie przeglądarki (klienta) za pomocą jednej linijki w kodzie html

Co to jest DNS prefetch?

To poinformowanie naszej przeglądarki by w wolnej chwili zainicjowała połączenie z innym hostem, z którym się będzie łączyć w przyszłości. Np zaciąganie fontów z CDN Google, skrypty JS, style css i wszystko co ładuje się w tle.

Jak aktywować DNS prefetch?

Aby aktywować dns prefetch na naszej stronie wystarczy dodać atrybut rel=”dns-prefetch” do linków, które chcemy ładować w tle.

<link rel="dns-prefetch" href="URL">

Kila przykładów:

<link rel="dns-prefetch" href="\fonts.googleapis.com">
<link rel="dns-prefetch" href="\cdnjs.cloudflare.com">
<link rel="dns-prefetch" href="\gravatar.com">
<link rel="dns-prefetch" href="\static.doubleclick.net">

DNS-prefetch korzyści

Na stałych szybkich łączach nie zauważysz dużej różnicy, internet w PL jest na tyle szybki, że te strony ładuje dość szybko. Tutaj nadal pozostaje Ci optymalizacja wielkości zdjęć, optymalizacja javascriptu etc. Ale już na łączach mobilnych może to przynieść realne korzyści – szybciej dostaniemy treści, obrazki załadują się minimalnie później, podobnie z JS’sem.

Osobiście uważam, że to rozwiązanie może się przydać w przypadku gdy strony będziemy odwiedzać na wolniejszych łączach np. sieć komórkowa. Na światłowodach prawie nie widać różnicy ;]