はじめに

右も左もわからないプログラミング初心者が書く備忘録です。
膨大な勉強量の中で気になった事をメモしていきます。

間違いや記事を見て良かったことなど
気軽にコメントを残して頂けると活力に繋がりますのでよろしくおねがいします

今回の内容

前回の記事

の続きで、なんでimagesがそんな大容量になってしまったのかという所に焦点を当てていきたいと思います

ちなみに前回の記事に補足として記載しようとしていたのですが、思ったよりも長くなってしまったので記事として投稿させて頂いております。

開発環境

Rails 6.1.3.2
ruby 2.5.1
Docker version 20.10.6

なぜimagesが3.5GBもの大容量になっているのか

結論から言うと、アプリそのものが大容量になっているからでした
今回の原因はwebpackerでした

dockerから一度離れますが、development環境のwebpackerはデフォルトでwebpack-dev-serverが適用されており
app/javascript/packs/*.jsファイルの変更を監視し、変更が必要であるページに転移した際にコンパイルされる
コンパイルされる毎に、public/packs配下にアセットを置きます。

最後に生成されたアセットを app/public/packs/manifest.json が読み取り
最終的に
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
などで読み込み、viewに表示することで処理速度をあげるのだと私は解釈しています

ものすごく簡単に考えるとアセットとはキャッシュのlogで、manifest.jsonは最新のキャッシュを読む
ものだと考えています。
（間違えているようでしたらご指摘頂けると幸いです）

今回の原因はそのアセットでした
アセットは自動で削除されず、コンパイルされる毎にどんどん溜まっていきます（自動で不必要なアセットを削除する方法が見つかりませんでした。。。）

お恥ずかしいかぎりですが、その容量なんと２GB！！！

私の場合、app/public/packs/js　というディレクトリにアセットが配置されていました。
中のファイルは全て消しても、
app/javascript/packs配下のファイルを何でも良い（cssを少し書き換えるなど）ので変更し、
それを必要とするページを開けば新たなアセットが作成されます
（環境により、アセットが作成されない場合があるので、最新のアセットは残しておくようにしましょう！）
そして変更がない限り、最新のアセット１つのみ残ることになります
アセット削除後に何も変更せずにアプリを開くと、読むアセットが無いため悲惨な状態になっていますが落ち着きましょう笑

削除してみる

今回、アプリの容量を見ながら作業したかったので、
画面左上のアップルマーク　→　このMACについて　→　ストレージ　→　管理…　→　書類　→　ファイルブラウザ
を開き、アプリのディレクトリからpublic/packs/jsを見つけ、手動で削除しました
（macbookAir: os mojave ver.10.14.6）

膨大な量になったアセットを一括削除すると

アセット削除前のアプリの容量　→　 2.99GB
アセット削除後のアプリの容量　→　394.7MB

となりました

そしてDockerのimagesは

アセット削除前　→　3.59GB
アセット削除後　→　1.66GB

となりました

副次的に、docker-compose buildの速度も劇的に上昇！

アセット削除前　→　632s
アセット削除後　→　359.7s

最後に

Dockerを導入した時に、気になっていた箇所でしたので
気になったのなら解決するまで頑張ろう！と思えた問題でした

勉強を始めたばかりで知識もなく、拙い文章ですがアウトプットすることで頭の中を整理しつつ、どなたかのお役に立てれば良いなと思い投稿させて頂きました。
最後まで見て頂きありがとうございました！