Enlaces sobre Performance III

Cómo hacer que la nueva página de inicio de GitHub sea rápida y eficaz : Tobias Ahlin describe cómo los efectos de desplazamiento se realizan de forma más eficaz gracias al IntersectionObserverhecho de que evita el uso de métodos que activan reflujos, como getBoundingClientRect. ¡Además, máscaras WebP + SVG!
Todo lo que sabemos sobre Core Web Vitals y SEO : Simon Hearne explica por qué todo el mundo está tan obsesionado con CWV en este momento: SEO. Simon dice algo que he escuchado un par de veces: la actualización de la experiencia de la página es más un enfoque de zanahoria que de palo: no existe una penalización directa por no cumplir con los objetivos de Google. Es decir, no se le penaliza por un CWV deficiente, pero se le otorga una asignación por los buenos números. Pero si todos los que te rodean reciben esa recompensa excepto tú, ¿no es lo mismo que una penalización?
Configuración de Cloudflare Workers para optimización y pruebas del rendimiento web : Matt Hobbs comienza con una introducción 101 sobre cómo configurar Cloudflare Worker, usándolo para interceptar un archivo CSS y reemplazar todas las declaraciones de familias de fuentes con Comic Sans. Tal vez eso le abra los ojos a las posibilidades: si puede manipular todos los recursos como HTML, CSS y JavaScript, puede obligar a esas cosas a hacer cosas más efectivas.
¡ESO es lo que yo llamo trabajador de servicio! — Jeremy Wagner configura un trabajador de servicio de “transmisión” que almacena en caché las partes comunes de un sitio web (por ejemplo, el encabezado y el pie de página) de modo que la gente del condado de Waushara, Wisconsin, que tiene Internet Lento, pueda cargar el sitio en algún lugar cercano al doble rápido. Esto se basa en el artículo “Cargas útiles HTML más pequeñas con trabajadores de servicios” de Philip Walton.
¿Quién tiene el sitio web de F1 más rápido en 2021? — La épica serie de 10 capítulos de Jake Archibald que analiza el rendimiento de los sitios web de carreras de F1 (oh, qué ironía). Parece que Red Bull está a la cabeza hasta ahora con Ferarri detrás. Hay mucho que aprender en todo esto, y es algo catártico ver fragmentos divertidos como: Su sitio era lento debido a un script de bloqueo de 1,8 MB, pero 1,7 MB de ese era un PNG de 2300 × 2300 en línea de un caballo que solo era mostrado en 20×20. Además, ¡no creo que supiera que Jake fue el constructor original de Sprite Cow! (No uses eso porque resulta que los sprites son malos).
Comparación de rendimiento de CSS en el mundo real frente a CSS-in-JS : Tomas Pustelnik analiza las implicaciones de rendimiento de CSS-in-JS. O, como me gusta señalar: CSS-in-React, ya que eso es siempre lo que es, ya que todos los demás grandes marcos de JavaScript tienen sus propias soluciones de estilo. Tomas no comparó los componentes con estilo con CSS vainilla escrito a mano, sino con Linaria, que creo que la mayoría de la gente todavía considera CSS-en-JS, excepto que en lugar de agrupar los estilos en JavaScript, genera CSS. Estoy de acuerdo en que, independientemente de lo que haga una biblioteca de estilos para DX, producir CSS parece ser el camino a seguir para la producción. Otra razón más por la que me gustan los módulos css. Las bibliotecas más modernas también lo están haciendo.
El caso de la solicitud de 50 ms : Julia Evans armó este rompecabezas interactivo para intentar descubrir por qué una solicitud del servidor tarda más de lo debido. Es más una cuestión de back-end que de front-end, pero los pasos para la solución de problemas resultan familiares. Pruébelo en su máquina, pruébelo en mi máquina, vea qué está haciendo el servidor, etc.

Deja un comentario Cancelar respuesta