多くの小さなファイルと少ない大きなファイル：バンドルサイズとビルド時間への影響
私は小さなファイルを執拗に支持してきました。私は、ファイルごとに1つの関数のエクスポート、すべてが1つのビューで機能する関数、およびUIコンポーネントを可能な限り分割することを好みます（これが、Reactが大好きな理由です）。
これには、コードの保守と明快さの観点（IMO）から多くの利点がありますが、バンドル全体のサイズとコンパイル時間への影響を評価したことはありません（Webpackはここでタグ付けされていますが、他のビルドツールも適用可能です）。私の想定では、小さいファイルの利点は、バンドルのサイズと速度のわずかな違いまたはごくわずかな違いに見合うだけの価値があるというものでした。しかし、比較のために既存のアプリを大量にリファクタリングする必要なく、いくつかのデータでこの仮定をバックアップまたは反論したいと思います。
それでは、バンドルサイズとコンパイル時間に対する、多数の小さなファイルと少数の大きなファイルの影響は何ですか？
ここには実際には2つの別個の、しかし密接に関連した質問があります。 1つはバンドルサイズに関する質問で、2つ目はバンドルの構築にかかる時間です。
バンドルサイズ。これにより、JavaScriptファイルの最終的なサイズはあまり関係がないと考えられます。ほとんどのトランスパイラーには、ソースコードを縮小または難読化するオプションがあり、ファイルサイズが小さくなります。ほとんどのWebサーバーは、CSSやJavaScriptなどの静的テキストアセットを圧縮ファイルとして配信するように構成する必要があります。これにより、ファイルサイズがさらに削減されます。バンドルサイズに関する懸念は、時期尚早の最適化である可能性があります。
これらのファイルをトランスパイルするのにかかる時間の長さについての2番目の懸念：どのくらいの時間本当にかかりますか？五秒？ 10秒？どれくらい長いですか？さらに良いことに、開発者やビルドサーバーのSSDドライブを提供する場合と比較して、ビルドプロセスをマイクロ最適化するためにエンジニアに支払う費用はいくらですか？これは時期尚早の最適化の別のケースです。あなたの時間と会社のお金は他の場所で使うほうがいいです。
これはすべてパフォーマンスに関するものであり、パフォーマンスの問題に対する唯一の解決策はそれらを測定することです。 10回のうち9回は、パフォーマンスの違いは開発時間に値しません。