refactor(fonts): cambiar a system fonts - CERO flash

- Eliminar @font-face de Poppins (critical-bootstrap.css, css-global-fonts.css)
- Actualizar --bs-body-font-family a system font stack
- Desactivar font preload en CriticalCSSInjector.php
- Actualizar bootstrap-subset.min.css

System fonts garantizan carga instantánea sin parpadeo.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
FrankZamora
2025-12-02 10:29:01 -06:00
parent 565c275c16
commit ce66eeba6d
4 changed files with 43 additions and 135 deletions

View File

@@ -9,10 +9,11 @@ use ROITheme\Public\CriticalCSS\Domain\Contracts\CriticalCSSCacheInterface;
* Inyecta CSS critico en wp_head
*
* Prioridades:
* - P:-2 Font preload (antes de variables)
* - P:-1 Variables CSS (antes de Bootstrap)
* - P:2 Responsive critico (despues de Bootstrap critico)
*
* NOTA: Font preload deshabilitado - usando system fonts para CERO flash
*
* @package ROITheme\Public\CriticalCSS\Infrastructure\Services
*/
final class CriticalCSSInjector
@@ -21,23 +22,11 @@ final class CriticalCSSInjector
private readonly CriticalCSSCacheInterface $cache
) {}
/**
* Fuentes criticas para preload (pesos usados en navbar above-the-fold)
*/
private const CRITICAL_FONTS = [
'/Assets/Fonts/poppins-v24-latin-regular.woff2', // 400 - body text
'/Assets/Fonts/poppins-v24-latin-600.woff2', // 600 - navbar brand
'/Assets/Fonts/poppins-v24-latin-700.woff2', // 700 - headings
];
/**
* Registra hooks de WordPress
*/
public function register(): void
{
// Font preload: P:-2 (antes de todo, incluso variables)
add_action('wp_head', [$this, 'preloadFonts'], -2);
// Variables CSS: P:-1 (antes de CriticalBootstrapService P:0)
add_action('wp_head', [$this, 'injectVariables'], -1);
@@ -49,25 +38,6 @@ final class CriticalCSSInjector
add_action('wp_enqueue_scripts', [$this, 'dequeueInlinedCSS'], 999);
}
/**
* Inyecta preload links para fuentes criticas
*
* Resuelve el problema de "font swap" donde el fallback (106% size-adjust)
* causa un salto visual cuando Poppins se carga.
* Con preload, las fuentes llegan antes del primer paint.
*/
public function preloadFonts(): void
{
echo "<!-- TIPO 4: Font preload para evitar CLS -->\n";
foreach (self::CRITICAL_FONTS as $font) {
printf(
'<link rel="preload" href="%s" as="font" type="font/woff2" crossorigin>' . "\n",
esc_url(get_template_directory_uri() . $font)
);
}
}
/**
* Inyecta variables CSS criticas
*/