content-visibility: la nueva propiedad CSS que aumenta el rendimiento de renderizado

 

 

 

Una Kravets y Vladimir Levin:

[…] puedes usar otra propiedad CSS llamada content-visibilitypara aplicar la contención necesaria automáticamente. content-visibilityGarantiza que usted obtendrá las mayores ganancias de rendimiento que el navegador puede proporcionar con el mínimo esfuerzo por su parte como desarrollador.

La content-visibilitypropiedad acepta varios valores, pero autoes el que proporciona mejoras inmediatas de rendimiento.

Los beneficios de rendimiento parecen bastante grandes:

En nuestro ejemplo, vemos un aumento de un tiempo de renderizado de 232 ms a un tiempo de renderizado de 30 ms . Eso es un aumento de rendimiento siete veces mayor .

 

Aunque es un trabajo manual. Tienes que “seccionar” grandes trozos verticales de la página tú mismo, aplicarlos content-visibility: auto;y luego intentar determinar qué tan altos son, algo así como contain-intrinsic-size: 1000px;. Esa parte de mí parece súper rara. ¿Adivina simplemente a qué altura? ¿Qué pasa si me equivoco? ¿Puedo perjudicar el rendimiento? ¿Puedo (o debería) cambiar ese valor en diferentes ventanas gráficas si la diferencia de altura entre pantallas pequeñas y grandes es drástica?

 

Parece que tendrías que ser un nerd de rendimiento bastante hábil para hacer esto bien y saber cómo mirar y comparar perfiles de renderizado en DevTools. Una prueba más de que el rendimiento web es su propia vocación. Todo sobre peces y sus Acuarios, Plantas, Accesorios






SUSCRÍBETE A NUESTRO BOLETÍN 

No te pierdas de nuestro contenido ni de ninguna de nuestras guías para que puedas avanzar en los juegos que más te gustan.










Al suscribirte, aceptas nuestra política de privacidad y nuestros términos de servicio.






Tal vez te puede interesar:

  1. ¿Cómo se hace el tamaño máximo de fuente en CSS?
  2. Cambiar el tamaño de los valores en pasos en CSS
  3. ¿Qué hace “revertir” en CSS?
  4. CSS4 es una mala idea

content-visibility: la nueva propiedad CSS que aumenta el rendimiento de renderizado

content-visibility: la nueva propiedad CSS que aumenta el rendimiento de renderizado

[…] puedes usar otra propiedad CSS llamada content-visibilitypara aplicar la contención necesaria automáticamente. content-visibilityGarantiza que usted ob

programar

es

https://pseint.es/static/images/programar-content-visibility-la-nueva-propiedad-css-que-aumenta-el-rendimiento-de-renderizado-1720-0.jpg

2024-06-13

 

content-visibility: la nueva propiedad CSS que aumenta el rendimiento de renderizado
content-visibility: la nueva propiedad CSS que aumenta el rendimiento de renderizado

Si crees que alguno de los contenidos (texto, imagenes o multimedia) en esta página infringe tus derechos relativos a propiedad intelectual, marcas registradas o cualquier otro de tus derechos, por favor ponte en contacto con nosotros en el mail [email protected] y retiraremos este contenido inmediatamente

 

 

Update cookies preferences