Web・フロントエンド・バックエンド– category –
-
Partial Hydration — 必要部分だけJS化する中間アプローチ
Partial Hydration（部分的ハイドレーション）は、SSR/SSGで返した静的HTMLのうち、ページ全体ではなく一部のコンポーネントだけをHydrateしてインタラクティブ化する技法の総称です。従来のHydrationが「ページの全コンポーネントをまとめて起こす」のに... -
Islands Architecture — 静的の海に対話要素を点在させる設計
Islands Architecture（アイランズアーキテクチャ）は、ページ全体は静的HTMLとして配信し、対話が必要な部分だけを「島（Island）」と呼ばれる独立コンポーネントに切り出して、それぞれが個別にJavaScriptで動くよう設計するフロントエンド構成です。命... -
Hydration — サーバ生成HTMLにJSの息吹を吹き込む処理
Hydration（ハイドレーション）は、SSRやSSGによってサーバ側で生成された静的HTMLに対し、クライアント側でJavaScriptを実行してイベントハンドラや状態管理を後付けし、ボタン・フォーム・モーダルなどをインタラクティブに動作させる処理を指します。Re... -
ISR — 静的ページを必要なときだけ再生成する仕組み
ISR（Incremental Static Regeneration）は、SSGの拡張として登場したレンダリング方式で、事前にビルドした静的HTMLをベースに、一定時間ごと、あるいはオンデマンドの指示でページを再生成する仕組みです。2020年7月公開のNext.js 9.5でVercelが導入し、... -
SSG — ビルド時に静的HTMLを生成する高速配信方式
SSG（Static Site Generation）は、ソースコードとコンテンツからビルド時にあらかじめ静的なHTMLファイル群を生成し、CDN経由でそのまま配信するレンダリング方式です。2008年にTom Preston-Werner氏が公開したJekyllが起点で、Hugo（2013年Steve Francia... -
MPA — リクエストごとにHTMLを返す伝統的Web形態
MPA（Multi-Page Application）は、リンクをクリックするたびに新しいリクエストがサーバへ飛び、サーバ側でレンダリングされた完成HTMLでブラウザのページ全体が置き換わる伝統的なWebアプリ形態です。1990年代のCGIから始まり、PHP・Perl・Java Servlet... -
SPA — 単一HTMLで画面遷移を完結させるアプリ形態
SPA（Single-Page Application）は、最初に1枚のHTMLを読み込んだあと、画面遷移をフルリロードではなくJavaScriptによるURL書き換えとDOM差し替えで処理するWebアプリケーションの形態です。2010年に登場したBackbone.jsが嚆矢で、AngularJSやEmber.jsを... -
CSR — ブラウザがDOMを組み立てる描画方式
CSR（Client-Side Rendering）は、サーバが返すのは最小限の空HTMLとJavaScriptバンドルだけで、実際の画面はブラウザ側でJavaScriptが実行されてDOMが構築される描画方式です。AngularJS（2010年Google）、Backbone.js（同年Jeremy Ashkenas氏）、Ember.j... -
SSR — サーバ側でHTMLを組み立てて返す描画方式
SSR（Server-Side Rendering）は、ユーザーの要求を受けたサーバがテンプレートとデータからHTML文字列を組み立て、完成した画面をブラウザへ返す描画方式です。PHPやRuby on Railsなど従来のWebアプリでは長らく当たり前の手法でしたが、JavaScriptフレー... -
WebXRとは? ブラウザだけでXR体験を届けるW3C仕様の現在地
WebXR Device APIは、WebブラウザからAR・VRデバイスへアクセスするためのJavaScript APIで、W3CのImmersive Web Working Groupが策定しています。2018年に従来のWebVR APIを置き換える形で提案され、2020年代に入りChromeやEdge、Meta Quest BrowserなどC...
