Resumen del Constructor de Sitios

Tres constructores deciden qué ve un visitante, y todos hablan el mismo idioma: bloques.

        ┌──────────────── Header Builder ────────────────┐
        │  topbar · logo · navigation · search · actions  │
        └────────────────────────────────────────────────┘
        ┌──────────────── Page Builder ──────────────────┐
        │  slider · banner · features · products · CTA …  │
        │  (one page = an ordered bundle of blocks)       │
        └────────────────────────────────────────────────┘
        ┌──────────────── Footer Builder ────────────────┐
        │  brand · menu columns · newsletter · legal …    │
        └────────────────────────────────────────────────┘
                              ▲
                   ┌──────────┴──────────┐
                   │  Template Library   │
                   │ pages · blocks ·    │
                   │ header · footer     │
                   └─────────────────────┘

Por qué son constructores separados

El contenido de la página y el chrome del sitio se ven similares pero se comportan de manera diferente. El chrome aparece en todas las páginas, debe cargar rápido y contiene funcionalidad en vivo (navegación, búsqueda, carrito). El contenido de la página es por-URL y mayormente editorial. Así que el chrome tiene su propio almacenamiento y su propia entrega en caché, mientras que las páginas obtienen el editor de bloques completo. Ambos utilizan el mismo JSON de bloques, que es lo que permite que una biblioteca de plantillas sirva a todos ellos.

Esto refleja cómo otros sistemas maduros lo dividen: WordPress llama al chrome "partes de plantilla", Shopify lo llama "grupos de secciones". Nadie renderiza el encabezado a través del motor de página.

Dónde encontrar cada uno

Modelo de rendimiento

El encabezado y el pie de página se obtienen por la tienda en una solicitud en caché (GET /public/site-chrome), iniciada por un <link rel="preload"> en el shell de la página. En una caché caliente esa solicitud cuesta cero consultas a la base de datos, y la solicitud se almacena en caché en la pestaña del navegador para la sesión, por lo que moverse entre páginas nunca la vuelve a obtener. Nada relacionado con el chrome se ejecuta dentro de la solicitud de página, así que la primera pintura nunca se bloquea — los esqueletos mantienen el diseño hasta que llega la carga.