Acerca de

sitelo no empezó como un framework. Empezó como el picor de querer escribir marcado de una forma que resultara natural en JavaScript — y siguió creciendo hasta cubrir todo el camino desde el archivo de la página hasta el sitio publicado.

javascript-to-html

Primero llegó javascript-to-html (también conocido como ht.js): una forma sencilla e intuitiva de generar HTML en JavaScript, sin motores de plantillas complejos ni frameworks.

Con lo omnipresentes que se habían vuelto los frameworks completos como React, encontrar una solución de plantillas sencilla que no viniera con todo el equipamiento incluido era sorprendentemente difícil. Al centrarse solo en transformar JavaScript en HTML —básicamente funciones que devuelven cadenas—, ht.js se mantiene ligero, fácil de usar, flexible y extensible.

Esa superficie tan reducida hace que encaje en muchos sitios: directamente en el frontend (estilo SPA), en una compilación para crear sitios estáticos (SSG), o incluso para renderizado en servidor (SSR).

Enseñarle a Vite a emitir HTML

Eso resolvía la escritura. El siguiente problema era la compilación: Vite trata los .js / .ts como scripts, no como páginas. Hacía falta una convención donde ciertos módulos estuvieran pensados para convertirse en HTML.

La idea era directa: los archivos llamados *.ht.js, *.html.js, *.ht.ts y compañía deberían procesarse a HTML en lugar de empaquetarse como JavaScript de cliente. Esa convención se convirtió en vite-plugin-html-pages: enrutado basado en archivos, carga de datos, recursos y generación estática sobre Vite.

sitelo

sitelo envuelve Vite y ese plugin en una sola instalación y una sola CLI. Obtienes una experiencia de desarrollo integral y de primera: sitelo para un servidor en vivo, sitelo build para producción, valores por defecto sensatos y el modelo de páginas del plugin sin tener que montar tú la cadena de herramientas.

La misma idea de arriba abajo: las páginas son módulos que devuelven HTML. sitelo es la capa que hace que esa idea se sienta terminada.

Componentes e islas de servidor

Las funciones que devuelven HTML resultaron componerse hasta arriba del todo. sitelo-ui es una biblioteca de componentes hecha de la misma forma — botones, tarjetas, formularios, tablas, modales y secciones de página, cada uno una función que devuelve un string. Sin compilador, sin runtime, sin hidratación: lo que construyes es lo que acaba en dist/.

Aun así, no todas las regiones de una página pueden ser estáticas. Las islas de servidor mantienen la página estática y renderizan en un servidor, cuando se visita la página, solo las partes que necesitan datos frescos en cada petición — los comentarios bajo un post en caché, el stock en una página de producto. Una isla es, otra vez, una función que devuelve HTML: el build publica su contenido de reserva y un cargador diminuto inserta el fragmento renderizado.

Ninguna de las dos cambia el modelo. Sigue sin haber framework en el cliente — solo HTML a partir de funciones, en tiempo de build o en tiempo de petición.

Cómo se compara

Ya hay muchas buenas herramientas para publicar sitios estáticos. El nicho de sitelo es estrecho a propósito: funciones de JavaScript (o TypeScript) que devuelven HTML, con la experiencia de desarrollo de Vite, y con el mínimo framework posible.

HerramientaModeloÚsala cuando
siteloFunciones JS/TS → HTML sobre Vite, más componentes e islas de servidorQuieres HTML a partir de JavaScript con un flujo de trabajo real de Vite — componentes y regiones por petición incluidos, sin framework de cliente ni hidratación
AstroComponentes de framework + islas de cliente y de servidor, compilador propioQuieres hidratar componentes de React, Vue o Svelte en el navegador, con un ecosistema más grande
Next.jsAplicación React completa (SSR / SSG / ISR)Estás construyendo una aplicación dentro del ecosistema de React
HugoPlantillas de Go, compilaciones muy rápidasSitios de contenido enormes y te sientes cómodo con las herramientas de Go
EleventyLenguajes de plantillas → HTMLQuieres plantillas flexibles (Nunjucks, Liquid, …) sin un framework de SPA

Si quieres componentes en el cliente e hidratación — usa un framework. Si quieres HTML a partir de funciones de JavaScript con la experiencia de Vite — componentes y regiones renderizadas en el servidor incluidos —, sitelo es la herramienta más pequeña que hace el trabajo completo.

Leer la documentación · GitHub