Estoy tratando de averiguar cómo puedo medir el tiempo de renderizado de SVG. Cuando realizo cambios en los elementos SVG (p. ej., Acercar o Alejar), tarda unos segundos en surtir efecto porque SVG es enorme. Y necesito medir el tiempo que tardó en actualizarse para fines de análisis de rendimiento. Probé varios eventos DOM como DOMContentLoaded DOMNodeInserted DOMNodeSubtreeModified pero todos estos eventos se activan antes de que el SVG modificado se represente en la pantalla.
También probé PerformanceTimingAPI y PerformanceElementTimingAPI pero no tuve suerte.
¡Gracias por adelantado!
También está MutationObserver , pero si ya tiene problemas con los eventos de JS que indican que se produjo un cambio en el DOM, pero no ve que el motor del navegador se vuelva a procesar, es posible que no pueda usar JS para medir esto y es posible que necesite utilizar un método más “manual”.
Intente usar la función de grabación de rendimiento de Chrome DevTools. Si habilita las capturas de pantalla, debería poder ver cuándo tuvo efecto la representación. Combine esto con performance.mark() y debería poder ver cuándo activó la mutación DOM y cuándo se actualizó realmente la captura de pantalla.