Chociaż celem wszystkich jest zmniejszenie budżetu na wydajność sieci, nadal konieczne jest korzystanie z usług stron trzecich. Podczas korzystania z tych usług „Wyszukiwanie DNS” może pochłonąć znaczną część budżetu, w zależności od liczby usług. Obciążenia te wpływają na różne aspekty szybkości strony, w tym na First Contentful Paint (FCP).
Celem tych dwóch koncepcji jest optymalizacja czasu połączeń stron trzecich. Przed zrozumieniem różnic między tymi dwoma pojęciami należy zrozumieć, co dokładnie dzieje się, gdy zostanie złożone żądanie strony trzeciej:
- Domena została rozwiązana w celu uzyskania adresu IP.
- Nawiązywane jest połączenie z serwerem.
- Połączenie jest szyfrowane w celu zapewnienia bezpieczeństwa.
Ta hierarchia jest powtarzana dla każdego połączenia strony trzeciej. Tutaj pojawia się różnica między preconnectem a DNS-prefetch.
- Wstępne połączenie: Zapewnia, że wszystkie trzy kroki wymienione powyżej są wstępnie skonfigurowane.
- Wstępne pobieranie DNS: Służy jedynie do konwersji nazwy domeny na adres IP w pierwszym kroku.
Jak widać, preconnect jest bardziej wszechstronny i korzystny. Jednak wszystko ma swoją cenę. Korzystanie z preconnect dla wszystkich połączeń może mieć negatywny wpływ na optymalizację Twojej strony. Dlatego jpowinieneś używać preconnectu tylko dla połączeń krytycznych i używać dns-prefetch dla wszystkich innych połączeń stron trzecich.
Podsumowanie użycia
Biorąc pod uwagę powyższe informacje, oto krótkie podsumowanie ich użycia:
<link rel="preconnect" href="https://third-party-example.com">
<link rel="dns-prefetch" href="https://third-party-example.com">Kompatybilność z przeglądarkami
Omawiając ich użycie, należy również wspomnieć o kompatybilności z przeglądarkami. Te dwie blisko powiązane koncepcje są szeroko obsługiwane przez nowoczesne przeglądarki, ale ich użycie nie pokrywa się całkowicie. Preconnect jest obsługiwany przez około 97% przeglądarek, podczas dns-prefetch jest obsługiwany przez 83% przeglądarek (stan na czerwiec 2024 r.).
Wkład w budżet wydajności sieci
- Preconnect może zapewnić całkowitą poprawę prędkości 100-500ms.
- DNS-Prefetch może przyspieszyć każde połączenie 20-120ms.
Planujemy przeprowadzić własne testy, aby zapewnić bardziej satysfakcjonujące przykłady lokalne.
Na koniec chciałbym polecić i docenić blog Ceyhuna Enki Aksana, który w znacznym stopniu przyczynił się do mojego zrozumienia podczas przygotowywania tego artykułu: Blog Ceyhuna Enki Aksana.
