ベストプラクティスを求めて

現段階ではメモ書きなので順番はバラバラ

Web のモジュールが複雑化すると、ファイルの大量のロードが必要となってくる。

これを避けるためには2つの方法がある。

ブラウザのキャッシュを活用する。

初回遅いのはどうしようもない。

個別にダウンロードされるため、個別ファイルの更新に強い。

パックされたファイルのロードを活用する。

更新の度にパックされたファイルをダウンロードするため、個別ファイルの更新では遅い。

ES6 では export, import が正式に採用された。これでモジュール化を単純にすることができる。地獄のような環境別のモジュール対応を書く必要がない。

開発環境のディレクトリ構成と配置先のディレクトリ構成とは異なる。

少なくとも、開発環境のまま配置先にあるのは望ましくない。

外部の第三者からは、こちらが見せたい物だけが見えるべきである。

開発環境のディレクトリ構成

配置先のディレクトリ構成

どういうディレクトリ構成が理想的か?

完全フラット

人間による管理が困難なため、あり得ない。

1つのディレクトリに大量のファイルが入るとパフォーマンスがどんどん悪くなる。

ファイルシステムのエントリは辞書型ではなくシーケンシャル検索になっている。

これは1ディレクトリに1000件程度しか入っていないという見込みと、大量のディレクトリがあるために、辞書を保持(再構築)するコストよりシーケンシャルアクセスした方が得なため。

リソース種別ごと(画像、音声、拡張子別など)

たぶん Bad idea.

ただし、大量のリソースがある場合は意味があるかもしれない。

共有リソースは同じ場所にあるのが望ましい。(エントリ数の爆発を避けるため、先頭1～2文字で分ける?)

機能ごと

おそらくこれが正解

なぜディレクトリを作る必要があるのか?

関係ある物は同じ場所にまとまっていて欲しい

真に重要なのは関係性