2024
当サイトはPukiwiki 1.5.4を使用していますが、主にpukiwiki高速化・軽量化のための微修正を加えています。Wordpressなどと比べた時のpukiwikiの大きな強みの一つはその動作の軽さで、当サイトでも以前は非表示にしていたページ下端のconvert timeを表示するようにしました。ref.inc.phpが無いページでは0.010秒、ref.inc.phpがあるページでは0.020秒以内の描画を目標にしています。
PHP 8.2に移行
サーバー設定をPHP 8.0からPHP 8.2にしました。pukiwiki 1.5.4の公式対応はPHP8.1までしか明言されていませんが、PHP 8.2でも特に動作の不具合は起こっていないようです。
PHP 8.2よりさらに大幅に高速化したPHP 8.3がすでにリリースされていますが、pukiwiki本家サイトがスパム攻撃のためにほぼ更新停止しており、今後PHP 8.3やPHP 9.xへの対応がどうなるのかは気がかりです。
2024年5月追記 PHP 8.3に移行
お借りしているサーバーのPHP 8.3対応により、当サイトもサーバー設定をPHP 8.2からPHP 8.3にしました。動作がほんの気持ち程度、早くなったような気がする。
当サイトで取り入れている非公式pukiwikiプラグイン
サイトのメンテナンス性を考慮して外部プラグインは増えすぎないようにしていますが、いくつかの非公式pukiwikiプラグインを取り入れています。
- akismet.inc.php + recaptcha.php (v2)
- attachref.inc.php
- ecache.inc.php
- html.inc.php(Internet archive)
- htmlinsert.inc.php(Internet archive)
- jsonld.inc.php
- ogp.inc.php(自作) + opengraph.php
- sitemap.inc.php
- tag.inc.php (Internet archive)
- tweet.inc.php(自作)
未ログイン状態で編集アイコンなどを非表示
https://pukiwiki.sourceforge.io/?%E8%B3%AA%E5%95%8F%E7%AE%B1/5484
pukiwikiの $auth_user を取得することでログイン状態を判定できることが判明したので、未ログイン状態では編集アイコンなどを非表示にするようにしました(当サイトは管理者しか編集しないので)。ログインするにはログインページのURL直打ちしてログインする運用にしています。pukiwikiのアイコンを非表示にすることで、普通のブログっぽい見た目を実現できるようにしています。
<?PHP if (!empty($auth_user)) { ?> 隠したい部分をここにはさむ <?PHP } ?>
過剰なSEO対策のダイエット
meta descriptionなどの削除
もはやSEOにはあまり効果がないと言われるmeta descriptionやmeta keywordを、ページによって削除しました。tag.inc.phpなどのプラグインが挿入するmetaタグは残しています。
スキンのCSS圧縮
pukiwikiのCSSは外部スタイルシートを読み込むよりも pukiwiki.skin.php の <head> に直接記述するほうが動作が速いので、当サイトでは外部スタイルシートを使わずにpukiwiki.skin.phpに記述していましたが、これをCSSの視認性を損なわない範囲でminifyして読み込みデータ量を若干削減しました。
構造化データの簡素化
JSON-LDで構造化データを示しておくとGoogleのbotなどにサイトの情報を伝えやすくなりSEOにも有利だとされていますが、ページ情報のわりにJSON-LDの分量が目立つので若干表示量を減らして簡素化しました。JSON-LDについてはjsonld.inc.phpの短縮URL対応も参考にしてください。
JavaScriptの遅延読み込みの削減
JavaScriptの多くで強制的に読み込みを遅らせるようにしていましたが(参考ページ)、asyncやdeferなど通常のJavaScript遅延読み込みで対応可能なものはそちらを使うようにしました。効果に大差ないわりに記述量が増えてメンテナンス性が悪いなどの理由からです。
その他
loading="lazy"のネイティブ化(非JavaScript化)
FirefoxおよびSafariなどのブラウザも画像遅延読み込みのloading="lazy"にネイティブ対応したことでほぼ全ての主要ブラウザが網羅されたと判断して、画像読み込みをJavaScript(lazysizes.jsプラグイン)ではなくloading="lazy"で遅延読み込みさせるように対応しました。主にref.inc.php やogp.inc.php やスキンでの変更になります。
当サイトでは他のJavaScriptも最小限しか使っていないため、lazysizes.jsを使用しなくなったのでjsdelivrの読み込みも不要になりました(jQueryはもともと使用していません)。WEBフォントも使わず、2021年ごろに取り組んでいたAMP対応も全て廃止済みなので、外部から読み込むライブラリはほとんど無い状態にしており、これによりpagespeed insightでもほぼ100点を維持しています。
lazysizes.jsプラグインを使用しなくなってもlazysizes.jsプラグインのために講じたCLS(Cumulative Layout Shift)対策は有効なので、引き続きpagespeed insightでのCLS、すなわち遅延や見込みに伴うレイアウトの崩れのスコアは0を維持することを目指しています。詳しくはLazysizes.jsを使うとCLSが発生する問題をご覧ください。
CDNの積極的使用
当サイトでは以前からCloudflareによるサイト高速化を行っています。Cloudflareは随時新機能が追加されており、無料で使用できる機能も多数あります。画像やスクリプトファイルはCDN経由で読み込むようにすることでサイトを軽量化することができます。
ecache.inc.phpの利用
Pukiwikiの描画をキャッシュ化しておくことでPHPにさせる処理を軽量化できます。トップページなど更新頻度に対して表示回数が多いページを丸ごとecache.inc.php化しておくと効果的です。なお、オリジナル版はPHP 8に未対応なので「はいふん」氏によるPHP 8対応の改造版(v1.6)が必要です。
画像のwebp化
jpgやpngの画像はwebpも扱えるようにしておき、pictureタグで両方を読み込めるようにしておきます。macOSとiOSのSafariが2020年11月にwebpに対応したことで主要ブラウザのほとんどはwebp画像を読み込めるようになり(もはやInternet Explorerに配慮する必要性もほとんどなくなり)、webpは積極的に取り入れる方がサイト軽量化にとっても有用です。
Cloudflareの有料プランなどでは自動webp化してくれるオプションもあるようですが、当サイトは現状ではローカルでWebP converterを使って一括webp化した画像を画像フォルダに手動でアップロードしています。
公式プラグインの微修正
ref.inc.phpはpukiwikiのデフォルトのプラグインの中では動作が遅いプラグインですが、@getimagesize周りなどに手を入れることで高速化できます。詳しくは画像をref.inc.phpで貼り付ける時に少し速くをご覧ください。
自作プラグインの微修正
自作プラグインのいくつかで不安定な挙動を示していた部分などを微修正しました(グローバル変数でなくて良いのにグローバル変数を多用していた部分の適正化など)。
JavaScriptを使って過剰に遅延読み込みさせていた部分も、通常のasyncやdeferで対応するのと大差ないパターンでは構造を簡素化しました。サイト転送量の削減を優先しています。
サーバー設定(将来的にLiteSpeed?)
これ以上に高速化に関わりそうな因子として、当サイトはApache 2.4上で動作していますが、これをnginx、あるいはさらに高速なWEBサーバーと言われているLiteSpeedに置き換えれば、特にTTFBの短縮などが期待できるかも知れません。HTTP/3に対応したサイトの約35%がLiteSpeed上で動作しているとも言われています*1。
今まで使用しているバリューサーバー(安いプランはすぐに制限がかかるので少なくともスタンダードプランである必要があります)はApache 2.4しか対応していないので、サーバー移行は今後の課題です。
この記事に対するコメント
このページには、まだコメントはありません。
更新日:2024-03-29 閲覧数:602 views.