Miglioramenti al riquadro Prestazioni
Questa versione introduce diversi miglioramenti al pannello Rendimento.
Spostare e nascondere le tracce con la modalità di configurazione delle tracce aggiornata
Ora puoi accedere alla modalità di configurazione delle tracce facendo clic con il tasto destro del mouse sul nome della traccia e selezionando Configura tracce. Il pulsante di modifica che richiedeva spazio aggiuntivo è stato rimosso.
La modalità di configurazione delle tracce ti consente di modificare l'ordine delle tracce e di nasconderle. Fai clic sulla o sulla per spostare la traccia o fai clic su per nasconderla. Per uscire dalla modalità di configurazione, fai clic su Completa la configurazione delle tracce in basso. Questa configurazione viene mantenuta per le nuove tracce, ma non per le sessioni successive di DevTools.
Problema di Chromium: 336266699.
Ignora gli script nel grafico a fiamme
Il grafico a fiamma nella traccia Principale aggiunge il supporto dell'elenco di elementi da ignorare. Ora puoi fare clic con il tasto destro del mouse su uno script nel grafico e selezionare Aggiungi script all'elenco Ignora.
Il grafico comprime gli script ignorati, li contrassegna come Nell'elenco di elementi da ignorare e li aggiunge alle regole di esclusione personalizzate in Impostazioni > Elenco di elementi da ignorare. Gli script ignorati vengono salvati finché non li rimuovi dalla traccia o dalle regole di esclusione personalizzate.
Problema di Chromium: 336266714.
Ridurre la CPU di 20 volte
Il menu di limitazione CPU nelle Impostazioni di acquisizione del riquadro Prestazioni riceve una nuova opzione Rallentamento 20x. In questo modo, ora puoi riprodurre e analizzare in modo più accurato i problemi di rendimento reali, anche su computer di fascia alta.
Problema di Chromium: 324978881.
Il riquadro Informazioni sulle prestazioni verrà ritirato
Il riquadro sperimentale Informazioni sulle prestazioni verrà ritirato nel 2024. Il team di DevTools sta lavorando all'integrazione delle funzionalità più utili nel riquadro Prestazioni. Il riquadro Approfondimenti sul rendimento ora mostra un banner nella parte superiore che ti informa del ritiro imminente.
Per scoprire di più, consulta Strumenti per il rendimento nel 2024 e negli anni successivi.
Se hai feedback su cosa funziona, cosa non funziona e cosa ritieni possa essere migliorato, non esitare a comunicarcelo.
Incolla le stringhe di intestazione complete per eseguirne l'override
Quando esegui l'override delle intestazioni, ora puoi incollare un'intera stringa di intestazione (HEADER_NAME: VALUE) e DevTools suddividerà la stringa in corrispondenza di : in un nome di intestazione e il relativo valore.
Guarda come funziona nel video seguente.
Quando modifichi le intestazioni, il riquadro Rete ora ti avvisa se hai inserito caratteri diversi da quelli alfanumerici, trattini e trattini bassi.
Inoltre, i pulsanti di override delle opzioni di menu e Modifica sono disattivati per gli URL chrome://, il che corrisponde al comportamento previsto.
Problemi di Chromium: 330967147, 337012362, 328210785.
Trovare l'utilizzo eccessivo di memoria con i nuovi filtri negli snapshot dell'heap
Gli snapshot dell'heap nel riquadro Memoria ricevono nuovi filtri che possono aiutarti a trovare casi comuni di utilizzo inefficiente della memoria, come stringhe duplicate, oggetti conservati dai nodi DOM scollegati e la console DevTools.
Problema di Chromium: 337094903.
Ispeziona i bucket di archiviazione in Applicazione > Archiviazione
Ora puoi esaminare i bucket di archiviazione in una struttura ad albero dedicata nella sezione Applicazione > Archiviazione. Questo albero, precedentemente sperimentale, è stato attivato per impostazione predefinita.
Problema di Chromium: 338094915.
Disattivare gli avvisi di self-XSS con un flag della riga di comando
Se automatizzi l'utilizzo di Chrome o apri DevTools dalla riga di comando per il debug, spesso vorrai disattivare l'avviso di self-XSS che viene visualizzato in ogni nuova sessione di DevTools.
Ora puoi disattivare questa finestra di dialogo trasmettendo il flag della riga di comando --unsafely-disable-devtools-self-xss-warnings a Chrome.
Problema di Chromium: 41491762.
Lighthouse 12.0.0
Il riquadro Lighthouse ora esegue Lighthouse 12.0.0.
Questo aggiornamento introduce una serie di modifiche, tra cui la rimozione della categoria PWA, la riorganizzazione della categoria SEO, il ritiro del risparmio complessivo, nuovi controlli e modifiche ai controlli. Consulta l'elenco completo delle modifiche.
Per scoprire le nozioni di base sull'utilizzo del riquadro Lighthouse in DevTools, consulta Lighthouse: ottimizzare la velocità del sito web.
Problema di Chromium: 772558.
Punti salienti vari
Di seguito sono riportate alcune correzioni e alcuni miglioramenti degni di nota in questa release:
- Rendimento:
- Le impostazioni di acquisizione lenta (Attiva la strumentazione di colorazione avanzata e Attiva le statistiche del selettore CSS) ora vengono cancellate automaticamente nella sessione successiva di DevTools.
- La scheda Statistiche selettore ora non scorre automaticamente verso il basso quando aumenti lo zoom del grafico a fiamma e i dati cambiano (337999939).
- Console: la scorciatoia Ctrl+` ora chiude la Console nel riquadro solo se è attiva (40875466, 328210785).
- Compilazione automatica: l'analisi degli indirizzi è stata corretta (335409093, 335409707).
- Accessibilità: gli annunci dello screen reader per le stringhe localizzate sono corretti (324930007).
Scaricare i canali in anteprima
Prendi in considerazione l'utilizzo di Chrome Canary, Dev o Beta come browser di sviluppo predefinito. Questi canali di anteprima ti consentono di accedere alle funzionalità più recenti di DevTools, testare le API della piattaforma web all'avanguardia e trovare problemi sul tuo sito prima che lo facciano i tuoi utenti.
Contatta il team di Chrome DevTools
Utilizza le seguenti opzioni per discutere delle nuove funzionalità, degli aggiornamenti o di qualsiasi altro argomento relativo a DevTools.
- Inviaci feedback e richieste di funzionalità all'indirizzo crbug.com.
- Segnala un problema di DevTools utilizzando Altre opzioni > Guida > Segnala un problema di DevTools in DevTools.
- Invia un tweet a @ChromeDevTools.
- Lascia un commento sui video di YouTube Novità di DevTools o sui video di YouTube Suggerimenti di DevTools.
Novità di DevTools
Un elenco di tutti gli argomenti trattati nella serie Novità di DevTools.
- Aggiornamenti del server MCP di DevTools
- Condivisione migliorata delle tracce
- Supporto per @starting-style
- Widget dell'editor per la visualizzazione: muratura
- Lighthouse 13
- Suggerimenti per il codice da Gemini
- Miglioramenti per il server MCP di DevTools
- Accesso più rapido all'assistenza dell'AI
- Eseguire il debug della traccia completa delle prestazioni con Gemini
- Attiva/disattiva orientamento del riquadro a scomparsa
- Programma per gli sviluppatori di Google
- Altri momenti salienti
- Chrome DevTools (MCP) per l'agente AI
- Eseguire il debug dell'albero delle dipendenze di rete con Gemini
- Esportare le chat con Gemini
- Configurazione delle tracce persistenti nel riquadro Rendimento
- Filtra le richieste di rete protette da IP
- Elementi > La scheda Layout aggiunge il supporto del layout a griglia
- Lighthouse 12.8.2
- Altri momenti salienti
- Esegui il debug di altri approfondimenti con Gemini
- Emulare l'intestazione "Save-Data" in "Condizioni di rete"
- Visualizzare lo stato di Baseline nella descrizione comando di una proprietà CSS
- Eseguire l'override dei fattori di forma nei suggerimenti client dello user agent
- Lighthouse 12.8.0
- Altri momenti salienti
- Chrome DevTools più affidabile e produttivo
- Caricare immagini nell'assistenza AI per lo stile
- Aggiungere intestazioni delle richieste alla tabella in Rete
- Scopri i momenti salienti di Google I/O 2025
- Altri momenti salienti
- Miglioramenti al pannello del rendimento
- Origini precollegate nell'approfondimento "Albero delle dipendenze di rete"
- Tempi di risposta e reindirizzamento del server nell'approfondimento "Latenza richiesta documento"
- Reindirizzamenti nel riepilogo delle richieste di rete
- Riduzione del rumore nella traccia delle prestazioni
- Funzionalità "Disattiva campioni di JavaScript" ritirata
- Parametro di precisione della geolocalizzazione in Sensori
- Miglioramenti al riquadro degli elementi
- Eseguire il debug più facilmente di valori CSS complessi
- Supporto della funzione@in Elementi > Stili
- Miglioramenti al riquadro Rete
- has-request-header filter
- Socket diretti nelle app web isolate
- Altri momenti salienti
- Accessibilità
- Edizione Google I/O 2025
- Modificare e salvare le modifiche CSS nel workspace con Gemini
- Connettere una cartella dello spazio di lavoro e salvare le modifiche nei file di origine
- Chiedere a Gemini informazioni sulle informazioni sulle prestazioni
- Annotare i risultati delle prestazioni con Gemini
- Aggiungere screenshot alle chat con Gemini
- Nuovi approfondimenti nel riquadro Prestazioni
- JavaScript duplicato
- JavaScript precedente
- Le speculazioni ora supportano i tag delle regole
- Lighthouse 12.6.0
- Altri momenti salienti
- Accessibilità
- Miglioramenti al pannello del rendimento
- Nuovi approfondimenti sul rendimento
- Fai clic per evidenziare
- Tempi del server in Riepilogo delle richieste di rete
- Filtrare i cookie in "Privacy e sicurezza"
- Dimensioni in unità kB nelle tabelle dei vari riquadri
- Il completamento automatico supporta la forma dell'angolo e la forma dell'angolo-* in Elementi > Stili
- Sperimentale: evidenziazione dei problemi relativi a elementi e attributi nel DOM
- Lighthouse 12.5.0
- Altri momenti salienti
- Miglioramenti al pannello del rendimento
- Link all'origine e allo script per le chiamate di profilo e di funzione in Performance
- Supporto dei dati di campo LCP per fase
- Insight sull'albero delle dipendenze di rete
- Durata anziché tempo totale e autonomo nel riepilogo
- Evidenziazione dello stack più pesante
- Stati vuoti migliorati per vari riquadri
- Visualizzazione ad albero dell'accessibilità in Elements
- Lighthouse 12.4.0
- Altri momenti salienti
- Pannello Privacy e sicurezza
- Miglioramenti al pannello del rendimento
- Preimpostazioni calibrate per la limitazione della CPU
- Selezionare diversi eventi di rendimento nella stessa chat AI
- Evidenziazione dei dati proprietari e di terze parti nel rendimento
- Dati dei campi nelle descrizioni comando e negli approfondimenti dei marcatori
- Insight sull'adattamento dinamico del contenuto forzato
- Approfondimento "Ottimizza le dimensioni del DOM"
- Estendere la traccia del rendimento con console.timeStamp
- Miglioramenti al riquadro degli elementi
- Valori in tempo reale degli stili animati
- Supporto per la pseudo-classe :open e vari pseudo-elementi
- Copia tutti i messaggi della console
- Unità di byte nel riquadro Memoria
- Altri momenti salienti
- Cronologia della chat AI persistente
- Miglioramenti al pannello del rendimento
- Approfondimento sulla pubblicazione delle immagini
- Navigazione da tastiera classica e moderna
- Ignorare gli script non pertinenti nel grafico a fiamma
- Indicatore della sequenza temporale ed evidenziazione dell'intervallo al passaggio del mouse
- Impostazioni di limitazione consigliate
- Indicatori di sincronizzazione in una sovrapposizione
- Analisi dello stack delle chiamate JS nel riepilogo
- Impostazioni dei badge spostate nel menu di Elementi
- Nuovo riquadro "Novità"
- Lighthouse 12.3.0
- Altri momenti salienti
- Eseguire il debug delle richieste di rete, dei file di origine e delle tracce delle prestazioni con Gemini
- Visualizzare la cronologia della chat AI
- Gestire lo spazio di archiviazione delle estensioni in Applicazione > Spazio di archiviazione
- Miglioramenti delle prestazioni
- Fasi di interazione nelle metriche in tempo reale
- Informazioni sul rendering di blocco nella scheda Riepilogo
- Supporto per gli eventi scheduler.postTask e le relative frecce di iniziatore
- Miglioramenti al riquadro Animazioni e alla scheda Elementi > Stili
- Passare da Elementi > Stili ad Animazioni
- Aggiornamenti in tempo reale nella scheda Calcolati
- Calcolare l'emulazione della pressione in Sensori
- Oggetti JS con lo stesso nome raggruppati per origine nel riquadro Memoria
- Nuovo look per le impostazioni
- Il riquadro Informazioni sulle prestazioni è deprecato e rimosso da DevTools
- Altri momenti salienti
- Eseguire il debug di CSS con Gemini
- Controllare le funzionalità di AI in una scheda delle impostazioni dedicata