El desafío
PMK vende autopartes online: un catálogo de casi 700 productos en WooCommerce. Sobre esa base se apilaban tres capas de CSS que el navegador tenía que descargar y procesar antes de mostrar nada: el tema, WooCommerce y los headers de Elementor. El cuello de botella no estaba en el servidor, y por eso el camino no era otra capa de caché sino decidir, para cada tipo de página, qué CSS es realmente crítico.
Lo que se hizo
Herramientas propias en Python para extraer el CSS crítico de cada tipo de página, en vez de un plugin genérico de optimización automática:
- CSS crítico por tipo de página: home, catálogo, categoría y producto, cada una con su variante
- Eliminación de CSS bloqueante de WooCommerce y el tema
- Optimización del grid de productos para eliminar layout shifts
- Headers de Elementor optimizados vía templates directos
Resultado
El LCP móvil bajó de 11,0s a 6,14s: 44% menos de espera antes de que la ficha de producto muestre su contenido.
La intervención de velocidad es un capítulo dentro de una relación que viene desde 2022, cuando el rediseño de marca y el desarrollo de esta misma web reemplazaron un sitio PHP que había quedado fuera de tiempo. Después vinieron la mantención y el desarrollo continuo, un canal mayorista aparte del retail con sus propios precios, y hoy una migración completa del sitio en curso.
El punto de partida
Una tienda de autopartes con casi 700 productos y un LCP móvil de 11 segundos: la página terminaba de pintar cuando buena parte de los visitantes ya se había ido. El caché no alcanzaba porque el problema era CSS bloqueante.
