1991年に「World Wide Web（ワールド・ワイド・ウェブ）」が登場した時、ウェブサイトはすべて静的なHTML文書の集合体でした。その後間もなく、先駆的な開発者たちにより、ウェブサーバー上で実行可能なコードづくりが始まりました。データベースシステムからコンテンツを抽出して、ウェブサイトを動的に生成する手法の幕開けです。
CMSが主流になる一方で、静的ウェブサイトが完全に姿を消したわけではありません。それどころか、スピードとセキュリティを重視する人々の間で、静的サイトのコンセプトが注目を集めています。
Kinstaの静的サイトホスティングプラットフォームでは、高速かつ高いセキュリティでサイトを管理することができます。しかも無料でご利用可能です。
今回の記事では、静的サイトとKinstaの舞台裏に迫りながら、これを活用してどのように世界中のエッジサーバーにデプロイできるのかご紹介します。
静的サイトと相性の良いウェブプロジェクト
静的サイトは、あらかじめ構築したHTML、CSS、JavaScript、およびメディアファイルを配信するものです。
KinstaのJavaScript開発者で、Kinstaの静的サイトホスティングプラットフォームの立ち上げを担ったチームのメンバーであるMichael Fullerは次のように語ります。「静的コンテンツを持つことの利点は、高速で効率的であることです。サーバーがデータベースとやり取りしてページを構築するのではなく、事前に作成したファイルをサイト訪問者に送るだけになります」
「静的ファイルをゼロから作ることなく、数多くある静的サイトジェネレーターを利用可能です。これは静的サイトの作成と更新を支援するツールであり、ファイルを実際に機能するサイトに変えることができます」
どのようなプロジェクトが静的サイトとして展開できるのでしょうか？引き続き、Michael Fullerによる説明をご覧ください。
「ログインが必要なページがなく、データベースも不要で、動的コンテンツが必須でない場合には、静的サイトが答えかもしれません。ポートフォリオやマーケティングページに有用で、それどころか、静的サイトジェネレーターなどの構成を使って記事を書くことに抵抗が無ければ、ブログも運用可能です」
また、サイトがサーバーやデータベースに接続されていなければ、セキュリティ侵害の経路が少なくなります。
「より高度なケースでは、混合型のアプローチも可能です。JavaScriptフレームワークを使った静的なサイトを作り、別に管理するサーバーとやり取りすることができます。こうすることで、動的サイトの柔軟性とともに、初期読み込み時間におけるスピードアップというメリットが手に入ります」
Kinstaの静的サイトホスティングの概要
Kinstaの静的サイトホスティングプラットフォームで無料で利用できるものは以下の通りです。
- 1企業アカウントあたり100件の静的サイト
- 1サイトにつき1件の同時ビルド
- 1サイトにつき1GBのビルドイメージサイズ
- 1企業アカウントあたり月間600分のビルド時間
- 1企業アカウントあたり月間100GBの帯域幅
また、KinstaのアプリケーションホスティングおよびWordPress専用マネージドホスティングプラットフォームと同様に、無料のSSL証明書、独自ドメインのサポート、およびサイト管理に便利なAPIもご用意しています。
Kinstaは、静的サイトのコンテンツを構築し、Cloudflareグローバルネットワークの260+に上るデータセンターに配信します。これは、Kinsta CDNとWordPressサイトのエッジキャッシュを支えるものと同じプラットフォームです。
Kinstaで静的サイトをデプロイ
Kinstaで静的サイトをデプロイする最初のステップとして、お好みのGitサービスをMyKinstaのアカウントに接続してください。
Fullerは次のように語ります。「Kinstaは現在、BitBucket、GitHub、GitLabの3つの主要Gitサービスをサポートしています。つまりサイト配信に関わる性能に加えて、バージョン管理などのツールを統合しご利用いただけます」
MyKinstaからGitサービスへのアクセスを承認したら、リポジトリとブランチを選択して静的サイトを追加します。
上記では、「コミットに際し自動でデプロイ」という設定を選択しています。これをオンにすることで、変更がGitホスト上のブランチにプッシュされるたびに、自動でKinstaによりサイトの再デプロイが行われます。
次に、プロジェクトに必要なビルド設定の指定を行います。
Fullerは以下のように説明します。「使用しているジェネレーターとパッケージマネージャを検出できた場合には、それらに使用される標準的な規約が自動で入力されます。例えば、Node.jsを使用したビルドのコマンドは通常、yarn buildまたはnpm run buildで、公開ディレクトリは通常、build、dist、publicまたはoutのようなものになります」
「ビルドプロセスで使用する場合は、独自の環境変数を指定することもできます」
「静的サイトホスティングの初期リリースでは、サイト構築にNode.jsのみをサポートしていますが、将来的にはより多くのプラットフォームに対応できるよう努力しています」とFullerは言います。
とは言え、Node.jsツールに依存しない多くの静的サイトをデプロイすることができます。例として、JekyllサイトとHugoサイト（どちらもNode.jsによるビルドはない）のデプロイ方法をご紹介しています。どちらの場合も、ウェブサイトアセットがKinstaプラットフォーム外でビルドされ、静的サイトとしてデプロイするためにGitリポジトリのフォルダまたはブランチに追加されます。
ビルドステップが全くない静的アセットをデプロイすることもできます。
「ジェネレーターを使用していない場合には、ビルドコマンドを指定する必要はなく、リポジトリにあらかじめ作成されたファイルが含まれているものとみなされます」
デプロイのトリガーに際して、これがサイトのビルドキューに追加されます。
「デプロイが始まると、Google Cloud Platformにビルドインスタンスが作成され、リポジトリからコードがプルされます」とFullerは言います。「ビルドコマンドが指定された場合、指定されたプラットフォーム（今のところNode.js）に基づいたイメージを使用し、そのコマンドを実行します。この後、公開ディレクトリ内のすべてのファイルサイズをチェックし、制限内であることを確認します」
「最後のステップでアップロードを行います。Cloudflare R2のバケットにファイルがプッシュされます」
増分デプロイメントによるスピードの最大化
静的サイトホスティングのデプロイメントプロセスでは、実際に変更の加えられたファイルのみをCloudflareサーバーにアップロードすることで、ビルド時間が最適化されます。
「複数のデプロイメントにわたってアップロード済みファイルを保持するため、以前のバージョンを再デプロイする場合でも、再びアップロードが必要なファイルの数はごくわずかになります。そのために、ファイル名をコンテンツのハッシュ値に変更し、元のパスを記録しています。パスをキー、新しい名前を値として、デプロイメント用のマップファイルに保存します」
「リクエストがサイトに送信されると、既存のデプロイメントのマップを使用して、適切なバージョンのファイルへのルーティングが行われます」
まとめ
Kinstaの静的サイトホスティングプラットフォームは、デプロイメントを容易にするコントロールパネル「MyKinsta」から操作可能です。土台には、世界クラスのエッジサーバーネットワークを採用することで、光速のコンテンツ配信を可能にします。
しかも、すべて無料です。
Kinstaの静的サイトホスティングを素早く利用するには、多くの静的サイトジェネレーターを網羅するそのまま使える活用例をご覧ください。Gitリポジトリをコピーして使うことができます。
Steve Bonisteel is a Technical Editor at Kinsta who began his writing career as a print journalist, chasing ambulances and fire trucks. He has been covering Internet-related technology since the late 1990s.
コメントを残す