enter178 https://blog.hatena.ne.jp/enter178/ freee Developers Hub https://developers.freee.co.jp/ 中部オフィス 技術 こんにちは！ 中部オフィスでエンジニアをやっているichienです。 5月に入社してfreeeプロジェクト管理の開発を担当していました。今回はfreeeプロジェクト管理のJS(JavaScript)バンドルサイズを削減した話を紹介します。 改善前はバンドルしたJSファイルが5MB以上に肥大化しておりダウンロードに数秒かかっていました。 その分、ファーストビューの表示もその分遅くなり、ユーザ体験に課題がありました。 今回は次の3つの施策を実施して、5MB→1.7MBまで削減し、ダウンロード時間も70%短縮できた話をします。 gzip圧縮の適応 webpack-bundle-analyzerで現状… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fdevelopers.freee.co.jp%2Fentry%2Freduced-javascript-bundle-size" title="freeeプロジェクト管理でJavaScriptバンドルサイズ削減に取り組んだ話 - freee Developers Hub" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/e/enter178/20210828/20210828105015.png Hatena Blog https://hatena.blog 2021-09-02 09:00:00 rich https://developers.freee.co.jp/entry/reduced-javascript-bundle-size 1.0 100%