Construyendo un generador de sitios estaticos sin dependencias

Los SSG modernos como Astro o Eleventy son excelentes, pero muchas veces traen mas de lo que necesitas. Mi objetivo era simple: convertir una base de datos JSON en HTML estatico, sin webpack, sin bundlers, sin 200MB de node_modules.

El motor de templates

En lugar de usar un motor de templates completo como Handlebars o EJS, escribi un renderizador de 10 lineas que entiende {{variables}} y bloques {{#array}}...{{/array}}.

function render(template, data) {
  return template
    .replace(/\{\{#(\w+)\}\}([\s\S]*?)\{\{/\1\}\}/g, (m,k,inner) =>
      (data[k]||[]).map(i => render(inner, {...data,...i})).join(""))
    .replace(/\{\{(\w+)\}\}/g, (m,k) => data[k] ?? m);
}

Eso es todo. 3 lineas de regex y recursividad. Genera HTML, RSS, sitemaps y JSON API desde los mismos templates.

Rendimiento del build

Comparado con Astro (que tarda 3-5 segundos en el mismo hardware), la diferencia es abismal. Claro, Astro hace mucho mas (hydration, bundling, etc.), pero para un blog estatico puro, es overkill.