Jamstack とは？ - 従来型ウェブサイトとの違い
Jamstack は、クラウドネイティブな新しいウェブサイトのアーキテクチャです。
JavaScript フレームワーク、静的サイトジェネレータ、ヘッドレス CMS、API に Git ワークフローを組み合わせ、事前にビルドしたコンテンツを CDN（Content Delivery Network）や ADN（Application Delivery Network）から配信することで、ハイパフォーマンスなウェブサイトと、サーバレスによる高セキュリティ、柔軟なスケーラビリティとポータビリティを実現します。
Jamstack という名称は、「Javascript」、「API」、「Markup（静的に生成された HTML）」を組み合わせたもので、元々は 2015 年に Netlify 社の CEO である Mathias Biilmann 氏が提唱した造語です。
従来型のウェブサイトにおいて、所謂「動的サイト」と呼ばれるものは、ブラウザがウェブページを要求すると、サーバに設置されたプログラムによってデータベースからリクエストに応じたデータを取得し、ウェブページの形に生成して送り返すというのが基本的な仕組みです。例えば WordPress などはサーバに設置された PHP プログラムがこの動作を行っています。
もちろん、同じ CMS（コンテンツ・マネジメント・システム）でも、Movable Type のように、プログラムがデータベースからデータを取得し、事前に静的な HTML としてサーバ上に書き出しておくことで、ブラウザからのリクエストに対してはその都度プログラムが介在しない仕組みのものもありますし、小規模なウェブサイトなどでは、CMS やデータベースを使用せず、静的な HTML をローカル環境で生成した後に、ウェブサーバにアップロードすることでウェブサイトの運用をされているケースもありますが、この場合でもウェブサーバを何らかの形で運用し、そのサーバからコンテンツを配信していることになります。
このような従来型ウェブサイトの構成で課題になるのが、特に大量のアクセスがあるウェブサイトにおいて、プログラムの動作速度がウェブページの表示速度におけるボトルネックになってしまう場合や、その負荷を処理するために、サーバやインフラ関連に対する投資が必要になります。
また、サーバの冗長化やロードバランサーによる負荷分散など、ウェブサイトのアクセスが大きくなるほどにその複雑性は上がり、その部分の運用や保守に多くのリソースやコストを割かなければならなくなる場合もあります。
加えて、動的生成のウェブサイトにおいては、ウェブページのデザインや機能が使用しているプログラムと密接に関連するため、継続したデザインの変更や最適化に際して、プログラム側の改修も必要になり開発速度が低下したり、リソースの確保が難しくなる場合があります。これは Movable Type のような静的に HTML を生成する CMS においても同様で、書き出されるデザインは、Movable Type テンプレートという形で HTML 内に CMS 独自の「テンプレートタグ」が混在する状態でデータベースに保存されることから、専門的な知識を持った開発者でないと改修が難しい場合もあります。
この CMS やプログラムといったサーバサイドの仕組みと、実際にウェブサイト利用者が閲覧する HTML が完全に分離されていないという特性が、場合によってはメンテナンス性や拡張性の足かせになるといった弊害も生まれます。
一方で、Jamstack 構成のウェブサイトでは、ウェブページを書き出すためのデザインテンプレートを持たず、コンテンツデータの管理に特化したヘッドレス CMS を使用することや、WordPress や Movable Type のようなインストール型 CMS を使用する場合でも、デザインテンプレートを使用せず、Data API の使用や JSON 形式で必要なデータを静的に書き出すことでヘッドレス CMS のような使い方をするため、HTML とデータの完全な分離が可能になります。
また、静的サイトジェネレータを使用して事前にウェブサイト全体をビルドするため、ウェブサイトのデータはすべて CDN 経由で配信可能になります。これはつまり、サーバレスでのウェブサイト配信が可能になるということで、急激なアクセス数増加など、負荷に対するスケーラビリティが大きく向上するだけでなく、そのために必要なサーバやインフラ関連の運用・保守コストを大幅に削減可能になります。
さらに、SaaS 形式のヘッドレス CMS を利用する場合は、WordPress や Movable Type など CMS を自前で管理、運用する場合につきものの、セキュリティ関連の施策やアップデート作業なども不要になるため、セキュリティ面でもメリットがあります。
特に、企業ブログで情報発信を積極的にされている場合や、メディアサイトを運用されている場合などは、この Jamstack 構成のウェブサイトとの相性はとてもよく、ハイパフォーマンスで SEO 的にも有利なウェブサイトを柔軟に開発することが可能であることから、そのようなウェブサイトを新規立ち上げ、あるいはリニューアルしたいとお考えの方々にお薦めします。
なぜ Jamstack なのか - Jamstack で得られるメリット
Jamstack はサーバレス、CDN からの高速配信によるハイパフォーマンス、高いセキュリティ、柔軟なスケーラビリティとポータビリティをウェブサイトにもたらします。
パフォーマンスの向上
ウェブページの読み込み速度は、UX、SEO、コンバージョン等に大きく影響します。Jamstack では静的に生成したコンテンツを、CDN から配信するため、高いパフォーマンスを発揮します。また、アクセス集中などによるサーバ負荷に対しても堅牢です。
高いセキュリティ
Jamstack では、事前に静的な HTML を生成することで、読み取り専用のコンテンツのみを配信することが可能になるため、高いセキュリティを実現します。また、サーバレスで運用可能なため、ウェブサーバのセキュリティ等に気を使うこともありません。
容易なスケーリング
Jamstack 構成のウェブサイトでは、すべてのコンテンツが CDN にキャッシュされます。よりシンプルなデプロイメントと急激な負荷変動に対する冗長性を、複雑なサーバ管理、インフラ整備やパフォーマンスチューニングなしに実現します。
メンテナンス性
ヘッドレス CMS 等によるコンテンツデータの管理、そのデータを取得するための API と、HTML 等、UI 部分を完全に分離できるため、デザインやサイト構成の変更、新機能の追加等がシステムやサーバの都合に左右されず、高いメンテナンス性を確保できます。
柔軟なポータビリティ
Jamstack 構成のウェブサイトでは、すべてのコンテンツが CDN から配信されます。つまり、サーバレスでウェブサイトを運用できるということは、ホスティングサービスを柔軟に選択可能ということです。インフラストラクチャのベンダーロックインとは無縁です。
よりよい開発体験
Jamstack に適した JavaScript フレームワーク、静的サイトジェネレータ、ヘッドレス CMS、そして CDN や ADN が数多く開発され、広く普及していることで、スピーディで確実な開発が可能になります。
バーンワークスの Jamstack 開発
バーンワークスは Jamstack を積極的に採用することで、高パフォーマンス、高セキュリティ、ポータビリティに優れ、かつスケールしやすいウェブサイトの構築を実現すると共に、長年培った Web アクセシビリティの知見を活かし、ハイパフォーマンス、かつアクセシビリティに優れた Web サイトの構築を提供いたします。
