Estoy trabajando en una próxima aplicación js react y tratando de ver el ciclo de renderizado. Estoy tratando de depurar problemas de rendimiento que son un poco más difíciles de ver ya que la aplicación está alojada en un iFrame que está oculto al inicio.

Pude hacer que el perfilador de reacción funcionara con las herramientas de depuración de reacción externas, pero no para el primer renderizado, ya que está en un iFrame oculto. Pude agregar la secuencia de comandos para que, después de que se iniciara, se conectara y luego ejecutara pruebas basadas en este artículo . Esto me da una forma de visualizar el renderizado que ocurre después del inicio.

Pude usar la API de Profiler para enviar datos a la consola, los datos de procesamiento que me dan un resultado como:

 👁 Profiler result for _app 👁​ 👁 Profiler result for _app 👁: 11​ Phase: update​ Actual Duration: 7.199999749660492​ Base Duration: 18.399999856948853​ Start Time: 44385.90000003576​ Commit Time: 44396.90000003576​ Interactions​ Set(0) {}

Puedo guardar esa información en un archivo, pero me preguntaba si alguien sabe una forma de importar eso a algo que visualizaría los datos y facilitaría la lectura, como las herramientas reales de desarrollo de reacción.

Es difícil simplemente analizar la salida de la consola, especialmente a medida que profundizo en el árbol de componentes manualmente.

Gracias por cualquier ayuda.