El proceso mediante el cual el navegador vuelve a calcular las posiciones y geometrías de los elementos de la página para volver a representar parte o la página completa se llama reflujo. Dado que el reflujo es una operación de bloqueo de usuarios en el navegador, es importante comprender cómo reducir el número de reflujos y cómo los diferentes atributos del documento (profundidad de DOM, eficiencia de CSS, cambios de estilo sin tipo) afectan el número de reflujos. muy necesario para los desarrolladores. A veces, un elemento en una página redistribuida redistribuirá su elemento principal (Anotación: plural aquí) y todos los elementos secundarios.
Hay varias operaciones de usuario y cambios de DHTML que pueden desencadenar el reflujo. Ajustar el tamaño de la ventana del navegador, usar javascript para calcular estilos ( estilos calculados ), crear y eliminar elementos en el DOM y cambiar la clase de elementos activará el reflujo. Vale la pena señalar que algunas operaciones activarán el reflujo varias veces, más allá de su imaginación. La siguiente imagen es del discurso de Steve Souders " Sitios web aún más rápidos ":
De la tabla anterior, es obvio que no todos los estilos controlados por JavaScript activan el reflujo en todos los navegadores, e incluso si se activan, la cantidad de veces no es la misma. Al mismo tiempo, se puede ver que los navegadores modernos controlan cada vez mejor la cantidad de reflujos.
En Google, medimos la velocidad de nuestras páginas y aplicaciones web de diversas formas, y el reflujo es un factor clave que consideramos al agregar la interfaz de usuario. Nos esforzamos por ofrecer una experiencia de usuario animada, interactiva y agradable.
en principio
Aquí hay algunos principios para reducir el reflujo:
En el video a continuación (Anotación: citado de YouTube, no se puede ver, vaya al texto original para evitar el muro), Lindsey presenta algunos métodos para reducir el reflujo.
Lectura adicional
Traducción original: http://www.99css.com/2009/06/minimizing-browser-reflow.html