Что такое Jamstack?

Термин Jamstack был придуман Мэттом Бильманном, CEO хостинг-платформы Netlify, и представлен на Smashing Conf 2016, на которой он представил новый архитектурный подход к разработке контент-ориентированных сайтов. Полную запись выступления можно посмотреть по ссылке , а пока разберёмся в том, что предложил Мэтт.

Jamstack образован от аббревиатуры JAM — клиентский JavaScript, переиспользуемые API и prebuild Markup — предварительно созданная на сервере разметка. Сайты, реализованные на Jamstack, должны заменить собой сайты, построенные на классических CMS типа WordPress, Joomla, Drupal и т.д.

Давайте рассмотрим каждый компонент Jamstack отдельно:

JavaScript. Язык, на котором строится динамическая функциональность на сайте. Jamstack не ограничивает разработчиков в выборе клиентских инструментов, и хоть основная идея построена вокруг «оживления» (гидратации) клиентскими скриптами заранее сгенерированной разметки, не существует запрета на использование встраиваемых полностью динамических компонентов на JavaScript. Наиболее широко данный принцип представлен в так называемой архитектуре «островов» , в которой статические и динамические части приложения существуют отдельно и могут быть написаны на каких угодно UI-библиотеках в пределах одной страницы.

API. Данные на сайте могут быть не только жёстко заданы в разметке, но и подгружаться из внешних источников, особенно, если эти данные должны меняться со временем. В Jamstack предусмотрен слой с API, обычно представленный технологией Headless CMS — системой управления контентом, которая является чистым бэкендом и не генерирует разметку, в отличие от традиционных CMS. Если в стандартном подходе данные в приложении подгружаются с помощью AJAX-запросов, в Jamstack запросы к API выполняются на сервере на этапе сборки сайта.

Markup. Сайты, реализованные в рамках подхода Jamstack — это обычные статические HTML-страницы, сгенерированные на сервере в процессе сборки. Для задания разметки и стилей, подключения к внешним API, написания клиентской JavaScript-логики, а также управления процессом сборки используются Генераторы Статических Сайтов (Static Site Generators, SSG). В качестве инструментов расширения возможностей разметки HTML-документов в SSG используются шаблонизаторы, позволяющие писать переиспользуемые компоненты.

Основные преимущества подхода Jamstack над традиционным подходом с использованием CMS:

  • скорость загрузки и работы предсгенерированных страниц в разы быстрее, чем у страниц, которые формируются на стороне CMS по запросу пользователя;
  • безопасность таких сайтов повышается критически, так как слой базы данных просто исключается в подходе Jamstack, а на сервере лежат только статические HTML-файлы и ресурсы сайта;
  • удобство хостинга и дешевизна масштабирования вырастает при разработке на Jamstack, ведь разворачивать и хранить обычные HTML-файлы проще, чем тяжеловесные сервисы на LAMP, MERN или другом стеке, а также в рамках традиционых CMS;
  • появляется возможность использовать самые современные инструменты для фронтенд-разработки, да и в целом стек придуман для того, чтобы его могли поддерживать чисто фронтовые команды, под это подстраиваются и сами инструменты, такие как Headless CMS и SSG-фреймворки;
  • бэкенд и фронтенд освобождаются от взаимной связанности, которая заложена в традиционных CMS — UI и API разрабатываются отдельно.

Важно написать и о недостатках подхода:

  • высокий порог входа, ведь Jamstack предполагает наличие хорошего знания JavaScript; по идее с разработкой может справиться один сильный фронтенд-разработчик, но ему придётся самостоятельно настраивать и согласовывать весь спектр инструментария;
  • Jamstack подходит только для простых контенто-ориентированных сайтов и простых веб-приложений (маркетинговых сайтов, посадочных страниц, блогов, портфолио, сайты с документацией) без большого количества клиентско-серверной динамической логики;
  • низкая скорость сборки для сайтов с огромным количеством страниц, для таких сайтов традиционные CMS с генерацией контента по требованию подойдут лучше;
  • относительно незрелая экосистема — если стандартные CMS существуют давно и предоставляют зрелые устоявшиеся инструменты для решения типовых задач разработки, то экосистема Jamstack относительно свежая и не завязана на использовании одного конкретного решения, так что не всегда возможно положиться на стабильность тех или иных технологий.

Несмотря на недостатки, Jamstack становится всё более и более популярным подходом для создания классических статических веб-сайтов, ориентированных на работу с контентом. Сообщество Jamstack активно развивается и на данный момент способно предложить достаточно много проработанных решений для работы с API или генерации статических страниц.

Углубиться в исследование Jamstack можно по ссылкам:

https://bejamas.io/blog/jamstack

https://snipcart.com/blog/jamstack


Приглашаю вас подписаться на мой телеграм-канал: https://t.me/alexgriss , в котором я пишу о фронтенд-разработке, публикую полезные материалы, делюсь своим профессиональным мнением и рассматриваю темы, важные для карьеры разработчика.