最新のウェブ アプリケーションのバンドル
最新のウェブ アプリケーションでは、多くの場合、バンドル ツールを使用して、最適化と圧縮を行い、ユーザーが短時間でダウンロードできるファイル(スクリプト、スタイルシートなど)の本番環境用の「バンドル」を作成します。webpack によるウェブ パフォーマンスの最適化では、webpack を使用してサイトリソースを効果的に最適化する方法について説明します。これにより、ユーザーがサイトをよりすばやく読み込んで操作できるようになります。

webpack は、現在使用されている最も人気のあるバンドルツールの 1 つです。最新のコードを最適化する機能を利用して、スクリプトを重要な部分と重要でない部分にコード分割し、未使用のコードを取り除くことで、ネットワーク コストと処理コストを最小限に抑えることができます。

Susie Lu による Bundle Buddy のコード分割から着想
まず、最新のアプリで最も費用のかかるリソースの一つである JavaScript の最適化から見ていきましょう。