Limitación del rendimiento en el navegador con políticas de funciones

He aquí una buena idea de Tim Kadlec. Utilice la extensión Modheader para alternar encabezados personalizados en su navegador. También le permite ver cuando las imágenes son demasiado grandes y necesitan optimizarse de alguna manera. ¡Esta es una excelente manera de detectar problemas como este en un entorno local porque los navegadores arrojarán un error y no los mostrarán en absoluto!

Como menciona Tim, el truco está en el Feature Policyencabezado con la oversized-imagespolítica, y lo activa así:

Feature-Policy: oversized-images ‘none’;

Tim escribe:

De forma predeterminada, si proporciona al navegador una imagen en un formato compatible, la mostrará. Incluso es útil escalar esas imágenes para que se vean geniales, incluso si ha proporcionado un archivo enorme. Debido a esto, no es inmediatamente obvio cuando proporcionas una imagen que es más grande de lo que el sitio necesita.

La oversized-imagespolítica le dice al navegador que no permita imágenes que superen algún factor predefinido del tamaño de su contenedor. El umbral predeterminado recomendado es 2x, pero puedes anularlo si lo deseas.

¡Me encanta esta idea de usar el navegador para hacer el trabajo de linting por nosotros! Me pregunto de qué otras maneras podríamos usar el navegador para colocar barreras protectoras alrededor de nuestro trabajo para evitar errores futuros…

Enlace directo →