Webpack と CDN の比較

投稿日: 2021年 1月 31日

Rails で web サイトを作成しようと、bootstrap などのツール(ライブラリ)を使おうとするときに、
CDN で必要な css や javascript をダウンロードする方法と、
Webpack を利用して、rails が使用する静的コンテンツを一つの javascript にまとめる方法があるかと思います。

両者のメリット・デメリット

  • CDN を使うメリット

    • 手軽にライブラリや静的コンテンツを導入できる。
      • test
  • CDN を使うデメリット

    • 自前で CDN サーバーを用意する場合、手軽じゃない
    • 第三者の CDN を利用する場合、CDN を提供しているサーバーが停止すると、CDN 利用側が必要なリソースが使えなくなる。
    • 多数の CDN を使うと、その分ブラウザがたくさんリクエストしないと行けない。
      • HTTP1.1 だと並列に行えるリクエスト上限に引っかかって、ページの読み込み完了までに時間がかかる。
      • (2回目以降のページアクセスは、ブラウザのキャッシュが使用されるので、次回のページアクセスでは、このデメリットはなくなる。)
  • Webpack を使うメリット

    • web サイトの一部なので、サービスのコントロールができる
    • 複数の静的コンテンツを一つのjavascriptファイルにコンパイルされるため、HTTPリクエストの回数を減らせる
  • Webpack を使うデメリット

    • セットアップに知識が必要
  • 参考: Getting Started | webpack

個人のブログで bootstrap 使う文には、cdn を使ってもいいかなって感じでしょうか。

プログラミングに関するオススメ書籍