feat(pagespeed): Fase 4.3 - Preload fuentes para reducir CLS
- Agregar preload de Poppins regular (400) y semibold (600) - Agregar fallback font con size-adjust para minimizar layout shift - Actualizar font stack con 'Poppins Fallback' Impacto esperado: CLS 0.133 → ~0.05-0.08 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -321,29 +321,44 @@ function roi_add_resource_hints( $urls, $relation_type ) {
|
||||
add_filter( 'wp_resource_hints', 'roi_add_resource_hints', 10, 2 );
|
||||
|
||||
/**
|
||||
* Preload de recursos críticos para mejorar LCP
|
||||
* Preload de recursos críticos para mejorar LCP y reducir CLS
|
||||
*
|
||||
* Preload indica al navegador que descargue recursos críticos lo antes posible.
|
||||
* Útil para fuentes, CSS crítico, y imágenes hero.
|
||||
*
|
||||
* Fase 4.3 PageSpeed: Preload de fuentes .woff2 para reducir CLS
|
||||
* - Sin preload: navegador descubre fuentes después de parsear CSS (tarde)
|
||||
* - Con preload: fuentes se descargan en paralelo con CSS (temprano)
|
||||
*
|
||||
* @since 1.0.0
|
||||
* @updated 1.0.22 Agregado preload de fuentes Poppins para reducir CLS
|
||||
*/
|
||||
function roi_preload_critical_resources() {
|
||||
// NOTA: Fuentes Poppins se cargan desde Google Fonts (enqueue-scripts.php)
|
||||
// No se necesita preload de fuentes locales
|
||||
$theme_uri = get_template_directory_uri();
|
||||
|
||||
// Preload del CSS de Bootstrap (crítico para el layout)
|
||||
$bootstrap_css = get_template_directory_uri() . '/Assets/Vendor/Bootstrap/Css/bootstrap.min.css';
|
||||
printf(
|
||||
'<link rel="preload" href="%s" as="style">' . "\n",
|
||||
esc_url( $bootstrap_css )
|
||||
esc_url( $theme_uri . '/Assets/Vendor/Bootstrap/Css/bootstrap.min.css' )
|
||||
);
|
||||
|
||||
// Preload del CSS de fuentes (crítico para evitar FOIT/FOUT)
|
||||
$fonts_css = get_template_directory_uri() . '/Assets/css/css-global-fonts.css';
|
||||
printf(
|
||||
'<link rel="preload" href="%s" as="style">' . "\n",
|
||||
esc_url( $fonts_css )
|
||||
esc_url( $theme_uri . '/Assets/css/css-global-fonts.css' )
|
||||
);
|
||||
|
||||
// Fase 4.3 PageSpeed: Preload de fuentes Poppins críticas
|
||||
// Regular (400) - texto del body
|
||||
printf(
|
||||
'<link rel="preload" href="%s" as="font" type="font/woff2" crossorigin>' . "\n",
|
||||
esc_url( $theme_uri . '/Assets/fonts/poppins-v24-latin-regular.woff2' )
|
||||
);
|
||||
|
||||
// Semibold (600) - headings y elementos destacados
|
||||
printf(
|
||||
'<link rel="preload" href="%s" as="font" type="font/woff2" crossorigin>' . "\n",
|
||||
esc_url( $theme_uri . '/Assets/fonts/poppins-v24-latin-600.woff2' )
|
||||
);
|
||||
}
|
||||
add_action( 'wp_head', 'roi_preload_critical_resources', 2 );
|
||||
|
||||
Reference in New Issue
Block a user