O que é a Jamstack e deverias estar interessado?

Ivo Martins
MCTW_TDW
Published in
6 min readSep 21, 2022

Neste post vou explorar e explicar o que é a Jamstack, ou até, JAMstack. Inicialmente eu não sabia nada sobre este tema mas penso que consegui chegar a um ponto em que sou capaz de passar a informação e finalmente transmitir a minha opinião sobre este modelo de arquitetura moderna de desenvolvimento web.

A Jamstack revoluciona a forma como as empresas fornecem conteúdos web. Fornece sites e aplicações web rápidos e seguros através da distribuição directa de ficheiros pré-renderizados através de uma Content Delivery Network (CDN). O stack dissocia a gestão de conteúdos e permite um melhor desempenho, melhor SEO, taxas de conversão mais elevadas, maior segurança e custos reduzidos.

Figura 1 : JAMstack | Fonte

Jamstack ou JAMstack?

Originalmente, o modelo foi intitulado “JAMstack” dado a origem do JAM interligar JavaScript, API e Markup. Ao contrário de utilizar um Content Management System (CMS) tradicional, ou site builders espalhados pela internet, a JAMstack encontra-se dividída em três bases principais, primeiramente o JavaScript para conseguir controlar as funcionalidade dinâmicas e todo o código; o recurso a API’s para controlor operações viradas para Server side, para gestão e fetch de conteúdo, mais uma vez acedendo via HTTPS e JavaScript; e por último, Markup, que entra em ação numa fase final de deploy, transformando todo o código num ficheiro HTML estático e pronto a ser “lido” pelo browser.

Figura 2 : Representação do modelo JAMstack | Fonte

Como é que a Jamstack se destaca de outras arquiteturas na Web?

Enquanto que em modelos mais tradicionais, mais uma vez usando o exemplo CMS, todo o trabalho encontra-se presente e agrupado num só sistema, essencialmente acaba por existir uma interface backend onde programadores irão trabalhar e lidar com todo o código e modelos de design, tal como gerir e atualizar o devido conteúdo e controlar todos os dados presentes na Database.

A Jamstack dissocia estes momentos e permite o seu tratamento separadamente. Deste modo, conseguimos dimunuir qualquer dependência e ter muita mais liberdade ao escolher as tecnologias a usar. Um website fruto deste modelo irá ter as suas páginas armazenadas numa cache, típicamente dando uso a um CDN, como empresa de computação Netlifly. Ao contrário do modelo tradicional, tendo um utilizador visitado a nova página web, tudo irá estar pronto sem existir a necessidade de voltar ao servidor e montar esta nova página.

Figura 3 : Principais diferenças entre workflows | Fonte

Pros de usar Jamstack

  • A empresa defende a velocidade das páginas web, dado o uso reduzido de servidores e base de dados, o utilizador irá experienciar uma navegação com uma velocidade superior ao comum, ao colocar efectivamente todo o seu conteúdo numa cache e concentrar-se num código limpo, evita muitos dos processos normalmente envolvidos no carregamento de uma página web.
  • A segurança é o segundo tópico defendido pela empresa dada a dissociação do backend e do frontend, obviamente existindo a possibilidade de uma possível falha de segurança na sua aplicação backend. Estes encontram-se separados por uma API e normalmente acabam por ser só dados de leitura. Ao mesmo tempo, está muito menos dependente de uma base de dados, o que minimiza os potenciais problemas que poderiam ocorrer.
  • Como programador, a experiência será muito boa, garante a Jamstack, tendo em conta a flexibilidade, uma vez que este poderá escolher a sua própria tecnologia a usar. Os programadores podem fazer o seu trabalho sem se preocuparem com as limitações de uma certa plataforma ou tecnologia. E com o aumento dos microserviços e APIs reutilizáveis, está a tornar-se muito mais simples reutilizar funcionalidades em múltiplos websites ou aplicações.
  • Finalmente, o uso de Jamstack e o próprio hosting acaba por ser muito barato a nível monetário, vindo até mesmo a ser gratuito dependendo da complexidade da página web.
Figura 4 : Vantagens da Jamstack | Fonte

Contras de usar Jamstack

  • Posto isto, a transição de um modelo tradicional CMS para Jamstack não será fácil ou amigável para muitos. Para developers que já tenham algum conhecimento de várias tecnologias, acredito que seja uma mais valia, mas para editores ou até mesmo comerciantes de conteúdo irá ser uma grande mudança.
  • Uma vez que é preciso servir conteúdo como Markup, os editores terão de ser bastante técnicos para criar e actualizar o conteúdo. Isto pode muitas vezes exigir os editores terem de aprender novas competências e irá atrasar a produção de conteúdos à medida que estes perdem características que já estão habituados vindo de um modelo tradicional. Ao mesmo tempo, estes serão responsáveis pela gestão adequada dos media, o que pode ser um processo aborrecido.
Figura 5 : Desvantagens da Jamstack | Fonte
  • Os websites da Jamstack são ótimos desde que estejamos a construir páginas com texto e imagens. Assim que a página necessitar de características dinâmicas, poderá deparar-se com problemas. Sem ter uma base de dados para processar os seus pedidos, precisará de fazer mais do trabalho pesado com o seu próprio código ou chamadas API. Isto não significa que não seja possível, mas requer mais recursos para alcançar, uma vez que não tem estas características dinâmicas como parte da sua arquitectura.
  • Por fim, durante a minha pesquisa das várias críticas face à Jamstack, reparei várias vezes no mesmo tópico, a dependência de third-party systems. Uma vez que o website depende fortemente de sistemas e APIs de terceiros, a consistência do website irá depender destes. Se algum destes dois falhar, o mesmo acontece com o website (ou partes dele). Isto não é diferente de um website normal em que o servidor vai a baixo, por exemplo, mas com um website Jamstack, é muito limitado o que se pode fazer para resolver o problema se for um problema com fonte nestes serviços exteriores às mãos do programador.

Será Jamstack o futuro e irei eu começar a usar?

A resposta para esta pergunta acaba por depender muito do projeto em questão, mais uma vez, será preciso alguma adaptação de conhecimento para os menos peritos no que toca a níveis de competências técnicas para ser um projeto bem sucedido. Dito isto, por muito mais rápido e seguro que seja trabalhar com Jamstack, será sempre complicado ter de realizar a transição para Jamstack, dificuldades como estas impedem que a escolha de transição seja devidamente clara e justificada.

Lista de algumas tecnologias já implementadas para construir aplicações Jamstack que talvez já conheças:

Tecnologias como Gatsby, NextJS, Netlifly CMS, Contentful, React Static e muitas, mas muitas mais, encontram-se presentes na próprias documentação da Jamstack como geradores de websites disponíveis para começar a implementar. Estas são só cinco exemplos de tecnologias das trezentas e trinta e três possibilidades com que eu já me deparei durante o meu percurso como programador, ou pelo menos faz de conta.

O que é preciso para começar?

Conheçendo algumas das tecnologias predominantes no que toca a implementação de código JavaScript e das mencionadas ulteriormente, ferramentas como React, Vue, Angular, Svelte irão ser a chave principal para a criação do código. Até aqui nada de novo, estas ferramentas são renderizadas diretamente no browser (ou servidor), tornando o processo de construção de interacções ou de servir conteúdos dinâmicos mais natural.

Os geradores mencionados e frameworks web tais como Gatsby, Next.js, Gridsome, Scully, e Sapper estendem esses frameworks fornecendo a capacidade de gerir com mais facilidade o conteúdo que é adicionado aos projectos e renderizar páginas em ficheiros estáticos, maioritariamente HTML.

Figura 6: Tecnologias recomendadas pela Jamstack | Fonte

Posto isto, tendo em conta a vasta rede de templates iniciais que se encontram presentes na web e também a vasta documentação de cada umas destas ferramentas mencionadas, acaba por não ser uma questão de o que é preciso para começar mas sim quando devo começar. E porque não agora?

Referências

For fast and secure sites | Jamstack. (n.d.). Retrieved February 21, 2022, from https://jamstack.org/

WTF is Jamstack? (n.d.). Retrieved February 21, 2022, from https://jamstack.wtf/#what-is-jamstack

What is JAMstack and is it the future of web development? (n.d.). Retrieved February 21, 2022, from https://umbraco.com/knowledge-base/jamstack/

Welcome to the Jamstack | What, Why, and How of Jamstack. (n.d.). Retrieved February 21, 2022, from https://www.netlify.com/jamstack/

The Jamstack in 2021: Why (and How) to Get Started. (n.d.). Retrieved February 21, 2022, from https://snipcart.com/blog/jamstack

What is JAMStack? — YouTube. (n.d.). Retrieved February 21, 2022, from https://www.youtube.com/watch?v=O0sywQnY8sM

--

--