concept

Preconnect

Preconnect is a web performance optimization technique that allows browsers to establish early connections to third-party domains before they are needed, reducing latency for critical resources. It involves using the 'rel=preconnect' link hint in HTML or the 'Link' HTTP header to inform the browser to perform DNS lookup, TCP handshake, and TLS negotiation in advance. This speeds up the loading of external resources like fonts, scripts, or APIs by eliminating connection setup delays.

Also known as: rel=preconnect, preconnect hint, preconnect link, preconnect optimization, preconnect directive
🧊Why learn Preconnect?

Developers should use preconnect when their websites rely heavily on third-party resources such as Google Fonts, analytics scripts, or CDN-hosted libraries, as it can significantly improve page load times and user experience. It is particularly beneficial for performance-critical applications like e-commerce sites or media-rich pages where every millisecond counts, helping to meet Core Web Vitals metrics like Largest Contentful Paint (LCP).

Compare Preconnect

Learning Resources

Related Tools

Alternatives to Preconnect