Preconnect: Azzera i tempi di caricamento (Google Fonts)
Migliora i tuoi Core Web Vitals anticipando le connessioni del browser verso server esterni e azzera i ritardi di rendering.
Quando il browser carica il tuo sito web e incontra risorse ospitate su server esterni (come i celebri Google Fonts), prima di poter scaricare un singolo byte deve compiere un lungo percorso invisibile: la risoluzione DNS, la connessione TCP e la negoziazione TLS. Questo "dialogo" ruba preziosi millisecondi, bloccando il rendering della pagina e penalizzando il tuo punteggio su PageSpeed Insights.
Come funziona il tag Preconnect
Il tag <link rel="preconnect"> agisce come una staffetta per il browser. È un'istruzione prioritaria che comunica al browser di aprire immediatamente i canali di connessione in background con un dominio specifico, ancor prima che la risorsa venga effettivamente richiesta dal codice.
Come ottimizzare Google Fonts con il Preconnect
L'istruzione va inserita rigorosamente all'interno del blocco <head> della tua pagina web, posizionata sempre prima del tag originale che richiama il foglio di stile esterno. Ecco il codice perfetto da incollare per azzerare la latenza dei Google Fonts:
Non sai se le tue connessioni esterne sono ottimizzate?
Controllare il codice sorgente di ogni pagina per verificare la presenza dei tag di pre-connessione richiede tempo. Usa VerificaLink: il nostro spider analizzerà i tuoi collegamenti esterni rilevando automaticamente l'assenza del tag preconnect, fornendoti il codice esatto da incollare per scalare PageSpeed.
Avvia Scansione PageSpeedDomande Frequenti (FAQ)
È sconsigliato. Aprire connessioni richiede risorse (CPU e memoria) sia al client che al server. Usa il preconnect solo per le connessioni strettamente necessarie e critiche per il primo rendering della pagina, come i font principali o script essenziali.
Il preconnect apre solo la connessione (DNS, TCP, TLS) verso un dominio esterno, preparandosi a scaricare i file. Il prefetch (o preload), invece, chiede al browser di scaricare fisicamente e memorizzare nella cache una specifica risorsa ancor prima che venga richiesta.