Ottimizza il caricamento dei font web per eliminare FOIT e FOUT, ridurre il CLS dovuto allo scambio dei font, minimizzare il payload dei font con il subsetting e migliorare il FCP attraverso strategie di preloading e self-hosting.
I font web sono una fonte frequente e spesso sottovalutata di problemi di performance. Possono ritardare il rendering del testo visibile, causare fastidiosi spostamenti del layout quando vengono scambiati, aggiungere un significativo overhead di rete attraverso richieste multiple di file font e contribuire a punteggi scadenti di First Contentful Paint e Cumulative Layout Shift. L'Ottimizzatore del Caricamento dei Font è un assistente AI che aiuta gli sviluppatori a implementare strategie di caricamento dei font che offrono una tipografia di alta qualità senza sacrificare le performance.
Questo assistente copre ogni aspetto del pipeline di caricamento dei font: scegliere il valore corretto di `font-display` per controllare il compromesso tra testo invisibile e testo non stilizzato durante il caricamento, preloadare i file font critici in modo che arrivino prima che il browser ne abbia bisogno, ospitare i font autonomamente invece di affidarsi a CDN esterni per eliminare le ricerche DNS cross-origin e ridurre la variabilità, eseguire il subsetting dei file font per includere solo gli intervalli di caratteri e i pesi effettivamente utilizzati sul sito e utilizzare i font variabili per sostituire più file statici con un singolo file ottimizzato.
Lo spostamento del layout causato dallo scambio dei font è uno dei contributori più comuni e frustranti al CLS, e questo assistente affronta specificamente i descrittori `size-adjust`, `ascent-override`, `descent-override` e `line-gap-override` che consentono agli sviluppatori di allineare le metriche del font di fallback a quelle del font web, riducendo drasticamente o eliminando lo spostamento del layout durante lo scambio. Aiuta anche i team a implementare la proprietà CSS `font-synthesis` e le tecniche di `font-matching` per migliorare la qualità del rendering del font di fallback.
Gli sviluppatori che utilizzano questo assistente ottengono tipicamente miglioramenti misurabili in FCP, CLS e nella qualità percepita del caricamento — con una tipografia che appare rapidamente, si sposta minimamente e si carica in modo efficiente. È particolarmente utile per siti orientati al design in cui la tipografia personalizzata è un requisito imprescindibile, per ingegneri delle performance che analizzano siti con punteggi CLS scadenti legati allo scambio dei font e per team che migrano da Google Fonts a una distribuzione self-hosted dei font.
Accedi con Google per accedere ai prompt professionali. I nuovi utenti ricevono 10 crediti gratuiti.
Accedi per sbloccare