拙作の Head Cleaner プラグインですが、他ブログでもちょっとずつ紹介いただいています。
ただ、設定値が多くて、うまいこと設定しないと真価を発揮しなかったりするので、ちょっと簡単に設定を解説してみようかと思いました。
入れてみましたが、目に見えた効果はあまり無かった気がします。
恐らく設定とテーマの内容等がきちんと見れていない為でしょうか。via.WordPress高速化に使えそうなプラグインを色々試してみた結果、けっこう早くなったのでご紹介。 / Maka-Veli .com
Head Cleaner をアップデートしました。
WordPress > Head Cleaner « WordPress Plugins
今回の追加機能は以下の２つ。
パラノイアモードが、どんな機能かというと head 部だけでなく html 全体をなるべく小さくするように不要な改行や連続した空白を取り除いちゃう機能です。
ただ、このパラノイアモードは実験的な機能なので、不具合が出る場合は適用しないでください。
# どんな感じになるかは、当サイトの HTML ソースを見てみてください。
さて、当サイトのトップページがどれくらい小さくなるかというと
| HeadCleaner off | 45.0 KB |
|---|---|
| HeadCleaner on without paranoia mode | 39.6 KB |
| HeadCleaner on with paranoia mode | 36.4 kB |
パラノイアモードオフの場合は12%、パラノイアモードをオンにすると19%サイズダウンしました！
当サイトでは gzip 圧縮が有効になっているため、実際に転送されるファイルのサイズは gzip 圧縮後のサイズになります。
あと Head Cleaner は自サイトの JS, CSS も最小化してくれるため、それらもまとめて見てみた方が良いでしょう。
| HeadCleaner off | 83.3 KB |
|---|---|
| HeadCleaner on without paranoia mode | 72.3 KB |
| HeadCleaner on with paranoia mode | 72.1 kB |
パラノイアモードオフの場合は13.2%、パラノイアモードをオンにすると13.2%サイズダウンしました！
パラノイアモードあまり意味ない … orz
続きを読む
久しぶりのリリース告知。
最近、プラグインをアップデートしてもリリース告知してませんでした。すいません。
さて、WordPress サイトの <head> の中身と、フッタ領域を整形する Head Cleaner をバージョンアップしたのでお知らせします。
WordPress > Head Cleaner « WordPress Plugins
今回の目玉は「CSS に含まれる画像の URL を、データスキーマ URI に変換する」機能の追加。
これは、Firefox、Safari、Opera などのデータスキーマURIに対応するブラウザからアクセスがあった場合、CSS内の画像ファイルをデータスキーマURIに変換して、HTTPリクエストを減らしちゃおうっていう機能です。
Google が最近公開した Apache モジュール mod_pagespeed にも実装されてる技術ですね。
対象になる画像ファイルは base64 エンコード後のサイズが 4096 byte 以内のファイルだけです。
小さいアイコンファイルがいっぱい入っている css だと結構効果あるかも、ないかも。
この数週間で、私がリリースしている WordPress 用プラグインを幾つかアップデートしました。
一応、簡単にご報告。
アップデートしたのは、以下の3つのプラグイン。
個々のプラグインの更新内容は、大体以下のような感じです。
続きを読む
拙作のプラグイン Head Cleaner と、WP Super Cache を同時に有効化している場合、多少問題があります。
Head Cleaner では、JS、CSS のキャッシュを wp-content/cache/head-cleaner フォルダに作成するのですが、WP Super Cache でキャッシュファイルを削除すると、このフォルダも削除されてしまいます。
# これは Twicon、wp-kougabu でも発生する問題です。
で、これに対処するには、今のところ wp-super-cache/wp-cache-phase2.php の 368 行目を以下のように修正するしかありません。
$protected_directories = array( $cache_path . '.htaccess', $cache_path . 'meta', $cache_path . 'supercache', $cache_path . 'head-cleaner' );
ちなみに、Twicon、wp-kougabu も導入している場合は、以下のように修正すればおっけです。
$protected_directories = array( $cache_path . '.htaccess', $cache_path . 'meta', $cache_path . 'supercache', $cache_path . 'head-cleaner', $cache_path . 'twicon', $cache_path . 'wp-kougabu' );
この辺 WP Super Cache が、wp-content/cache 内のフォルダ・ファイルを問答無用で削除するという凶悪仕様のため、Head Cleaner (Twicon) 側では対処の使用がありません。
WP Super Cache が、自分が作ったフォルダ以外は削除しないようになるか、せめて $protected_directories を他のプラグインから指定できるようにしてくれれば、対処のしようがあるんですが…
WordPress Plugin には、WP-Cacheや、WordPress Super Cache と言った高速化を実現するためのプラグインが多数あります。
これらのプラグインは、本来は動的に生成している WordPress のコンテンツをサーバ上にキャッシュしておいて、サーバ負荷を減らし、クライアントからのリクエストに対して、素早く返答しようというモノです。
つまりは、サーバ側の処理（バックエンド）の高速化。
Head Cleaner (仮) は、これらのプラグインとは違い、クライアント側の処理（フロントエンド）を高速化しようと言うのが狙いです。
多分、今まで無かったタイプの高速化プラグインでは無いでしょうか？
この辺のフロントエンドの高速化の解説は、以下のエントリが詳しいです。
これらで、提案されている基本的な技法は
と言うことになります。
では、 Head Cleaner (仮) の高速化技法について、当サイトのトップページを例に検証してみましょう。
続きを読む
さて、先日から「Head Cleaner (仮)」を、夜半になると Twitter 上で公開しては修正、機能アップを繰り返してきたのですが、盛り込みたかった機能もかなり盛り込めたので、これより熟成期間に入ります。
で、熟成期間に入る前に今までの経緯をまとめておきます。
まずは、このプラグインの基本的な動作原理。
<?php get_header(); ?> って記述があると思いますが、これが呼ばれた時に動作を開始します。<?php wp_head(); ?> が呼ばれた時点でバッファ取得を終了し、書き出された文字列を解析して整形します。やってることは、これだけ。
まだまだ開発途上のプラグインですが、人柱になっていただいている方々、ありがとうございます m(_ _)m
不具合は色々と出てきましたが、私は元気です。
さて、では以降は今までの経緯のまとめ。
続きを読む
WordPress にプラグインをガンガンと突っ込んでいくと <head> 部に、JavaScript やら CSS やらが、ドンドン追加されて、カオスなことになってしまいます。
そんな状態の自サイトを「YSlow for Firebug」で診断してみると、とても低いスコアになったりしてガックリ来るわけです。
プラグインを外したりしたくなかったりするので、チマチマと修正したりして使っていたんですが、プラグインのバージョンアップのたびに修正するのも面倒です。
そんな折、「WordPress Head Cleaner」というプラグインを見かけました。
これは、ひょっとして <head> 部を自動でキレイにしてくれるのか？と期待してダウンロードしてみたんですが、ソースを見てガッカリ。
ついカッとなって、こんなプラグインを作ってしまいました。
Head Cleaner@WordPress Plugins
または
Head Cleaner (最適化＆高速化)@JSeries
[2/24 6:00 追記] コメント蘭での、ゆりこさんからの指摘により、 Safari では拡張子が .gz の css, JavaScript を認識できないことが判明。
多分 「.gz」の Content-Type が 「text/javascript」 or 「text/css」 になっていないからだと思われます。
Ver.0.3.2 以降で、Safari に対しては gzip 圧縮されたファイルを転送しないように修正しました。
なお IE, Firefox, Opera, Chrome では、問題無いようです。
[2/25 8:00 追記]Ver. 0.4.0 から CSS もすべて結合することができるようになりました。
# ただし、デフォルトでは OFF になっています。
CSS 内の画像ファイル等への相対パスはすべて絶対パスに置き換えます。
制限事項としては、media 属性を気にせずにすべて結合し、media="screen" にしてしまうため、想定外の表示になる可能性もあります。
この辺は、後々修正します。
[2/26 12:30 追記]Ver. 0.5.x から、CSS と JavaScript をそれぞれ CSSTidy、jsmin-php で圧縮できるオプションを付けました。
また、コメント欄でのゆりこさんからの指摘により、ユーザエージェントに「AppleWebKit」を含むブラウザ（ただし chrome は除く）からのリクエストがあった場合は .gz ファイルを転送しないように修正しました。
あと、簡単な注意書きを書いた「readme_ja.txt」を同梱したので、読んでやってください。
[3/4 18:30 追記]正式版のリリース準備版を公開しました。
今まで、php ファイルを直接修正していた各種設定は、管理画面の「設定」＞「Head Cleaner」から行えます。
また、競合が報告されているプラグインと、その対処法について「readme_ja.txt」に書いてあります。
そちらも、ご一読ください。
[3/5 23:00 追記]正式版リリースしました。
続きを読む