¿Cuándo ocurre el reflujo en un entorno DOM?
¿Qué tipo de actividades provocarán el reflujo de la página web con DOM?
Parece que hay diferentes puntos de vista. Según http://www.nczonline.net/blog/2009/02/03/speed-up-your-javascript-part-4/ , sucede
- Cuando agrega o elimina un nodo DOM.
- Cuando aplica un estilo dinámicamente (como element.style.width="10px").
- Cuando recupera una medida que debe calcularse, como acceder a offsetWidth, clientHeight o cualquier valor CSS calculado (a través de getComputedStyle() en navegadores compatibles con DOM o currentStyle en IE).
Sin embargo, según http://dev.opera.com/articles/view/ficient-javascript/?page=3 , la medición activa el reflujo solo cuando ya hay una acción de reflujo en cola.
¿Alguien tiene más ideas?
Ambos artículos son correctos. Se puede asumir con seguridad que siempre que esté haciendo algo que razonablemente pueda requerir que se calculen las dimensiones de los elementos en el DOM, activará el reflujo.
Además, hasta donde yo sé, ambos artículos dicen lo mismo.
El primer artículo dice que el reflujo ocurre cuando:
Cuando recupera una medida que debe calcularse , como acceder a offsetWidth , clientHeight o cualquier valor CSS calculado (a través de getComputedStyle() en navegadores compatibles con DOM o currentStyle en IE), mientras los cambios de DOM están en cola para realizarse.
El segundo artículo dice:
Como se indicó anteriormente, el navegador puede almacenar en caché varios cambios y redistribuirlos solo una vez cuando se hayan realizado todos esos cambios. Sin embargo, tenga en cuenta que tomar medidas del elemento lo obligará a refluir , por lo que las medidas serán correctas. Los cambios pueden o no repintarse visiblemente, pero el reflujo en sí aún tiene que ocurrir detrás de escena.
Este efecto se crea cuando se toman medidas utilizando propiedades como offsetWidth o métodos como getComputedStyle . Incluso si no se usan los números, simplemente usar cualquiera de estos mientras el navegador aún está almacenando en caché los cambios será suficiente para activar el reflujo oculto. Si estas mediciones se toman repetidamente, debería considerar tomarlas solo una vez y almacenar el resultado, que luego podrá usarse más adelante.
Supongo que esto significa lo mismo que dijeron antes. Opera hará todo lo posible para almacenar en caché los valores y evitar el reflujo, pero no debes confiar en su capacidad para hacerlo.
Para todos los efectos, simplemente crea lo que ambos dicen cuando dicen que los tres tipos de interacciones pueden causar reflujo.
Salud.
Mire la sección "Renderizado activado por acceso de lectura de propiedad" de Comprender el comportamiento de renderizado de Internet Explorer , donde el siguiente código en IE provocará actividad de renderizado.
function askforHeight () {
$("#lower").height();
}
document.body.style.display = 'none';
document.body.style.display = 'block';
Esto a menudo resuelve esos errores de diseño incomprensibles.
