さて終わっちゃったお盆休み。
一泊だけ旅行にいきましたが、基本的に家にいることが多かった2017年の夏休みでした。
せっかくの機会なので、ブログをしっかりさせる作業をいろいろやってみましたよ。
「おめー、こんなんでしっかりしてるなんて笑わせんなよ！」
と言わないで・・・
ワードプレスの高速化とかSSL化とかに取り組んでみた。【前編】
まずは現状把握
サイトのスピードを測るのは「PageSpeed Insights」と「GTmetrix」とうのが有名らしい。
まずは現状を把握するべく、それぞれで数回やってみました。
PageSpeed Insightsでは3回やってみて、モバイル＝76、63、67点。パソコンは88、72、78点」という結果。
一方のGTmetrixでは、ページスピードスコア＝C(72%)、B(81%)、C(79%)。YSlowスコアっていうのは、E(57%)、D(63%)、D(62%)といったところ。
バラつきははしょうがないみたいですね。まあざっくりとですがあんまりイケていないっぽいことが判明しました。
一例。
なんとなくの感じですが、wpxレンタルサーバーの時よりも、mixhostにした方が動きが重く感じます。
特にワードプレスにてちょっと修正した後の更新時とかに顕著に感じています。
さてここからどのくらい高速化できるんでしょうか。楽しみです。
Simplicityのバージョンアップ
使わせていただいているワードプレスのテーマ「Simplicity」。今まではバージョン1.9.3でした。
これはかなり古く、最近のAMPだとかSSLだとかに対応できていない模様。
そこでまずはテーマのバージョンアップから行うことにしました。今の最新は2.6.0。
Simplicityは作者のわいひらさんが詳しく説明していただいているのでホント助かります。また使っている人も多いので情報も豊富。
んで、やったことは以下の説明ページ通りの作業です。
まずは「2」をインストールした後、「1」の子テーマを「2」用に変更しました。修正した子テーマをFTPソフトでアップして、有効化したらとりあえずOK。
次いで、以下のページを参考にカスタマイザーの設定の修正です。いろいろな設定は引き継がないということなので、これも説明にあるとおり、横に並べて比較しつつコピペしていきました。
途中途中でPCとスマホでチェックしながら進めていき、テーマのバージョンアップは一応無事クリアです。ふぅ。
「AMP」に対応してみた
だいたいAMPがなんだか全く分かっていません。アクセレートモバイルページ？なので多分スマホから見た時、速くなるってことでしょう。
グーグルから「AMP対応するといいよ」という案内がかなり前からきていたこと、そして新しいSimplicity2では設定できるらしいことから、いっちょやってみることにしました。
やるといってもカスタマイザーにてチェックを入れるだけです。これで「AMP」用のページが作成されるはず。
「AMP」についてはもう少し勉強する必要があるなあ。。あとで考えます。
LightSpeedCacheを入れてみた
さて次。ここからは以下の「もふもふ安心毛布」さんのブログを参考にしまくりです。なぜならサーバーとワードプレステーマが同じだから。
https://anshinmoufu03.tokyo/fastspeedblog
そこでまずは「LiteSpeed Cache」なるプラグインを入れてみることにしました。
なんか説明は良く理解できませんが、現状日本ではmixhostでしか使えないらしく、mixhost自身もこのプラグインの使用を推奨してます。
https://support.mixhost.jp/65
以下引用。
LiteSpeed Cacheとは、LiteSpeed Webサーバーで利用できるキャッシュ機能です。
非常に高速かつ高性能で、キャッシュを有効にする事により、導入前と比較して数十倍〜数百倍程度、圧倒的に高速化する事が可能です。
また、サーバーの負荷が低くなる為、アクセス集中時にも安定してご利用いただけるようになります。
数十倍〜数百倍程度、圧倒的に高速化とな！ 期待しちゃうなあ。
まあ本家が推奨しているんだから使わない手はないでしょう。早速、説明サイトの通りに導入してみました。
設定はモバイルでどうこう・・・のところが迷いましたが、とりあえずみんな「enable」に。
さあこれであっとい間に数十倍の速さか！ と思いきや、あんまり変化は感じられず。あれ？
まあ他にダメな部分がまだまだあるんでしょう。めげずに次の対策です。
ブログをSSL化してみた
次は大物である「常時SSL化」に挑みました。
これまでの知識だと
「http://」を「https://」に変更すること
信頼性？が上がるのでグーグルの評価が良くなるらしいこと
アドレス自体が変わるので、設定やリンクの貼り替えが必要になりそうなこと
という感じで、なんか面倒臭そうなので、放置していました。
しかし「https」は速度にも影響があるらしいことが判明。せっかく時間があるこの機会にやってみることにしました。
参考にしたのは以下の説明記事。
https://support.mixhost.jp/348
やったことは上記の参考記事どおり。mixhostに移動したことで、既にhttpsのページ？も作成されていたのでした。
ワードプレスの一般→設定で、2ヶ所変更し、プラグイン「Really Simple SSL」の導入だけです。
このプラグインは「http」を自動で「https」と読んでくれるらしいです。ですが、最初から「s」がついていた方がそりゃいいでしょう。
あとで過去記事の画像を見直していこうと考えているので、リンクの「s」についてもコツコツと直していこうと思います。
その後、グーグルアナリティクスとサーチコンソールの変更は必要とのことで再び検索し参考記事を発見。
再び、書いてあるとおりに設定していきました。先人はすごいです。ありがとうございます。
カテゴリとタグの再設定
これは高速化には関係ないですが、先日のサーバー引越し（wpxレンタルサーバーからmixhost）を行ったら、記事のカテゴリとタグの設定がかなり消えてしまいました。
まあなんか俺がやらかしたんだと思いますが、この機会に改めてカテゴリとタグを設定しなおしてみました。
しかしなんともまあ雑多なブログですわ。アキレス腱断裂から3年経ったんだなあと月日の流れを感じたり。3年目の記事も書かないとね。
ワードプレスの高速化とかSSL化とか前編のまとめ
少し長くなっちゃったので、前編はここまでとします。
この段階で速度のチェックをしてみました。今度はhttpsの方で。同じように3回ずつやってみました。
PageSpeed Insightsでは「モバイル＝74、68、74点。パソコンは84、87、88点」。対策前より少し良くなった感があります。まあ時間帯とかの影響もあるんでしょうけど。
一方のGTmetrix。ページスピードスコア＝B(86%)、B(83%)、B(82%)。YSlowスコアが、D(61%)、D(59%)、D(60%)でした。ページスピードの方は良くなったけど、YSlowの方は若干下がったような。。まあいいや。
PageSpeed Insightsに指摘されているのが以下。
-
スクロールせずに見えるコンテンツのレンダリングをブロックしている JavaScript/CSS を排除する
画像を最適化する
ブラウザのキャッシュを活用する
CSS を縮小する
JavaScript を縮小する
後編ももふもふ安心毛布さんの情報を参考に対策してみたいと思います。しかし成績を上げていく作業ってのはなかなか楽しいですな。
後編書きました。以下からどうぞ。