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.
Esegui il debug con l'AI
L'assistenza dell'AI, gli approfondimenti della console, i suggerimenti di codice, le annotazioni automatiche e altro ancora ti aiutano a eseguire il debug 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.
Analizzare la rete
Analizza e sovrascrivi le richieste e le risposte di rete in tempo reale.
Esegui il debug con l'AI
Scopri in che modo le innovazioni dell'IA in DevTools ti consentono di fare di più e più velocemente.
DevTools MCP
Fornisci ai tuoi agenti di programmazione gli stessi strumenti affidabili che utilizzi per esaminare l'attività di rete, registrare le tracce e risolvere i problemi delle applicazioni web, all'interno del tuo flusso di lavoro AI.
Collega il server Chrome DevTools MCP (Model Context Protocol) allo strumento che preferisci: Gemini CLI, Claude Code, Cline, Copilot e altri ancora.
Suggerimenti per gli strumenti per sviluppatori
Esplora la nostra serie di video mensili che ti guidano attraverso scenari di debug comuni in DevTools in modo giocoso.
Pitstop per l'ottimizzazione del rendimento
Fai un tour del riquadro Prestazioni aggiornato, che ti mostra come misurare i Core Web Vitals (LCP, CLS, INP) e come ricevere consigli personalizzati da Gemini.
Pixel Pirate
Salpa con DevTools e diventa un pirata del debug. Scopri le tecniche per emulare gli stili di messa a fuoco, testare i moduli con il completamento automatico e risolvere gli errori di backend con gli override di rete.
Innovazioni dell'IA
Esplora la potenza del debug assistito dall'AI con Chrome DevTools. Scopri come Console Insights, l'assistenza dell'IA per stile, prestazioni, rete e fonti possono migliorare il tuo flusso di lavoro.
Analisi avanzata della rete con Chrome DevTools
Esplora le tecniche avanzate del riquadro Rete, tra cui come trovare i colli di bottiglia delle prestazioni, eseguire il debug dei popup, configurare le condizioni di rete, utilizzare le scorciatoie per determinare gli iniziatori delle richieste di rete e altro ancora.
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.
Notizie e aggiornamenti
Ispezionare 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.
Analisi dell'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.
Altri strumenti
Scopri tutte le altre funzionalità e capacità di DevTools.