Los usuarios pueden notar fácilmente si tu sitio web o las aplicaciones no funcionan bien, por tanto, optimizar el rendimiento del renderizado es crucial.

Potenciales clientes y usuarios de la web esperan que las páginas que visitan sean interactivas y fluidas y es justo aquí donde todo empresario, dueño de un negocio que tiene una página web, debe concentrar su atención. Las páginas no solo deben cargarse rápidamente, sino también funcionar bien; el desplazamiento a través de esta, debe ser lo más rápido posible, y las animaciones e interacciones deben ser fluidas.

Para escribir sitios y aplicaciones de alto rendimiento, es necesario comprender cómo el navegador maneja HTML, JavaScript y CSS y asegurarse de que el código de su aplicación web (e inclusive, el resto del código que proviene de terceros) se ejecute de la manera más eficiente posible.

Frecuencia de actualización del dispositivo a 60 fps

La mayoría de las computadoras y teléfonos inteligentes actuales actualizan sus pantallas 60 veces por segundo. Si se está ejecutando una animación o transición, o el usuario se está desplazando por las páginas, el navegador debe coincidir con la frecuencia de actualización del dispositivo y mostrar 1 nueva imagen, o marco, para cada una de esas actualizaciones de pantalla.

Cada uno de esos fotogramas tiene un presupuesto de poco más de 16 ms (1 segundo/60 = 16,66 ms). Sin embargo, el navegador tiene trabajo de mantenimiento que hacer, por lo que todo el trabajo debe completarse en 10 ms. Si no cumple con este presupuesto, la velocidad de fotogramas cae y el contenido vibra en la pantalla. Esto a menudo se conoce como «jank«y afecta negativamente la experiencia del usuario.

Aquí te dejo un artículo completo que puedes revisar con más detalle > Acceder
Y en la imagen puedes acceder al curso «Optimización de la renderización del navegador» dictado por un profesional en la materia, de Google.