Cómo usar la herramienta de cronograma de asignación

Meggin Kearney
Meggin Kearney

Usa la herramienta Cronograma de asignación para encontrar objetos que no se están limpiando correctamente y que siguen reteniendo memoria.

Cómo funciona la herramienta

Un informe de Cronograma de asignaciones combina la información detallada de la instantánea del generador de perfiles de montón con la actualización y el seguimiento incrementales del panel de cronograma. Al igual que con estas herramientas, el seguimiento de la asignación de montón implica iniciar una grabación, realizar una secuencia de acciones y, luego, detener la grabación para su análisis.

La herramienta toma instantáneas del montón de forma periódica durante la grabación (con una frecuencia de hasta 50 ms) y una instantánea final al final de la grabación.

Ejemplo de grabación de un cronograma de asignación.

Registra un informe de cronograma de asignación

Para comenzar a usar la herramienta Cronograma de asignación, sigue estos pasos:

  1. Abre el panel Memory en DevTools.
  2. Habilita el perfil Asignaciones en el cronograma.
  3. Presiona el botón Iniciar para comenzar a grabar.

Se destaca la opción "Registrar asignaciones en un cronograma".

Cómo leer 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 instantánea, las barras de la parte superior indican cuándo se encuentran objetos nuevos 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 aún están activos en la instantánea final del montón. Las barras azules indican los objetos que aún están activos al final del cronograma. Las barras grises indican los objetos que se asignaron durante el cronograma, pero que se eliminaron:

Ejemplo de grabación del cronograma de asignación.

Puedes acercar la imagen para filtrar el panel Constructor y mostrar solo los objetos que se asignaron durante el período especificado. Para acercar, arrastra el mouse sobre el período en el que deseas enfocarte en la línea de tiempo.

Línea de tiempo en la que se hizo zoom en una sola barra.

Si haces clic en un constructor específico en el panel Constructor, se mostrará su árbol de retención en el panel Retenedores. El examen de la ruta de retención al objeto debería brindarte suficiente información para comprender por qué no se recopiló el objeto, y puedes realizar los cambios de código necesarios para quitar la referencia innecesaria.

Cómo ver la asignación de memoria por función

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