Aplazar javascript y mostrar contenido provisional en la carga inicial de la página

Esto probablemente ya está bloqueado por https://chromium.googlesource.com/chromium/src/+/master/docs/speed/metrics_changelog/2020_11_lcp.md:

Las imágenes de pantalla completa, que son visualmente equivalentes a las imágenes de fondo, ya no se consideran el mayor elemento de pintura con contenido (largest contentful paint).


Buen punto: véase Largest Contentful Paint (LCP)  |  Articles  |  web.dev

Para los elementos de texto, solo se considera el tamaño de sus nodos de texto (el rectángulo más pequeño que abarca todos los nodos de texto).

Para todos los elementos, no se consideran los márgenes, rellenos o bordes aplicados a través de CSS.

  • Es por eso que el nodo de texto estático debe renderizarse exactamente del mismo tamaño que el nodo de texto de EmberJs.
  • O incluso ligeramente más grande aumentando el line-height.
    Por ejemplo, si el ancho de los nodos de texto no coincide, hay muchos casos geométricos introducidos por diferentes saltos de línea en los que el nodo de texto estático se vuelve más pequeño que el de EmberJs.

Véase: Ejemplos de LCP


En realidad, utilicé la representación noscript de las publicaciones dentro de la página de un tema. Las clases CSS coinciden ligeramente con las reales, por lo que el aspecto es el mismo.

Véase: Cambios en app/views/layouts/application.html.erb

Editar: Mi error, esta es en realidad la vista del rastreador: app/views/topics/show.html.erb

2 Me gusta