WEB開発をしていれば耳にするSPA, SSR, SSGという単語。
私もなんとなくは理解しているのですが、突っ込んで聞かれたら答えられないと思い今回記事にします。
SPAとはSingle Page Applicationの略です。
ざっくりですが、SPAは<div id="app"></div>
こんなほぼ空と言って良いほどのHTMLタグだけでできているファイルが本体です。
これだけだと何も表示されないのでJavaScriptでAPIからのレスポンスを受信してDOMでこのタグを更新してHTML要素を作っていくのが基本です。
最初にサーバーに問い合わせた時に単一(シングル)のページを受け取るのでSingle Page Applicationです。
特徴は、
SSRはServer Side Renderingの略です。英語読めばそのままで、サーバーでレンダリング(HTMLなど生成)します。
SPAはクライアント(ユーザーのブラウザ)からAPIを叩いてページを表示するのに必要なデータを取得してDOMでHTML要素を生成していましたが、こちらはサーバーでAPIを叩いてHTMLを作ってユーザーのブラウザに届けます。（2回目以降はSPAと同じように処理する場合あり）
特徴は
SSGはStatic Site Generatorの略です。静的サイトを生成するということです。アプリのビルドした時にHTMLファイルを生成。ページを表示するときはこのビルドした時にすでに生成した静的なファイルを返却するだけ。というわけです。
つまり高速にSEOも良くサーバーの負荷も軽いけども、毎回同じページであるということです。
特徴
ということでブログや変更する必要の少ないLPなどでしようすることになると思います。
私はフロントエンドが専門ではないので曖昧にしていのですが、今回調べてみて知識が広がりました。
ということで今回は以上になります。
入会申込
ログイン
