Novità di DevTools, Chrome 138

Sofia Emelianova
Sofia Emelianova

Miglioramenti del riquadro Prestazioni

Questa versione introduce diversi miglioramenti al pannello Rendimento.

Origini precollegate nell'approfondimento "Albero delle dipendenze di rete"

L'approfondimento Rendimento > Approfondimenti > Albero delle dipendenze di rete ora mostra un elenco di origini pre-connesse utilizzate o non utilizzate e di candidati alla pre-connessione, se presenti.

Gli hint di precollegamento consentono al tuo sito di stabilire connessioni anticipate a importanti origini di terze parti e migliorare la velocità di caricamento della pagina.

Prima e dopo l'aggiunta di origini e candidati pre-connessi all'insight "Albero delle dipendenze di rete".

Per maggiori informazioni, consulta la sezione Precollegati alle origini necessarie.

Tempi di risposta e reindirizzamento del server nell'insight "Latenza di richiesta di download del documento"

La sezione Rendimento > Approfondimenti > Latenza richiesta documenti ora mostra il tempo di risposta del server e, se presenti, il numero di reindirizzamenti e il tempo di reindirizzamento.

Prima e dopo l'aggiunta dei tempi di risposta del reindirizzamento e del server all'approfondimento "Latenza richiesta documento".

Reindirizzamenti nel riepilogo delle richieste di rete

Il riquadro Rendimento ora mostra gli URL di reindirizzamento nel Riepilogo delle richieste di rete e nelle relative descrizioni comando.

Prima e dopo l'aggiunta degli URL di reindirizzamento al riepilogo e alle descrizioni comando delle richieste di rete.

Problema di Chromium: 402353313.

Riduzione del rumore nella traccia delle prestazioni

Il riquadro Rendimento ora non mostra gli eventi della categoria compile del motore JavaScript v8. In precedenza, questi eventi causavano molti sovraccarichi e rumore inutili, in particolare l'evento compile code.

Prima e dopo la rimozione degli eventi "Compila codice" dalla traccia del rendimento.

Se noti che alcuni eventi importanti per te non sono più presenti, non esitare a lasciare un feedback all'indirizzo crbug.com/414330508.

Funzionalità "Disattiva campioni di JavaScript" ritirata

L'opzione Disattiva campioni di JavaScript in Rendimento > Impostazioni acquisizioni è stata ritirata e rimossa a causa della sua scarsa utilità e del suo scarso utilizzo.

Prima e dopo la rimozione dell'opzione "Disattiva campioni di JavaScript" da "Impostazioni di acquisizione".

Problema di Chromium: 414734883.

Parametro di precisione della geolocalizzazione in Sensori

Il riquadro Sensori ora ti consente di impostare la precisione nell'emulazione della geolocalizzazione. In questo modo, puoi testare la gestione di diversi livelli di precisione del GPS.

Prima e dopo l'aggiunta del parametro "Precisione" all'emulazione della geolocalizzazione nel pannello Sensori.

Problema di Chromium: 40074843.

Miglioramenti al riquadro Elementi

Questa versione introduce diversi miglioramenti al riquadro Elementi.

Eseguire il debug più facilmente di valori CSS complessi

Per aiutarti a eseguire il debug di valori CSS complessi, la scheda Elementi > Stili ora mostra in una descrizione comando al passaggio del mouse:

  • La catena di definizione completa delle variabili CSS, in modo da non dover fare clic su più link.
  • Una valutazione passo passo di calcoli CSS complessi, in modo da poter identificare i bug in modo più efficiente e comprendere meglio come viene calcolato un valore.

La descrizione comando mostra le catene di definizione su più righe, una per ogni definizione. Puoi espandere i calcoli complessi e passare il mouse sopra i valori per evidenziare e tracciare il valore calcolato fino all'espressione iniziale.

Prima e dopo l'aggiunta di una descrizione comando con catene di definizioni e calcoli complessi espandibili.

Problema di Chromium: 396080529.

Supporto di @function in Elementi > Stili

In preparazione al supporto di @function in Chrome, la scheda Elementi > Stili ora collega i nomi delle funzioni personalizzate alle relative definizioni in una sezione dedicata.

Prima e dopo il collegamento del nome della funzione personalizzata alla sezione corrispondente.

Miglioramenti al riquadro Network

Questa versione introduce diversi miglioramenti al riquadro Rete.

has-request-header filtro

Il riquadro Rete ora supporta il filtro has-request-header, che consente di filtrare in base a un nome di intestazione della richiesta specifico.

Prima e dopo l'aggiunta del filtro "has-request-header" al riquadro Rete.

Problema di Chromium: 397481040.

Direct Sockets nelle app web isolate

Nel riquadro Rete, ora puoi monitorare il traffico delle app web isolate (IWA) tramite TCPSocket, UDPSocket (in modalità in entrata) e UDPSocket (in modalità connessa).

Per farlo, seleziona una connessione directscoket accanto alle richieste normali nella tabella e, nella scheda Messaggi, seleziona un messaggio.

Prima e dopo l'aggiunta del supporto dei socket diretti negli IWA al riquadro Rete.

Le app web isolate (IWA) forniscono un modello di sicurezza ad alta attendibilità per le applicazioni web. Per saperne di più, consulta la pagina Guida introduttiva alle app web isolate e dai un'occhiata all'app demo che implementa l'API Direct Sockets.

Punti salienti vari

Di seguito sono riportate alcune correzioni e alcuni miglioramenti degni di nota in questa release:

  • Applicazione > Archiviazione: è stata rimossa l'opzione Web SQL deprecata (crbug.com/412707590).
  • Elementi:
  • Rete: è stata rimossa l'intestazione HTTP Referrer-Policy dall'opzione Copia come recupero perché è un'intestazione di risposta per controllare il comportamento del browser, non un'istruzione lato client (crbug.com/413904896).
  • Prestazioni: sono stati rimossi gli avvisi relativi alle "attività lunghe" dai thread worker perché non bloccano i thread principali (crbug.com/40248589).
  • Problemi. Ora i report:
    • Se vengono bloccate risorse sospettate di monitorare gli utenti.
    • Mitigazioni del monitoraggio del rimbalzo indipendentemente dal fatto che accedano o meno allo spazio di archiviazione durante un reindirizzamento.
  • Accessibilità. I seguenti elementi in Elementi > Stili sono ora selezionabili tramite tastiera:

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.

Novità di DevTools

Un elenco di tutti gli argomenti trattati nella serie Novità di DevTools.