Novedades de Herramientas para desarrolladores (Chrome 58)

Kayce Basques
Kayce Basques

Te damos la bienvenida a la primera entrega de las notas de la versión de Herramientas para desarrolladores. De ahora en adelante, la primera vez que abras una nueva versión de Chrome, las Herramientas para desarrolladores abrirán el panel lateral Novedades con un vínculo a las notas de la versión de esa versión.

Lo más destacado

  • Se cambió el nombre del panel Rutas por el de Rendimiento.
  • Se cambió el nombre del panel Profiles por el panel Memory.
  • Los valores de cookies ahora son editables.
  • Herramientas para desarrolladores ahora se pausa automáticamente antes de errores por falta de memoria.

Funciones nuevas

Cookies editables

Haz doble clic en una celda en la pestaña Cookies para editar ese valor.

Editar una cookie
Figura 1: Edita una cookie

Agradecemos a kdzwinel por la contribución.

Variables de CSS inspeccionables y editables en el panel Estilos

Ahora puedes inspeccionar y editar variables de CSS en el panel Estilos. Consulta la demostración de variables de CSS para probarla.

Puntos de interrupción por memoria insuficiente

Cuando una app asigna mucha memoria en poco tiempo, las Herramientas para desarrolladores ahora pausan y aumentan el límite de montón automáticamente. De esta manera, podrás inspeccionar el montón, ejecutar comandos en la consola para liberar memoria y continuar depurando el problema. Para obtener más información, consulta Un pequeño paso para Chrome, un montón gigante para V8.

Se pausó en un punto de interrupción por memoria insuficiente
Figura 2: Se pausó en un punto de interrupción por memoria insuficiente

Puntos de interrupción en la creación de lienzos

Ahora puedes crear interrupciones del objeto de escucha de eventos que se activan cada vez que se crea un nuevo contexto de lienzo.

Puntos de interrupción de la creación del lienzo a través de la casilla de verificación Create canvas context en el panel Event Listener Breakpoints
Figura 3: Puntos de interrupción de la creación del lienzo a través de la casilla de verificación Create canvas context (Crear contexto de lienzo) en el panel Event Listener Breakpoints.

Estadísticas de hora de inicio en la pestaña Timing

En la parte superior de la pestaña Timing, ahora puedes ver cuándo una solicitud se puso en cola y se inició.

Estadísticas de hora de inicio en la pestaña Timing.
Figura 4: Estadísticas de hora de inicio en la pestaña Timing

Estadísticas del servidor en la pestaña Timing

Ahora puedes insertar estadísticas personalizadas del servidor en la pestaña Tiempo. Consulta la Demostración de los valores de tiempo del servidor para ver un ejemplo.

Estadísticas del servidor en la pestaña Timing
Figura 5: Estadísticas del servidor en la pestaña Timing

Gracias a sroussey por la contribución.

Cambios

El panel Rutas ahora es el panel Rendimiento

Se cambió el nombre del panel Rutas por el de Rendimiento para reflejar mejor su propósito.

El panel Profiles ahora es el panel Memory

Se cambió el nombre del panel Profiles a panel Memory para reflejar mejor su propósito.

El Generador de perfiles de CPU está detrás de un panel oculto

Ahora que el panel Profiles se llama panel de memoria, ya no tiene sentido tener el Generador de perfiles de CPU en ese panel. Además, el objetivo a largo plazo es que todos los usuarios generen perfiles desde el panel Rendimiento. Mientras tanto, puedes acceder al generador de perfiles de CPU anterior desde Configuración > Más herramientas > Generador de perfiles de JavaScript.

Consulta Herramientas para desarrolladores de Chrome: generación de perfiles de CPU de JavaScript en Chrome 58 para obtener información sobre cómo generar perfiles de CPU en el panel Rendimiento.

Nueva IU de la consola

Se realizaron algunos cambios en la IU del panel de la consola y del panel lateral. Algunas funciones poco populares se movieron a ubicaciones más ocultas y las funciones populares ahora son más accesibles.

  • Haz clic en Configuración de la consola Configuración de Console para acceder a la configuración y personalizar el comportamiento de Console.
  • La opción Conservar el registro ahora está oculto en la Configuración de la consola.
  • El botón Filters y el panel ya no están. En su lugar, usa el menú desplegable.
  • Ahora siempre se muestra el cuadro de texto para filtrar registros. Antes estaba oculto en el panel Filtros.
  • El cuadro de texto para filtrar acepta las regex de manera automática, por lo que la casilla de verificación Regex desapareció.
  • La casilla de verificación Ocultar incumplimientos ya no está. Configura el menú desplegable del nivel de registro como Detallado para ver los incumplimientos.
  • Desmarcar la casilla de verificación Mostrar todos los mensajes en la IU anterior equivale a marcar la casilla de verificación Solo contexto seleccionado en la Configuración de Console en la IU nueva.
La nueva IU de la consola
Figura 6: La nueva IU de la consola

Se movieron los puntos de interrupción del objeto de escucha de eventos de WebGL

Los puntos de interrupción del objeto de escucha de eventos de WebGL se movieron de la categoría WebGL a la categoría Canvas. Se quitó la categoría WebGL.