2011-08-10 17 views
20

¿Existe alguna herramienta/herramienta de desarrollador web que nos permita saber cuántas veces un navegador está haciendo reflows?¿cómo investigamos cuántas veces un navegador está haciendo reflows?

básicamente quiero tener algún tipo de retroalimentación/información. No sé cómo será, pero tal vez algún tipo de gráfico de rendimiento que muestra la línea de tiempo (similar a Speed Tracer de Google) para que pueda investigar cuando de repente en un punto el navegador está haciendo una cantidad insana de reflujos, así puedo señalar hey aquí hay un cuello de botella, tiene que haber una implementación de error/mal de algo aquí o algo así.

+0

¿Está buscando cosas como herramientas para desarrolladores en Google Chrome o Firebug? En Herramientas para desarrolladores en Chrome, en la pestaña Línea de tiempo puede hacer clic en registrar y ver la cantidad de tiempo dedicado a la Carga/Scripting/Rendering. ¿Te daría la línea de tiempo para Rendering lo que estás buscando? – arunkumar

+0

@arunkumar es algo así, pero necesito poder crear un perfil para un solo elemento y no para toda la página. Como decir que conoces Firebug, podemos seleccionar un solo elemento y ver todos los estilos para un solo elemento en particular. ese tipo de cosas, y una vez que se selecciona ese elemento, me gustaría ver la barra de representación para ese elemento, ignorando el resto. – Pacerier

+0

Por "reflujo", quiere decir "redirigir", ¿verdad? –

Respuesta

12
  1. Chrome y Safari tienen la pestaña Línea de tiempo en Web Inspector, donde puede ver todos los reflujos y rediseños realizados por el navegador.
  2. Firefox tiene MozAfterPaint evento. Puede ayudarlo a comprender qué regiones de la página y cuándo pintadas por el navegador. Firebug Paint Events add-on puede ser útil aquí. Muestra los eventos de repintado en la consola FireBug.
+0

No pude conseguir que MozAfterPaint funcionara. ¿Sabes a qué se refiere * chrome *? El evento MozAfterPaint ya no se envía al contenido web de forma predeterminada por el momento; todavía se envía a cromo, sin embargo. * Fuente: https://developer.mozilla.org/en/Gecko-Specific_DOM_Events#MozAfterPaint* – Pacerier

+0

conozco la pestaña de la línea de tiempo; sin embargo, lo que me gustaría es seleccionar un solo elemento y poder ver los reflows para ese elemento en particular (y no para toda la página, por supuesto ...). que pena. El complemento Paint Events solo funciona con FireFox 3 – Pacerier

+0

. Dudo que esto sea posible.Quiero decir que no conozco ninguna herramienta para eso. La única posibilidad que veo es modificar el código del navegador para agregar alguna funcionalidad de registro de reflujo. – bjornd

Cuestiones relacionadas