ブロックの作成⑤【Create Blockで自作したブロックのデータサイズを縮小】
ワードプレスの公式サポートツールCreate Blockは、PHP、JS、CSSコード、その他、自作するブロックのプラグインに必要なすべてのファイルを自動生成してくれる便利なツールです。
しかしCreate Blockで作成したブロックのデータサイズは、そのままだと非常に膨大なサイズとなっているので、ワードプレスのバックアップを取るときに時間がかかる、など何かと不都合があります。
そこで本記事は、『ブロックがプラグインとして機能する以外のファイル・フォルダは削除して整理してしまおう』という内容で紹介していきます。
実際に作成したブロックのプラグインのデータサイズを確認
記事：ブロックの作成④までで作成したrichtextというブロックを例にとって説明していきます。
richtextは、テキストの入力とテキストの配置調整、文字色・背景色の設定といったシンプル機能のものですが、336MBものデータサイズとなっています。
プラグインrichtextのファイル構成は以下の通りです。
データサイズが表示されていないフォルダのサイズは以下の通りです。
| build | 2.64KB |
| node_modules | 335MB |
| src | 3.37KB |
トータル336MB中、node_modulesが335MBも占めているのがわかります。node_modulesはsrcフォルダ内の各ファイルで使用するmoduleのライブラリなどが凝集されたコードファイル群です。
したがって、srcフォルダ内を編集して再buildするなどプラグインを修正・編集しないのであれば不要なファイルだと言えるでしょう。同様の理由で、srcフォルダやpackage.jsonなども不要です。
以上の理由からこれらプラグインの修正・編集に関係のないファイルを削除してデータサイズを減らすことにします。
ファイルの整理手順
- プラグインフォルダrichtextのバックアップを取っておく
- 不要フォルダ・ファイルを削除する
というように、不要なファイルを削除する前にバックアップを取っておきます。いざというときに修正・編集できるようにするためです。
削除するフォルダとファイル
- node_modulesフォルダ
- srcフォルダ
- package.jsonファイルとpackage-lock.jsonファイル
- editorconfigファイル
- gitignoreファイル
package-lock.jsonは残しておけば、もう一度install作業でnode_modulesなどは元に戻せるという話もありますが、nodeのバージョンなど環境が違えばうまくいかないこともあるので、あっさり消しました。
ファイル削除後のデータサイズ
ファイル削除前336MB ⇒ ファイル削除後6.31KB
これでもプラグインrichtextとしては何も問題なく機能します。これでワードプレスのバックアップもスムーズにできるようになりました。
もしブロックを修正・編集したければ、バックアップしたファイル群から削除したファイル・フォルダをコピペして使えば可能です。
