El Primer Renderizado con Contenido (FCP) indica el momento en el que se visualiza por completo el primer texto o la primera imagen de la página. El tiempo de carga de las fuentes de la página es muy importante porque mejora la experiencia del usuario.

Mide cuánto tiempo tarda el navegador en procesar la primera parte del contenido DOM, después de que un usuario navega a su página. Las imágenes, los elementos no blancos y los SVG en su página se consideran contenido DOM; todo lo que esté dentro de un iframe no está incluido.

Un problema particularmente importante para FCP es el tiempo de carga de las fuentes de la página. Las fuentes son a menudo archivos grandes que tardan en cargarse. Algunos navegadores ocultan los texto hasta que se carga la fuente por completo, lo que provoca un destello de texto invisible.

La forma más fácil de evitar mostrar texto invisible mientras se cargan las fuentes personalizadas es mostrar temporalmente una fuente del sistema. Al incluir font-display: swap en su estilo @font-face.

¿Encontró su respuesta?