Angular JSアプリのvendor.jsが2MB、app.jsが720KBの場合、サイズを小さくするにはどうすればよいですか？

Question

私はAngularJS Webアプリケーションを開発中です。私はvendor.jsとapp.jsファイルを作成するためにuglifyとminifyを使用しましたが、それぞれ2MBと720KBという非常に巨大です。私がChrome Devのツールで見たように、ダウンロードにはそれぞれ25秒と14秒かかりましたが、私は100MBPSのインターネット接続に多くの時間を費やしています。私はこれよりはるかにスピードが遅いかもしれない顧客の経験について心配しています。これらのファイルのサイズを圧縮または縮小する方法は何ですか？私は、Angularが最初のページのすべてを必要とするため、vendor.jsを分解できないと考えています。

Answer 1

gzip圧縮とCDN（クラウドフロント、アカマイなど）でファイルを配信するのが最大で最も速いものです。 CDNは通常、物理的にユーザーに近い場所からファイルを配信します（ダウンロードが速くなります）。ほとんどのCDNはgzipを簡単に有効にします。これはおそらくファイルサイズで最大の勝利を得る場所です。

その後、あなたは木の揺れを見ることができます。 webpackのようなjavascriptをバンドルするために何かを使用していない場合は、多くのリファクタリングが必要になることがあります。しかし、ツリーを揺さぶると、app.jsファイルとvendor.jsファイルから使用していないコードはすべて除外されます。

最後に、遅延ロードを見ることができます。こうすることで、必要な最小限のコードでアプリをブートストラップすることができ、ユーザーはアプリのさまざまな部分に移動して、必要なものをダウンロードすることができます。 ocLazyLoadは、あなたが1.xを使用している場合に人気のある傾向があります。https://oclazyload.readme.io/