Don't forget the Chrome Dev Summit, starting Monday at 10:00am (Pacific) and streaming live on YouTube. Schedule.

Cómo usar la herramienta de generación de perfiles de asignación

Usa la herramienta de generación de perfiles de asignación para buscar objetos que la recolección de elementos no usados no procese correctamente, y que sigan reteniendo memoria.

Cómo funciona la herramienta

El generador de perfiles de asignación combina la información de captura de pantalla detallada del generador de perfiles de montón con la actualización y el seguimiento incrementar del Panel de línea de tiempo. En forma similar a estas herramientas, la asignación de montón de los objetos de seguimiento involucra comenzar una grabación, realizar una secuencia de acciones, y detener la grabación para fines de análisis.

La herramienta toma periódicamente capturas de pantalla de montón de toda la grabación (¡cada 50 ms!) y una captura de pantalla final al final de la grabación.

Generador de perfiles de asignación

Habilita el generador de perfiles de asignación

Para comenzar a utilizar el generador de perfiles de asignación:

  1. Asegúrate de tener el último Chrome Canary.
  2. Abre Developer Tools y haz clic en el ícono de ajustes en la parte inferior derecha.
  3. Ahora, abre el panel del generador de perfiles. Deberás ver un perfil denominado "Record Heap Allocations".

Grabar generador de perfiles de asignación de montón

Lee un perfil de asignación de montón

El perfil de asignación de montón muestra dónde se crean los objetos e identifica la ruta de retención. En la siguiente captura de pantalla, las barras de la parte superior indican cuándo se encuentran nuevos objetos en el montón.

La altura de cada barra corresponde al tamaño de los objetos asignados recientemente y el color de las barras indica si esos objetos todavía existen en la captura de pantalla de montón final. Las barras azules indican los objetos que todavía existen al final de la línea de tiempo, las barras grises indican los objetos que fueron asignados durante la línea de tiempo, pero que desde entonces se sometieron a la recolección de elementos sin usar:

Captura de pantalla del generador de perfiles de asignación

En la siguiente captura de pantalla, se ejecutó una acción diez veces. El programa de muestra almacena en caché cinco objetos, por lo que se esperan las últimas cinco barras azules. Sin embargo, la barra azul más a la izquierda indica un posible problema.

Luego, puedes usar los controles deslizantes de la línea de tiempo que figura arriba para acercar ese captura en particular y ver los objetos que se asignaron recientemente en ese punto:

Acercar la captura de pantalla

Al hacer clic en un objeto específico del montón se mostrará su árbol de retención en la parte inferior de la captura de pantalla del montón. Si examinas la ruta de acceso de retención del objeto, obtendrás suficiente información para comprender la razón por la cual el objeto no fue recolectado y podrás efectuar los cambios requeridos en el código para quitar la referencia innecesaria.

Ve la asignación de memoria por función

También puedes ver la asignación de memoria por función JavaScript. Consulta Investigar asignación de memoria por función para obtener más información.