Ottimizzazione della pittura del browser: Guida alle prestazioni JavaScript

Le pagine web lente frustrano gli utenti e riducono il coinvolgimento, ma il collo di bottiglia spesso non è la rete, ma la modalità di rendering dei pixel da parte del browser. In questo corso basato su testo, imparerai come identificare, analizzare ed eliminare i colli di bottiglia del rendering.Passerai dalla scrittura di codice che funziona semplicemente alla creazione di JavaScript e CSS altamente ottimizzati che riducono al minimo i ridipinti, evitano i riflussi inutili e garantiscono interazioni utente fluide. Cosa imparerai: - Comprendere il percorso di rendering critico del browser, dal DOM e CSSOM all'albero di layout e ai livelli di vernice. - Analizza come l'esecuzione di JavaScript e le modifiche CSS attivano costosi reflow e ridipinture. - Praticare l'identificazione dei colli di bottiglia delle prestazioni utilizzando gli strumenti per sviluppatori di browser e i profili delle prestazione. - Applica proprietà CSS come contenimento e trasformazione per scaricare il lavoro dal thread principale. - Ottimizzare le animazioni e le transizioni per funzionare senza intoppi a sessanta fotogrammi al secondo. - Implementa moderne strategie di rendering per migliorare Core Web Vitals e l'esperienza complessiva dell'utente. Il corso inizia con l'architettura del browser di base e la terminologia di rendering prima di passare a tecniche di ottimizzazione pratiche e pratiche di profilazione.Leggerai spiegazioni chiare, analizzerai esempi di codice e completerai esercizi scritti per rafforzare il tuo apprendimento. Questo corso è progettato per sviluppatori front-end principianti e intermedi che desiderano approfondire la loro comprensione degli interni del browser; non è richiesta alcuna esperienza precedente di ottimizzazione delle prestazioni.