黒ブタBLOG

【改善】mod_pagespeedでCSSの反映が遅い!

どーも、こんにちは黒ブタです。

この度、作成したニュースサイトで「サイトの表示速度が遅い(重い)」という問題に直面し、色々探っていった結果、
Googleさんが提供しているmod_pagespeedというモジュールを使うことになりました。
これを使うと、サイトの表示スピードが格段に上がったのですが、デメリットとしてCSSファイルの更新が格段に落ちる問題に直面した。(実際には更新されてるが、キャッシュが優先される為、更新の確認が遅れる)
悪い時だと5、6分更新したCSSが反映されないので、仕事の効率がかなり悪くなる。
しかも、F5や更新ボタンを押しても反映されないからタチが悪い!

CSSの反映確かめる為だけにモジュールを排除するわけにもいかなし、どうにかして一時的に無効化出来ないものかと悩んでいたところ、いい方法を見つけました。

キャッシュが優先されるなら、キャッシュを削除すればいい

ということで、mod_pagespeedを有効化させたままキャッシュの削除のみをする方法を探してきました。
ターミナルを開き、サーバーにアクセス。
サーバーアクセス方法がわからない方は

Macターミナル(コマンドプロンプト) sshサーバー接続、データベース接続

で確認してください。

サーバーにアクセスしたら、mod_pagespeedが本当にあるか確認。

find / -name mod_pagespeed

でEnter。

ファイルが見つかったらmod_pagespeedが適用されてるので、CSSの反映が遅い原因はこれである可能性が高い。
ということで、CSSをアップしたら

root権限で入っていた場合

touch /var/cache/mod_pagespeed/cache.flush

そうではなければ

sudo touch /var/cache/mod_pagespeed/cache.flush

と入力し、Enter。
これでキャッシュが削除されるので、UPしたCSSが即座に反映されます。
ただし、問題点としてはUPしたCSSがキャッシュされるので、次にCSSをUPしても、前のものが残ってるので毎回上記のコマンドでキャッシュを削除する必要があるのが難点。
でもまぁ、何分も反映されなくてイライラするのが、1コピペ数秒で解決できるので、そこは我慢することにする。
また、CSSをいじってる時は常に無効化出来るようなものを見つけたら追記したいと思う。