◆ 重いと思ったら react-scripts
◆ グラフにすると……

フォルダを整理していて使ってないのを消したり 別の HDD に移したりしていると 異常に時間がかかるものがありました
何が原因だろうと調べると node_modules です
node_modules はかなり重くなるし 仕方ないかなーと思ってましたが それでも異常と言っていいくらいに遅いです
Windows の削除ダイアログでは残りファイル数が減ったと思えば増えたりしてますし
そんなにいっぱいパッケージを入れた覚えがないところでも時間かかってるなぁと思ってもう少し調べると react-script が原因でした

依存関係グラフ

npm の依存関係や全体サイズは package phobia や bundle phobia で見れますが 今回は依存パッケージのグラフを見たいのでグラフで見れるサービスを使います

http://npm.broofa.com

まずはシンプルなパッケージで試してみます
lit-element は lit-html のみに依存していて このサイトで表示するとこうなります

dep-graph-lit-element


少し多めの koa を見るとこうです

dep-graph-koa


シンプルといいつつけっこう依存パッケージがありますね

では react-scripts を見てみましょう

dep-graph-react-scripts

見えないですね……
クリックすると大きめの画像になりますが それでも各パッケージの名前は読めないくらいです
この読めないサイズでも 1431x6529 です
パッケージ名が読めるくらいのサイズにすると ファイルサイズが数十 MB もありアップロードできなくて仕方なくリサイズしました

詳しく見たい場合はこのサイトで直接見てみてください

http://npm.broofa.com/?q=react-scripts