DevTools
Chrome DevTools è un insieme di strumenti per sviluppatori web integrati direttamente nel browser Google Chrome. DevTools consente di modificare le pagine all'istante e di diagnosticare rapidamente i problemi, il che ti consente di creare siti web migliori più velocemente.
DevTools supporta un'ampia gamma di attività comuni di sviluppo web. Vai avanti in questa pagina ed esplora alcune delle funzionalità principali di DevTools. Non sai da dove iniziare o è la prima volta che utilizzi DevTools? Guarda un'introduzione a DevTools.
Ricevere assistenza con l'IA
Gli approfondimenti della console e l'assistenza dell'IA ti aiutano a eseguire il debug e correggere gli errori, il rendimento e lo stile di JavaScript in modo più efficiente.
Informazioni sul rendimento
Ottieni una visione completa e strategica del rendimento della tua pagina.
Ispeziona le risorse
Scopri come ispezionare le risorse caricate dalla tua pagina e modificarle dal browser.
Analizza la rete
Analizza e sovrascrivi le richieste e le risposte di rete in tempo reale.
Assistenza AI e approfondimenti della console
Scopri in che modo le innovazioni dell'IA in DevTools ti consentono di fare di più e più velocemente.
Per iniziare
Lascia che Gemini ti aiuti ad analizzare e migliorare lo stile, la rete, le origini e il rendimento del tuo sito web.
Fatti ispirare
Esplora i casi d'uso dell'assistenza AI in Chrome DevTools e scopri in che modo può supportare il tuo flusso di lavoro di debug per stili, prestazioni e altro ancora.
Informazioni sui messaggi della console
Comprendi i messaggi e gli errori della console in DevTools e scopri come correggerli, senza copiare e incollare.
Suggerimenti per DevTools
Consulta la nostra serie di video mensili che spiegano come utilizzare DevTools per risolvere i problemi più comuni di sviluppo web.
Registra e analizza una traccia del rendimento
Scopri come registrare una traccia delle prestazioni in DevTools e analizzarla per identificare e risolvere i problemi di prestazioni.
Monitorare i Core Web Vitals in tempo reale
Debugga i problemi LCP e utilizza i dati di CrUX per verificare se stai eseguendo il debug di un'esperienza simile per i tuoi utenti
La memorizzazione nella cache demistificata
Scopri i diversi tipi di cache del browser e come ispezionarli e gestirli in Chrome DevTools.
Bloccare lo schermo e ispezionare gli elementi che scompaiono
Stai cercando di ispezionare un elemento e "puff", non c'è più? È come se il codice stesse giocando a nascondino con te.
Ottenere informazioni sul rendimento
Un'ampia gamma di strumenti per aiutarti a misurare e ottimizzare diversi aspetti del rendimento in fase di esecuzione: il riquadro Rendimento, Lighthouse e altro ancora.
Panoramica dello strumento sul rendimento
Scopri tutte le funzionalità del riquadro Prestazioni: come registrare una traccia del rendimento, come visualizzarla e analizzarla e altro ancora.
Il futuro degli strumenti per il rendimento
Il riquadro Rendimento aiuta gli sviluppatori a misurare e ottimizzare il rendimento del runtime da quasi 15 anni. Scopri come si evolverà in futuro.
Annotare le tracce delle prestazioni
Aggiungi annotazioni alle tracce in situ e salvale direttamente nel file di traccia per una condivisione semplice.
Notizie e aggiornamenti
Controllare e modificare le risorse
Informazioni sulle funzionalità
Scopri tutte le funzionalità del riquadro Origini: come visualizzare e modificare i file, eseguire il debug di JavaScript e configurare uno spazio di lavoro.
Configurare un'area di lavoro
Workspace ti consente di salvare le modifiche apportate in DevTools nel codice sorgente memorizzato sul computer. Scopri come configurare uno spazio di lavoro nei tuoi progetti.
Analizzare l'attività di rete
Riquadro Network
Scopri tutte le funzionalità del riquadro Rete: controlla i corpi delle risposte e delle richieste, sovrascrivi le intestazioni e altro ancora.
Controlla l'attività di rete
Un tutorial pratico che ti guida nelle attività comuni all'interno del riquadro Rete.
Altri strumenti
Scopri tutte le altre funzionalità e capacità di DevTools.
Elementi
Scopri come visualizzare e modificare il DOM di una pagina.
Stili
Scopri come visualizzare e modificare il CSS di una pagina.
Modifiche
Tieni traccia delle modifiche apportate a HTML, CSS e JavaScript.
Console
Registra i messaggi ed esegui JavaScript.
Rendimento
Valutare il rendimento del sito web.
Memoria
Individua i problemi di memoria che influiscono sulle prestazioni delle pagine, ad esempio le perdite di memoria e altro ancora.
Applicazione
Ispeziona, modifica ed esegui il debug delle app web, testa la cache, visualizza lo spazio di archiviazione e altro ancora.
Animazioni
Ispezionare e modificare le animazioni.
Registratore
Registra, riproduci, misura i flussi utente e modifica i relativi passaggi.
Rendering
Scopri una raccolta di opzioni che influiscono sul rendering dei contenuti web.
Compilazione automatica
Ispezionare ed eseguire il debug degli indirizzi salvati.
Problemi
Individua e risolvi problemi relativi al tuo sito web.
Privacy e sicurezza
Assicurati che una pagina sia completamente protetta tramite HTTPS.
Media
Visualizza le informazioni ed esegui il debug dei lettori multimediali per ogni scheda del browser.
Sensori
Emula i sensori del dispositivo.
WebAuthn
Emula gli autori di autenticazione.