Desbloqueando la Velocidad del E-commerce con Zero-JS

El desafío en el e-commerce híbrido era integrar un motor de comercio electrónico pesado como WooCommerce en una arquitectura orientada al rendimiento extremo, sin sacrificar la experiencia del usuario. El objetivo era mantener un Tiempo de Bloqueo Total (TBT) de 0ms y seguir las prácticas Headless para el catálogo de productos.

La Épica 6 abordó este reto con dos ejes arquitectónicos clave:

1. Catálogo Headless (merci-shop.py): Los productos se gestionaban en Markdown con metadatos YAML y se inyectaban directamente a través de una API REST, convirtiendo a WooCommerce en un simple motor de base de datos pasivo.

2. Carrito Zero-JS: Se desencolaron todos los scripts AJAX (wc-cart-fragments), librerías de bloques Gutenberg y frameworks de React inyectados por las versiones modernas del CMS. Al aplicar una auto-sanación en la base de datos (convirtiendo bloques a shortcodes clásicos), se obligó a WooCommerce a funcionar con peticiones POST HTML nativas.

El «Aha! moment» llegó cuando se descubrió que el «Mejor código es el que no existe». Al obligar a WooCommerce a comportarse como una aplicación de los años 90 (recargando la página entera tras enviar un formulario POST en lugar de usar pesadas llamadas AJAX), se eliminó toda carga de procesamiento de JavaScript en el navegador del cliente.

El resultado empírico fue un TBT garantizado de 0ms, demostrando que es posible tener un e-commerce completamente funcional y ultrarrápido si se extirpa implacablemente la dependencia de JavaScript en el lado del cliente (Client-side rendering).

Para profundizar en este tema y ver todos los detalles de la solución, leer cuadernillo.