LiteSpeed CacheとAutoptimizeが併用可能なので併用していましたが、Autoptimizeはキャッシュを定期的に消す必要があったりして、少し不便でした。
そして、LiteSpeed CacheにもCSSやJavaScriptを最適化するオプションは存在します。
ですので、色々考えた結果、LiteSpeed Cacheにあるオプションを設定することでAutoptimizeの機能を代用することにしました。
広告
目次
Autoptimizeの最適化機能のチェックを一旦はずす
代用として設定をあらためてを行うので、機能がバッティングしないよう、最適化のチェックを一旦はずして、いざというときは元に戻せるようにして設定を行います。
あるいは、設定していたオプションをメモだけして、プラグインの管理画面から停止してもいいかもしれません。
LiteSpeed Cacheの設定
LiteSpeed Cacheにおける、CSS/JavaScript最適化の設定は、ダッシュボードの「LiteSpeed Cache」→「設定」における[5]最適化のタブ、及び[6]チューニングから行えます。
デフォルトではこの機能の殆どがONになっていなかったと思います。このあたりは競合しないようにしたのかも？
最適化の設定
LiteSpeedでは、Autoptimizeとは名称も違うものの、CSS/JavaScriptの圧縮・結合が可能です。
また、Autoptimizeにはなかったオプションを選択することもできます。
さて設定方法ですが、この最適化のタブは、問題がないなら全部オンでOKです。
ただ、表示に問題があったり、コードを圧縮化して読みづらくなるのが困る場合は、適宜オン・オフを切り替えます。
私の場合は、HTMLコードを見て色々コーディングをすることがあるので、HTMLコードが読みづらくなりそうなHTML圧縮化のオプションははずしています。
また、テーマで使われているmasonry.jsとJS結合の相性が悪いようなので、JE結合についてはOFFにしました。
チューニングの設定
このタブでは最適化のチューニングが行えます。チューニングといいつつ、キャッシュのチューニングではなく最適化のチューニングという印象。
これらはだいたいデフォルトのとおりでいいと思いますが、問題が起きたときは「CSS結合の優先度」や「JS結合の優先度」をいじってみてください。
私の場合、CSSの適用順序に問題が生じまして、CSS結合の優先度についてはオンにしています。
WordPress文字を削除、については、絵文字を使っているかどうかにかかわってきます。私は特に特殊な文字も使っていないはずなのでオンにしました。
設定後、全てのキャッシュをパージ
最適化にも関係してくるのか、設定後は全てのキャッシュをパージするようプラグイン内にも書かれています。変更が反映されるか確認するためにも、変更を保存したらキャッシュをパージします。
これにて、AutoptimizeのLiteSpeed Cacheでの置き換えが終わりました。
おまけ: PageSpeed InsightsとGtMetrixの評価
最適化した後、PageSpeed InsightsとGtMetrixでスコアを計りました。
PageSpeed Insightsはモバイル/PCどちらも70点越え、GtMetrixはCとEでした。YSlowのほうはまだまだ努力が足りないようです。