【React】コード分割による表示パフォーマンス改善 - Qiita

Create-React-Appのプロジェクトをビルドする際、プロジェクトが大きいとWebpackでバンドルされたファイルも大きくなってしまいます。 バンドルファイルのサイズが大きいと表示パフォーマンスに影響がでてしまい、ReactでSPAを作成した意味が薄れてしまいます。 そんな問題を解決するために、コード分割(Code Splitting)という方法が使われているということを知りました。 今のところ現場で使うことはなさそうなのですが、今後の仕事のために備忘録としてまとめました。 Create-React-Appプロジェクトのビルド Create-React-Appで生成したプロジェクトでビルドを実行すると、buildフォルダにいろんなファイルが出力されます。 publicフォルダの内容がbuildフォルダにコピーされているのですが、build/index.htmlの中身をみると、pub