Un stack(pila) en programación es una colección de tecnologías, configuradas para trabajar entre sí.

En muchas ocasiones, una stack va acompañada de una filosofía de trabajo, un cómo realizar las cosas, de beneficios, al igual que desventajas, de casos en los que será mejor ese stack u otro.

Algunas de las stack más famosas son LAMP (Linux, APache, mySQL y PHP), MEAN (Mongo, Express, Angular y NodeJS), MERN (Mongo, Express, React y NodeJS), entre otras más, que han tenido momentos de mucha popularidad. En este artículo te quiero hablar del JAMStack, una stack pensada en rendimiento, velocidad y escalabilidad.

QUÉ ES EL JAMSTACK

Las palabras JAM hacen referencia al conjunto de tecnologías que componen el JAMStack, JavaScript, APIs y Markup pre compilado, en un momento ahondaré más en cómo funcionan estas tecnologías en conjunto y cuáles son los beneficios.

La base del JAMStack está en una arquitectura orientada hacia el cliente, y no hacia el servidor. Con el creciente desarrollo de frameworks JavaScript que corren en el frontend como React, Angular, Vue, entre otros, éste stack delega el funcionamiento de la aplicación a la programación en el cliente, lo que permite reducir el trabajo que hacemos en el servidor y por lo tanto entregar respuestas más rápidas en nuestras páginas web.

El segundo pilar de esta stack está en las APIs, por lo que en lugar de acceder a la base de datos desde el servidor y compilar templates con éstos datos como tradicionalmente lo hacen frameworks como Laravel, Rails, Django, etc. La comunicación de datos con nuestra aplicación se abstrae en servicios web, a los que accedemos vía HTTPs con JavaScript, usando cualquier tecnología del cliente que hayas decidido para la base de tu aplicación, como explicamos en el párrafo anterior.

Por último, un tercer pilar es el Markup precompilado, que a diferencia del desarrollo web tradicional, promueve precompilar las vistas, el marcado o los templates, en lugar de generarlos dinámicamente en cada petición, más de esto en el siguiente punto:

MONOLITOS VS. MICROSERVICIOS

Consultar al servidor puede hacer lento el funcionamiento de nuestra página.

El JAMStack cambia de paradigma y nos ofrece hacer el trabajo desde el lado del servidor y entregar al cliente una página estática ya renderizada. Agiliza los procesos, consume menos recursos, gana en velocidad, optimización y perfomance.

El cambio consiste en utilizar microservicios para cada utilidad que necesitemos haciendo el sistema en general flexible y liviano.

REDES DE DISTRIBUCIÓN EN LA NUBE.

En JAM podemos montar nuestra página estática en Cloud Delivery Networks por (CDN).

Las CDN son redes de servidores administradas por software de distribución, donde podemos montar nuestros archivos estáticos (imágenes, archivos css, scripts, templates, etc), y el software se encarga de distribuirlos alrededor del mundo.

Cuando una petición viene a una CDN, ésta decide de qué servidor en la red global deberá responder a la petición, procurando dar la respuesta más rápida y eficiente. Además de que no dependemos del funcionamiento de un servidor para mantener nuestro sitio en línea.

Esto hace muy escalable nuestro sitio porque al CDN no le importa recibir muchas peticiones porque ya tiene los archivos estáticos preparados.

Tres proveedores se destacan en el ámbito de las CDN para aplicaciones, o Application Delivery Network: Vercel, Firebase Hosting y Netlify. Estos servicios ofrecen, además de la red de distribución, herramientas para la automatización de la subida de nuevos cambios y actualizaciones al sitio web.

¿ES UN SITIO WEB ESTÁTICO O UNA APLICACIÓN WEB?

A pesar de que en el JAMStack, el marcado es precompilado y estático, no sacrificamos el dinamismo. La parte dinámica del código se mueve del servidor al cliente, a través de código JavaScript como discutimos con anterioridad, normalmente con la ayuda de un framework frontend como React, Angular o Vue.

Como se menciona en el sitio oficial de Gatsby, una de las tecnologías más populares del JAMStack, en el presente todos los sitios web son aplicaciones web, y todas las aplicaciones web son sitios estáticos.

Las aplicaciones del JAMStack mueven el dinamismo al cliente y los datos a servicios web que se consumen con JavaScript.

RECURSOS Y TECNOLOGÍAS

Los requisitos para aplicar este stack son muy simples:

• JavaScript en el cliente para interactividad y consumir servicios web
• Precompilar sitios estáticos y preferentemente, distribuirlos en una CDN

Las implementaciones del JAMStack son increíbles, con la creciente popularidad de esta filosofía, se han generado proyectos donde la experiencia de desarrollo es de primera clase, en la página StaticGen.com se almacena una colección de tecnologías que generan sitios estáticos, entre ellas podemos encontrar algunas que usan el JAMStack:

• Next.js: Frontend con React. Link
• Nuxt: Frontend con Vue. Link
• Angular Universal: Frontend con Angular. Link
• Gatsby: Frontend con React y GraphQL. Link

En mi caso trabajo con React en conjunto con Next.js. Creo que Vercel es la punta de lanza en esta tecnología y se encuentran constantemente trabajando en nuevas actualizaciones y mejoras al proyecto. Las ventajas son muchas y permiten facilidades como que el cliente pueda manejar su información a través de una API, servicio que prestan empresas como Prismic CMS (Contetn Manager System)

CONCLUSIÓN

El JAMStack es un stack de tecnologías que mueve la interactividad del servidor al cliente, donde los datos se consumen a través de https en servicios web usando JavaScript, usualmente acompañado de un framework frontend, además, los templates o el marcado son compilados en desarrollo, antes de subirse a un hosting, recomendamos aprovechar el stack con una red de distribución en la nube.

Existen tecnologías en el mercado para iniciar inmediatamente, entre las que destacan Next, Nuxt, Angular Universal y Gatsby. Vercel es Next, y creo que tienen la mejor infraestructura para montar un JAM lo que hace muy difícil obtener una mejor perfomance.

FUENTE: Código Facilito