## TIPO 4: CSS Below-the-fold (Critical Variables + Responsive) - Inyecta variables CSS críticas inline en wp_head P:-1 - Inyecta media queries críticas inline en wp_head P:2 (corregido de P:1) - Auto-regeneración cuando archivos fuente cambian (filemtime check) - Cache en Assets/CriticalCSS/ para evitar lecturas repetidas - Comando WP-CLI: wp roi-theme generate-critical-css Archivos TIPO 4: - Public/CriticalCSS/Domain/Contracts/ - Interfaces (DIP) - Public/CriticalCSS/Application/UseCases/GetCriticalCSSUseCase.php - Public/CriticalCSS/Infrastructure/Cache/CriticalCSSFileCache.php - Public/CriticalCSS/Infrastructure/Services/CriticalCSSExtractor.php - Public/CriticalCSS/Infrastructure/Services/CriticalCSSInjector.php - bin/generate-critical-css.php ## TIPO 5: CSS No Crítico (Lazy Loading) - Animaciones CSS: carga 2s después de page load via requestIdleCallback - Print CSS: carga solo al imprimir via beforeprint event - Fallback <noscript> para usuarios sin JavaScript - Safari fallback: setTimeout cuando requestIdleCallback no disponible Archivos TIPO 5: - Assets/Js/lazy-css-loader.js - Public/LazyCSSLoader/Infrastructure/Contracts/LazyCSSRegistrarInterface.php - Public/LazyCSSLoader/Infrastructure/Services/LazyCSSRegistrar.php ## Fix: Colisión de prioridades wp_head Antes: TIPO 1 (P:1), TIPO 4 responsive (P:1), TIPO 3 (P:2) - CONFLICTO Después: TIPO 1 (P:1), TIPO 4 responsive (P:2), TIPO 3 (P:3) - OK Nuevo orden de prioridades: P:-1 roi-critical-variables (TIPO 4) P:0 roi-critical-bootstrap (TIPO 2) P:1 roi-critical-css (TIPO 1) P:2 roi-critical-responsive (TIPO 4) P:3 roi-custom-critical-css (TIPO 3) P:5 roi-theme-layout-css (ThemeSettings) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
74 lines
1.9 KiB
PHP
74 lines
1.9 KiB
PHP
<?php
|
|
/**
|
|
* WP-CLI Command para generar CSS critico TIPO 4
|
|
*
|
|
* Uso:
|
|
* wp roi-theme generate-critical-css
|
|
* wp roi-theme generate-critical-css --clear
|
|
*
|
|
* @package ROITheme
|
|
*/
|
|
|
|
if (!defined('WP_CLI')) {
|
|
return;
|
|
}
|
|
|
|
use ROITheme\Public\CriticalCSS\Infrastructure\Cache\CriticalCSSFileCache;
|
|
use ROITheme\Public\CriticalCSS\Infrastructure\Services\CriticalCSSExtractor;
|
|
use ROITheme\Public\CriticalCSS\Application\UseCases\GetCriticalCSSUseCase;
|
|
|
|
/**
|
|
* Comandos para gestionar CSS critico TIPO 4
|
|
*/
|
|
class ROI_CriticalCSS_Command
|
|
{
|
|
/**
|
|
* Genera CSS critico para todas las paginas
|
|
*
|
|
* ## OPTIONS
|
|
*
|
|
* [--clear]
|
|
* : Limpia cache antes de regenerar
|
|
*
|
|
* ## EXAMPLES
|
|
*
|
|
* wp roi-theme generate-critical-css
|
|
* wp roi-theme generate-critical-css --clear
|
|
*
|
|
* @when after_wp_load
|
|
*/
|
|
public function __invoke($args, $assoc_args)
|
|
{
|
|
$cache = new CriticalCSSFileCache();
|
|
$extractor = new CriticalCSSExtractor($cache);
|
|
$useCase = new GetCriticalCSSUseCase($cache, $extractor);
|
|
|
|
// Limpiar cache si se solicita
|
|
if (isset($assoc_args['clear'])) {
|
|
$cache->clear();
|
|
WP_CLI::log('Cache limpiado.');
|
|
}
|
|
|
|
WP_CLI::log('Generando CSS critico TIPO 4...');
|
|
|
|
$results = $useCase->regenerate();
|
|
|
|
if (empty($results)) {
|
|
WP_CLI::warning('No se genero CSS critico. Verifica que existan los archivos fuente.');
|
|
return;
|
|
}
|
|
|
|
foreach ($results as $type => $size) {
|
|
WP_CLI::success(sprintf(
|
|
'%s.critical.css: %s bytes',
|
|
$type,
|
|
number_format($size)
|
|
));
|
|
}
|
|
|
|
WP_CLI::success('CSS critico TIPO 4 generado exitosamente.');
|
|
}
|
|
}
|
|
|
|
WP_CLI::add_command('roi-theme generate-critical-css', 'ROI_CriticalCSS_Command');
|