Don't miss out on the action at this year's Chrome Dev Summit, streaming live on YouTube. Watch now.

Chrome DevTools

Chrome DevTools es un conjunto de herramientas de creación web y depuración integrado en Google Chrome. Usa DevTools para iterar y depurar tu sitio, y para crear un perfil de él.

Prueba interna: ¿Buscas lo último? Chrome Canary siempre tiene la versión más reciente de DevTools.

Abrir Chrome DevTools

  • En el Menú de Chrome, selecciona More Tools > Developer Tools.
  • Haz clic con el botón secundario en un elemento de la página y selecciona Inspect.
  • Usa las combinaciones de teclas Ctrl+Mayúscula+I (Windows) o Cmd+Opción+I (Mac).

Descubrir los paneles

Device Mode

Device Mode Usa Device Mode para desarrollar experiencias web con una completa capacidad de respuestas y que prioricen los dispositivos móviles.

Elements

Panel Elements Usa el panel Elements para iterar la distribución y el diseño de tu sitio mediante la libre manipulación de DOM y CSS.

Console

Panel Console Usa el panel Console para registrar información de diagnóstico durante el desarrollo o úsalo como un shell para interactuar con el código JavaScript en la página.

Sources

Panel Sources Depura tu código JavaScript con puntos de interrupción en el panel Sources o conecta los archivos locales mediante espacios de trabajo para usar el editor en tiempo real de DevTools.

Network

Panel Network Usa el panel Network para obtener información sobre recursos solicitados y descargados, y optimizar el rendimiento de carga de tu página.

Timeline

Panel Timeline Usa el panel Timeline para mejorar el rendimiento del tiempo de ejecución de la página mediante la grabación y la exploración de los diferentes eventos que ocurren durante el ciclo de vida de un sitio.

Profiles

Panel Profiles Usa el panel Profiles si necesitas más información que la que proporciona el panel Timeline; por ejemplo, para rastrear pérdidas de memoria.

Application

Panel Application Usa el panel Resources para inspeccionar todos los recursos que se cargan; entre otros, bases de datos IndexedDB o Web SQL, almacenamiento local y de sesión, cookies, caché de la app, imágenes, fuentes y hojas de estilos.

Security

Panel Security Usa el panel Security para depurar problemas de contenido mixto, problemas de tu certificado y más.

Participar

Twitter Stack Overflow Slack