BootstrapをPurgeCSSで軽量化

Bootstrapは大変便利ですね。ただ、重たいのが気になることもあります。必要なコンポーネントだけ読み込んだとしても各々結構なサイズです。

こんな時お薦めなのが不要なCSSを削除してしまう方法です。代表的なものがPurgeCSS。上の画像は、Start Bootstrapにある無料テーマ「Clean Blog」をPurgeCSSで軽量化した模様です。

styles-orininal.cssがClean BlogのもともとのCSS（Bootstrap 5）で、styles-orininal.min.cssがそれをMinifyしたもの、styles.cssがPurgeCSSでの削除後です。

Minifyして159KB程度だったものが23KB程度になっていますのでかなりの効果だと思います。

本番用にデプロイする際はPurgeCSSでドンと軽量化しておくと良いですね！