Posted by をかもと at 2009年2月20日 金曜日

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 をそれぞれ CSSTidyjsmin-php で圧縮できるオプションを付けました。
また、コメント欄でのゆりこさんからの指摘により、ユーザエージェントに「AppleWebKit」を含むブラウザ(ただし chrome は除く)からのリクエストがあった場合は .gz ファイルを転送しないように修正しました。
あと、簡単な注意書きを書いた「readme_ja.txt」を同梱したので、読んでやってください。

[3/4 18:30 追記]正式版のリリース準備版を公開しました。
今まで、php ファイルを直接修正していた各種設定は、管理画面の「設定」>「Head Cleaner」から行えます。
また、競合が報告されているプラグインと、その対処法について「readme_ja.txt」に書いてあります。
そちらも、ご一読ください。

[3/5 23:00 追記]正式版リリースしました。

概要

<head> の中身を整形しなおします。

  • IE6 以外の時は先頭に xml 宣言を付与。
  • 重複タグや、不要なタグ、コメント、空白を削除。
  • <meta name="description" /> タグが複数ある場合、一つにまとめる
  • <meta name="keyword" /> タグが複数ある場合、一つにまとめる
  • 話題の <link rel="canonical" /> タグを追加。
  • IE コンディショナルタグを判定して、ブラウザが IE の時だけ対象タグを表示。
  • CSS, JavaScript は、ブラウザが対応していれば gzip 圧縮転送。
  • 複数ある CSS を media 属性ごとに結合して一ファイルにまとめる。
    もちろん、そのファイルには インライン CSS も含まれる。
  • CSSTidy を使用して CSS を最適化する。
  • CSSTidy の最適化オプションを管理画面で指定できる。
  • 複数ある JavaScript をすべて結合して一ファイルにまとめる。
    もちろん、そのファイルには インライン JavaScript も含まれる。
  • JSMin で、JavaScript のソースコードを圧縮する。
  • JavaScript をフッタ領域に移動することもできる。
  • フッタ領域の JavaScript も同様に結合して一ファイルにまとめる。
  • Prototype.js, jQuery, mootools が複数読み込まれている場合、1回だけ読み込むようにする。
  • Prototype.js, jQuery, mootools の読み込み順を修正して、できるだけコンフリクトが発生しないようにする。

※制限事項
・SimpleXML でパースしていますので PHP 5 以降が必須になります。
 また <head> 部が、XML的に正しくないとパース出来ないので、このプラグインは動作しません。

→ Ver. 0.3.0 で、PHP Simple HTML DOM Parser でパースするようにしたため、わりかしルーズな (X)HTML でも通ると思います。
 PHP Simple HTML DOM Parser の制限上、PHP 5 以降必須です。

適用例

どうなるかは、ビフォー・アフタを見てもらえばわかりやすいかな?

適用前

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<title>独断と偏見の何でもレビュー</title>
<meta name="description" content="暇人による、暇人の為の何でもレビューもしくは日常メモ。since Feb. 27, 2005" />
<link rel="stylesheet" href="http://dogmap.jp/wp-content/themes/dogmap/style.css?ver=20081006" type="text/css" media="screen" />
<link rel="shortcut icon" type="image/x-icon" href="http://dogmap.jp/favicon.ico" />
<link rel="icon" type="image/x-icon" href="http://dogmap.jp/favicon.ico" />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://dogmap.jp/feed/" />
<link rel="alternate" type="application/atom+xml" title="Atom" href="http://dogmap.jp/feed/atom/" />
<link rel="alternate" type="application/rss+xml" title="ROR" href="http://dogmap.jp/sitemap.xml" />
<link rel="index" href="http://dogmap.jp/" />

<link rel="start" href="http://dogmap.jp/" title="Home" />
<link rel="appendix" href="http://dogmap.jp/about/" title="About" />
<link rel="pingback" href="http://dogmap.jp/xmlrpc.php" />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://dogmap.jp/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://dogmap.jp/wp-includes/wlwmanifest.xml" />
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js'></script>
<script type='text/javascript' src='http://www.google.com/jsapi?key=ABQIAAAAdkdXbSzAaW3Z-fZ0VLiA-BTNLsTCkgAHG6R1rGrc2jhIZmfrTxQ-ueNTQFYw3AGOgb5OImln4sk1QA'></script>
<script type='text/javascript' src='http://dogmap.jp/wp-content/plugins/wp-autopager/js/wp-autopager-0.5.1.min.js?ver=0.5.1'></script>
<script type='text/javascript' src='http://dogmap.jp/wp-content/plugins/wp-lightpop/js/jquery.lightpop-0.7.5.min.js?ver=0.7.5'></script>
<script type='text/javascript' src='http://dogmap.jp/wp-includes/js/jquery/jquery.cookie.js?ver=1.0'></script>
<meta name="generator" content="WordPress 2.7.1" />

<style type="text/css" media="screen,tv,print,handheld"> /*<![CDATA[ */
div.googlemaps{width:300px;height:150px;clear:both;margin:1em auto;border:1px solid #999;line-height:1.25em;text-align:center;overflow:hidden;}
div.googlemaps img {margin:0;padding:0;border:0 none;max-width:none;max-height:none;}
div.googlemaps .infowindow {text-align:left;font-size:0.88em;}
div.googlemaps p {margin:0;text-indent:0;text-align:left;font-size:0.75em;}
/* ]]>*/ </style>
<link rel="alternate" media="handheld" type="text/html" href="http://dogmap.jp/" />
<link href="http://dogmap.jp/wp-content/plugins/syntax-highlighter/css/shCore.css?ver=2.0.287" type="text/css" rel="stylesheet" />
<link href="http://dogmap.jp/wp-content/plugins/syntax-highlighter/css/shThemeDefault.css?ver=2.0.287" type="text/css" rel="stylesheet" />

<meta name="robots" content="index,follow" />

<style type="text/css">/*<![CDATA[ */
#content {width: 97.5%;display: block;}
#r_sidebar {width: 17.5%; display: none;}
/*]]>*/</style>

<script type="text/javascript">/*<![CDATA[ */
var addLoadEvent = function(func){ if(typeof jQuery!='undefined'){jQuery(document).ready(func);} else if(typeof google.setOnLoadCallback!='undefined'){google.setOnLoadCallback(func);} else if(typeof wpOnload!='function'){wpOnload=func;} else {var oldonload=wpOnload; wpOnload=function(){oldonload();func();}}};
/* ]]>*/</script>
<script type="text/javascript">/* <![CDATA[ */
var googlemapsAnywhereL10n = { language:"ja",markerTitle:"Googleマップに移動",cssPath:"div.googlemaps",errMsgNoData:"エラー: ストリートビューのデータが見つかりません。",errMsgNoFlash:"エラー: お使いのブラウザは Flash に対応していないようです。",errMsgUnknown:"エラー: 不明なエラーです。"};
var lightpop={options:{ imageLoading:'/wp-content/plugins/wp-lightpop/images/lightpop-ico-loading.gif',imageBtnPrev:'/wp-content/plugins/wp-lightpop/images/lightpop-btn-prev.gif',imageBtnNext:'/wp-content/plugins/wp-lightpop/images/lightpop-btn-next.gif',imageBtnClose:'/wp-content/plugins/wp-lightpop/images/lightpop-btn-close.gif',imageBlank:'/wp-content/plugins/wp-lightpop/images/lightpop-blank.gif',flvplayer:'/wp-content/plugins/wp-lightpop/swf/mediaplayer.swf',contentFrameType:'border',overlayBgColor:'#FFF',contentBorder:'1px solid silver',setLinkToTitle:true,Image:{enabled:true,icon:'http://dogmap.jp/wp-content/plugins/wp-lightpop/images/icon-image.png',size:new Array(640,480)},Video:{enabled:true,icon:'http://dogmap.jp/wp-content/plugins/wp-lightpop/images/icon-video.png'},Contents:{enabled:true,icon:'http://dogmap.jp/wp-content/plugins/wp-lightpop/images/icon-contents.png',iframeEnabled:false},YouTube:{enabled:true,icon:'http://dogmap.jp/wp-content/plugins/wp-lightpop/images/icon-youtube.png',param:{'hl':'ja','autoplay':'1','fmt':'18'}},Metacafe:{enabled:false},LiveLeak:{enabled:false},GoogleVideo:{enabled:false},ifilm:{enabled:false},Dailymotion:{enabled:false},superdeluxe:{enabled:false},nicovideo:{enabled:false}},start:function(){}};
/* ]]> */</script>

</head>

適用後

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta name="description" content="暇人による、暇人の為の何でもレビューもしくは日常メモ。since Feb. 27, 2005" />
<meta name="generator" content="WordPress 2.7.1" />
<meta name="robots" content="index,follow" />
<title>独断と偏見の何でもレビュー</title>
<link rel="shortcut icon" type="image/x-icon" href="http://dogmap.jp/favicon.ico" />
<link rel="icon" type="image/x-icon" href="http://dogmap.jp/favicon.ico" />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://dogmap.jp/feed/" />
<link rel="alternate" type="application/atom+xml" title="Atom" href="http://dogmap.jp/feed/atom/" />
<link rel="alternate" type="application/rss+xml" title="ROR" href="http://dogmap.jp/sitemap.xml" />
<link rel="index" href="http://dogmap.jp/" />
<link rel="start" href="http://dogmap.jp/" title="Home" />
<link rel="appendix" href="http://dogmap.jp/about/" title="About" />
<link rel="pingback" href="http://dogmap.jp/xmlrpc.php" />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://dogmap.jp/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://dogmap.jp/wp-includes/wlwmanifest.xml" />
<link rel="alternate" media="handheld" type="text/html" href="http://dogmap.jp/" />
<link rel="canonical" href="http://dogmap.jp/" />
<link rel="stylesheet" type="text/css" href="http://dogmap.jp/wp-content/cache/head-cleaner/css/e938e5ff38c9d1b871d3ef8006dcbfd4.css" media="screen" />
<script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAAdkdXbSzAaW3Z-fZ0VLiA-BTNLsTCkgAHG6R1rGrc2jhIZmfrTxQ-ueNTQFYw3AGOgb5OImln4sk1QA"></script>
<script type="text/javascript" src="http://dogmap.jp/wp-content/cache/head-cleaner/js/c2046402dd21ec3000596d55d75cc257.js"></script>
</head>

何ということでしょう!あんなに汚らしかった HTML コードが、こんなにもスッキリと!
しかも YSlow の結果も、適用前の F(53)と比べると、適用後は D(60)に改善されてます。

今後の予定

あとは指定タグを取り除く機能とか、xml 的に残念なソースでもそれなりにパースする機能とか、重複 JavaScript の削除機能とか付けたいですね。

あと、プラグインの名前も。
JSeries に既に「光画部」があるので、「営繕マン」とか良いかなと思いました。
「島崎くんはイルカの曲芸」です。(謎)

本日の人気記事


トラックバック & ピンバック » 表示する

コメント

  • JAPAN Windows Mozilla Firefox 2009年2月21日 土曜日 8:21 AM

    rel=”canonical” を含めているところがにくいですなぁ。 ;)

    JSeries に既に「光画部」があるので、「営繕マン」とか良いかなと思いました。

    光画部だから、「編集部」でいいじゃね? :lol:

    # yutakaさんのところでも見たような気がするけど、ソースコードのハイライト表示で<wbr>が入るのはなぜ?

  • JAPAN Windows Google Chrome 2009年2月22日 日曜日 10:28 AM

    rel=”canonical” を含めているところがにくいですなぁ。

    流行りですからねぇ。

    # yutakaさんのところでも見たような気がするけど、ソースコードのハイライト表示でが入るのはなぜ?

    ハイライト表示用に同じ JavaScript を使っているからですかね。

  • JAPAN Ubuntu Linux Mozilla Firefox 2009年2月23日 月曜日 11:39 AM

    遅ればせながら、キレイキレイ作戦完了です :mrgreen:
    いろいろお手数をかけちゃいました。コメントクイックタグは数種類試して異常がなさそうなのを
    選択。スマイルはプラグインを変更してみたんですが、お出ましにならなかったので手動で
    タグを書いたら出ていらっしゃいました。ヘッダークリーンでYSlowのスコアが20ぐらいあがり
    ました。なんだか嬉しいですわ :mrgreen:

  • JAPAN Windows Mozilla Firefox 2009年2月23日 月曜日 12:56 PM

    yutaka さん、どもです。

    まだまだ α版も良いところですが、色々なサイトで試していただけると、問題点の洗い出しが非常に楽です。
    ぜひぜひ、色々お試しください。

    ヘッダークリーンでYSlowのスコアが20ぐらいあがりました。なんだか嬉しいですわ :mrgreen:

    YSlow のスコアなんて、指標に過ぎないんですがあがると妙に嬉しいですよね :P

  • JAPAN Mac OS Safari 2009年2月24日 火曜日 2:36 AM

    Mac 版 Safari では CSS 圧縮を認識しないようで、スタイルが出ません!! JavaScript も効いてなさそうです。

    「CSS, JavaScript は、ブラウザが対応していれば gzip 圧縮転送。」の判定を見直すことをおすすめします。Safari が腐っている可能性も大なんですが、とりあえず Safari を除外してもらえれば助かります。

  • JAPAN Ubuntu Linux Mozilla Firefox 2009年2月24日 火曜日 6:21 AM

    ゆりこさん、どもです。

    Mac 版 Safari では CSS 圧縮を認識しないようで、スタイルが出ません!! JavaScript も効いてなさそうです。

    「CSS, JavaScript は、ブラウザが対応していれば gzip 圧縮転送。」の判定を見直すことをおすすめします。Safari が腐っている可能性も大なんですが、とりあえず Safari を除外してもらえれば助かります。

    うわぁ、本当だ。Win版の Safari でも、ダメでした。
    同じレンダリングエンジンの Webkit を使っている Chrome では、正常に動作していたので Safari での動作確認を怠っていました。
    ご指摘感謝です。

  • JAPAN Windows Mozilla Firefox 2009年2月25日 水曜日 7:38 PM

    是非と思いましたが、J君の環境では駄目です。
    色々考えてみました。

    プラグインを入れての、ソースを見たら以下のようでした。

    以下何もなしでした。
    是非ともJ君も入れたいと思いますので、よろしくお願い申し上げます。

    J君 返信 | 引用
  • JAPAN Windows Mozilla Firefox 2009年2月25日 水曜日 7:46 PM


    コードで括りました。

    J君 返信 | 引用
  • JAPAN Ubuntu Linux Mozilla Firefox 2009年2月25日 水曜日 11:11 PM

    J君、どもです。

    まだまだ開発途上版です。不具合も山ほどありますので、ご承知ください。
    あと、このプラグインの性格上、他のプラグインとの相性問題が出やすいです。

    このプラグイン以外を全て停止して、他のプラグインを一つずつ有効にし、不具合が発生しないか確認して、どのプラグインと相性が悪いか確認してください。
    確認できたら、連絡いただけると助かります。
    なお、yutaka さんの報告では、「Quick Comment Tags」プラグインとは相性が悪いようです。

  • JAPAN Windows Mozilla Firefox 2009年2月25日 水曜日 11:27 PM

    色々ありがとうございます。
    色々頑張って調べてみます。
    びんさんと比較して異なるのは
    グーグルの広告のスクリプトが怪しいと思うので、それを重点的に明日調べてみます。
    いつも、ありがとうございます。

    びんさんのソースを見て感激しました。
    何とか調べたいと思います。

  • JAPAN Windows Mozilla Firefox 2009年2月26日 木曜日 5:40 AM

    初めまして、早速使用させて頂いたのですが不具合が見つかりましたので報告させて頂きます。

    症状はJ君さんと全く同じでサイトの内容が全く表示されずにソースが白紙になるというものです。
    フック部分で何かと競合しているのではと思い、ヘッダ挿入系のプラグインをあらってみた結果「All in One SEO Pack」が競合していることが判明致しました。
    有名所なので僕だけかな、と心配になったのですが停止すると正常に動作しましたので間違いないような気がします(ちなみに、補足で書いておくと主に同プラグインのDescriptionフィールドを主に使用)。

    ちょっと切るわけにはいかないプラグインなので、現在はHead Cleaner(仮)を停止せざるを得ないのですが、競合する環境はかなり多い気がするので次の修正で可能であれば考慮して頂ければ幸いです。
    私事ではありますが、僕のようなヘビーにCSSやjsを読み込むサイトには非常に魅力的なプラグインなので使用できるのを楽しみにしています :P

  • JAPAN Ubuntu Linux Mozilla Firefox 2009年2月26日 木曜日 8:37 AM

    ajin さん、はじめまして。

    不具合というか、相性問題ですね。
    「Head Cleaner」は、その仕様上 ob_start() 関数を使っているプラグインとの相性が悪いです。
    「All in One SEO Pack」はJ君も使っているようなので、そのプラグインとの競合が起きてる可能性が大きいですね。
    メジャーどころのプラグインですので、対策を考えてみます。

  • JAPAN Windows Mozilla Firefox 2009年2月26日 木曜日 9:30 AM

    J君です。
    色々調べてみると、”Comment Quicktags-Reloaded”というプラグインを外すと正常に動作します。
    そして、私の場合は、”All in One SEO Pack”の影響は受けていないようです。有効化していても、特に問題はありませんでした。

    Comment Quicktagsについては、他のプラグインを探してみます。
    ソースがスッキリ、とっても嬉しいです。
    素晴らしいプラグインでーーーす。

  • JAPAN Windows Mozilla Firefox 2009年2月26日 木曜日 9:46 AM

    J君、どもです。

    「Comment Quicktags」 については、yutaka さんに指摘されました。
    # 前回のコメントでプラグイン名を間違って「Quick Comment Tags」と書いてましたね :oops:

    で、「Head Cleaner」と競合しないように修正したので以下に置いておきます。
    よろしければ、お使いください。
    http://dl.getdropbox.com/u/110305/comment-quicktags.zip

  • JAPAN Windows Mozilla Firefox 2009年2月26日 木曜日 9:50 AM

    バッチリ!です。
    これで全て解決しました。

    ありがとうございました。

  • JAPAN Windows Mozilla Firefox 2009年2月26日 木曜日 10:15 AM

    ajin さん、J君、どもです。

    「All in One SEO Pack」のソースを見てみたんですが、多分 「Rewrite Titles:」 ってオプションにチェックが付いていると、「Head Cleaner」と競合します。
    “Descriptionフィールドを主に使用”と言うことであれば、こちらのオプションを切って「All in One SEO Pack」を使ってみてはどうでしょう?

    J君のところで競合しないのも、多分「All in One SEO Pack」のこのオプションを使用していないからだと思われます。

  • JAPAN Windows Mozilla Firefox 2009年2月26日 木曜日 10:28 AM

    J君です。
    「All in One SEO Pack」ですが・・・
    以下のオプションにチェックが入っています。

    Rewrite Titles:
    Use noindex for Categories:
    Use noindex for Archives:
    Autogenerate Descriptions:

    他はチェックは入っていません。

    この状態で問題なく動作しています。

  • JAPAN Mac OS Safari 2009年2月26日 木曜日 11:19 AM

    新版は Safari では直りましたが、NetNewsWire に組み込みのウェブ表示機能 (これも WebKit 利用) だとダメでした。UserAgent は
    Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_5_6; ja-jp) AppleWebKit/525.27.1 (KHTML, like Gecko) NetNewsWire/3.1.6
    です。AppkeWebKit を含むウェブブラウザーすべてを対象とした方がいいのかもしれません。

    All in One SEO Pack (のタイトル書き換え機能) は Ktai Style とも競合します。Ktai Style の場合、携帯閲覧時に All in One SEO Pack を殺すという対策を取っています (1.35 あたりから対策)。All in One SEO Pack が ob_start でタイトル書き換えするという凶悪な実装なのが理由なので、作者に直してもらうしかないですね。WordPres 2.5 あたりから、フィルターフックでタイトル書き換えできるので、それを使えばいいはずなのに……。

    正直なところ、そういう凶悪な実装をしているという理由で、「All in One SEO Pack は使うべきではない」と思っています。

  • JAPAN Windows Mozilla Firefox 2009年2月26日 木曜日 1:04 PM

    ゆりこさん、どもです。

    gzip 圧縮転送については Content-Type が異なるファイルを解釈している Safari 以外のブラウザの方がおかしいような気もします。
    拡張子が .gz のファイルについても適切な Content-Type をブラウザに渡せるように .htaccess を書き換える件について以前エントリしています。
    http://dogmap.jp/2007/09/04/gzip-components/

    本当はこちらの方法で対応したほうがいいんですが、WordPress プラグインごときが .htaccess をいじるのはちょっとやりすぎかなという気もしていて…
    # っていうか、すでにこのプラグイン自体、かなり偏執狂的な感じになってきていますが :oops:

    All in One SEO Pack は、たかだかタイトルを書き換えるためだけに ob_start を使うのは確かに凶悪すぎますね。

  • JAPAN Ubuntu Linux Mozilla Firefox 2009年2月26日 木曜日 5:49 PM

    やっと、みんなに追いついた :D

    うちのサイトも0.5.3化完了しました。
    Comment Quicktagsの修正版もばっちり動いてます。
    かなーりスッキリしました :mrgreen:

  • JAPAN Mac OS Safari 2009年2月26日 木曜日 6:55 PM

    gzip 圧縮転送については Content-Type が異なるファイルを解釈している Safari 以外のブラウザの方がおかしいような気もします。

    むむ。そうなると gzip 圧縮機能を削除しなければならないような気が ;-)
    でも、それは変な気がするので、PHP 側で HTTP ヘッダの Content-Type を吐いてやればいいような気がします。
    つまり、gzip 圧縮した cache ファイルを直接見せるんじゃなくて、スクリプト経由で cache ファイルを吐くわけです。
    PHP の動作負荷がかかってしまいますが、HTTP 的には valid な動作になると思われます。

    あと、Pre 2.6 対応として WP_CONTENT_DIR 等を勝手に定義していますが、この方法はあまり好ましくありません。
    この手法を使うプラグインは結構多いのですが、「WP_CONTENT_DIR が定義されていれば WP 2.6 以降である」と判断する行儀の悪いプラグインがあるため、それで不具合が発生してしまいます。

  • JAPAN Windows Mozilla Firefox 2009年2月26日 木曜日 7:07 PM

    satchin さん、どもです。

    Comment Quicktagsの修正版もばっちり動いてます。
    かなーりスッキリしました :mrgreen:

    スッキリして何よりです。
    とりあえず、まだまだ不具合が隠されている予感なので、なにかおかしなところに気づいたらドシドシご連絡ください。

  • JAPAN Windows Mozilla Firefox 2009年2月26日 木曜日 7:10 PM

    ゆりこ さん、どもです。

    つまり、gzip 圧縮した cache ファイルを直接見せるんじゃなくて、スクリプト経由で cache ファイルを吐くわけです。
    PHP の動作負荷がかかってしまいますが、HTTP 的には valid な動作になると思われます。

    コメントアウトしてありますが、ロジックを組み込んであります。
    この辺の動作も、ユーザに選択してもらおうと思ってます。

    あと、Pre 2.6 対応として WP_CONTENT_DIR 等を勝手に定義していますが、この方法はあまり好ましくありません。

    うっ、私のプラグインではほとんどこの手法を使ってます。
    wp_content_dir() 辺りを使ったほうが良いんですよね。あとで、まとめて修正します。

  • JAPAN Windows Mozilla Firefox 2009年2月26日 木曜日 8:44 PM

    をかもとさん、J君さん、ゆりこさん有難うございます。

    なるほど、バッファの取り出しタイミングがズレるから白紙になってしまうのですね……。All in One SEO Pack自体はソースがあまり宜しくないという評判は聞いていたのですが、よくソースを精読しないままに質問してしまいました申し訳ありません。
    あと、言葉が足りませんでしたがタイトルの書き換え自体は使用しています(投稿画面の追加フィールドはほぼ使用していないという意)。
    というわけで、をかもとさんの仰るとおりチェックを外し、タイトル書き換えのみ別の方法で代用すればなんとか使用できそうです。

    All in One SEO Packは確かに凶悪な実装をしているのかもしれませんが、取り扱うジャンルの性質上かなり検索エンジンのインデックス結果に気をつかっているので使用せざるを得ない状況だったりします…… :cry:

  • JAPAN Ubuntu Linux Mozilla Firefox 2009年2月26日 木曜日 11:49 PM

    ajin さん、どもです。

    私もテスト環境で 「All in One SEO Pack」 を導入して試してみたんですが、件のオプションをチェックしても問題なく動作しました。
    ちなみに、私がテストに使用した「All in One SEO Pack」のバージョンは 1.4.7、WordPress は 2.7.1 です。

    J君の所でも 「All in One SEO Pack」 と同時に動かして問題ないようなので、問題は別にあるかもしれません。

  • JAPAN Windows Mozilla Firefox 2009年2月27日 金曜日 12:45 AM

    検証頂き、有難う御座います。

    僕が使用しているバージョンも両者とも同じです。そちらでは問題なく動作したとのことでこちらでももう一度検証してみた結果、どうやらTOPページだけ白紙になっていたことが判明致しました。
    投稿記事、ページ、カテゴリー、タグ、アーカイブ、つまりタイトルの書き換えの発生しているページでのみ正しく動作していることになります。

    ということは何故か書き換えの発生しないTOPページで相性問題が発生していることになるのですが……うーん、謎ですねぇ。
    その条件に限って他のプラグインが悪さをしているのかもしれません、もしくはob_end_flush()が適正数コールされてない?

    ちなみに件のオプションのチェックを外すとTOPページも正常に動作します。
    取り急ぎ報告まで。

  • JAPAN Mac OS Safari 2009年2月27日 金曜日 4:41 PM

    wp_content_dir() 辺りを使ったほうが良いんですよね。あとで、まとめて修正します。

    たぶん、wokController のクラス変数を直接呼ぶというのが楽だと思います。wokController で WordPress のバージョン差異を吸収する処理をしているわけですから、ここに WP_CONTENT_DIR, WP_PLUGINS_URL とかと同等の内容を入れておき (すでに入っている気が……)、プラグイン内部ではこの値を使うのが素直な気がします。

    wp_content_dir() とかは 2.6 以降でしか使えないので、プラグイン内部でこれを使おうとすると version_compare() だらけになって、あまり見通しがよくないですし。

  • JAPAN Windows Mozilla Firefox 2009年2月27日 金曜日 7:50 PM

    追記です。相変わらず理由はよく分からないのですが、症状を起こしていた原因が判明致しました。
    どうやら自前のテーマが悪さをしていたようです。お騒がせして申し訳ありませんでした。

    「All in One SEO Pack」 と同時に動かして問題ないようなので、問題は別にあるかもしれません。

    結論から言いますと、この条件下でテーマ内でquery_posts();を用いて内部クエリを操作し、二つ目のループを作成していると問題が起きるみたいです。
    「All in One SEO Pack」タイトルの書き換えうんぬんは関係ありませんでした。また、「All in One SEO Pack」の件のチェックを外しますと正常に動作するので、その処理内で行われている動作と、2つ目のループ(もしくはクエリの操作)が組み合わさることによって何らかの形で問題が引き起こっているのだと思われます。

    したがって、正しくはをかもとさんとJ君さんが前述されたとおり「All in One SEO Pack」単体では「コンフリクトしない」でした。
    あまり多い環境ではないと思いますので参考にはならないかもしれませんが、こういう事例がありましたという報告にて締めさせて頂きたいと思います。お騒がせして申し訳ありませんでした。

  • JAPAN Ubuntu Linux Mozilla Firefox 2009年2月28日 土曜日 12:39 AM

    ゆりこさん、どもです。

    たぶん、wokController のクラス変数を直接呼ぶというのが楽だと思います。wokController で WordPress のバージョン差異を吸収する処理をしているわけですから、ここに WP_CONTENT_DIR, WP_PLUGINS_URL とかと同等の内容を入れておき (すでに入っている気が……)、プラグイン内部ではこの値を使うのが素直な気がします。

    そう、すでに入っているのです。
    wokController は、私のプラグインで共通的に使っているモノをまとめた共通クラスなんですが、Head Cleaner 作成当初は、これを元にしてませんでした。
    ある程度、大きな規模になってきたので 0.5.x から、wokController を継承元にすることにしたんですが、ダブっている所も多々あり。
    ソースのクリーンアップをしなきゃだなぁ。

  • JAPAN Ubuntu Linux Mozilla Firefox 2009年2月28日 土曜日 12:43 AM

    ajin さん、どもです。

    したがって、正しくはをかもとさんとJ君さんが前述されたとおり「All in One SEO Pack」単体では「コンフリクトしない」でした。
    あまり多い環境ではないと思いますので参考にはならないかもしれませんが、こういう事例がありましたという報告にて締めさせて頂きたいと思います。お騒がせして申し訳ありませんでした。

    解決したようで何ヨリです。
    まだまだ、不具合等あると思いますので、何かあったらドシドシお知らせください。
    あと、このプラグインは CSS, JavaScript を結合していますが、それにより他のプラグインで挿入された JavaScript が正常に動作しなくなる可能性もあります。
    その辺も何かお気づきの点があれば、一方頂けると助かります。

  • JAPAN Windows Mozilla Firefox 2009年3月1日 日曜日 4:20 AM

    まとめのほうで取り上げて頂いていたようで、ありがとうございました。
    非常に細かいことではありますが、あれから一つ気づいたことがあったのでお知らせしておきます。

    環境によって、一部Google Analyticsのga.jsを使うトラッキングコードが正しく動作しないことがあるようです。
    以下圧縮前のコード例。

    <script type="text/javascript">
    var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
    document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    </script>
    <script type="text/javascript">
    var pageTracker = _gat._getTracker("UA-xxxx-xx");
    pageTracker._initData();
    pageTracker._trackPageview();
    </script>


    僕のサイトではプラグインでトラッキングコードを管理しているためwp_footer()に当該コードが含まれることになるのですが、これが圧縮されるとdocument.writeでスクリプトタグを書き出してから読み込みが完了するまでにタイムラグがあるのか、_gat.〜がga.js読み込み前に動作してしまいjavascriptエラーが出てしまいます。で、実際エラーが出ていた間はトラッキング出来ていないようでした。
    wordpress構築サイトで通常SSLが絡むページをトラッキングすることはないと思われますので、そのままスクリプトタグに記述することで解決出来ましたがやはりトラッキングコードはそのまま圧縮後のファイルに含めるよりもページに直接書き出されていたほうがスマートな気がします。

    そこで、可能であればGoogle Analyticsのトラッキングコードに限って圧縮と書き出しを回避するか、整形したくないコードを何かの文字列で囲むことによって整形を回避できる(整列のみ動作する)仕組みがあると嬉しいです。

    あくまで小さな要望ではありますが、頭の隅にでも気にかけて頂ければ幸いです :o

  • JAPAN Ubuntu Linux Mozilla Firefox 2009年3月1日 日曜日 5:14 PM

    ajin さん、どもです。

    確かに、この状態だと結合してしまうと必ずエラーが出ますね。
    この辺に配慮して、なんとかするオプションをつける必要がありますね。

    ちなみに、私も Google Analytics を使っているのですが、_gat を jQuery を使用して DOM 構成後に呼び出すように書いているため、発覚しませんでした。

    <script type="text/javascript">
    var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
    document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    jQuery(function(){var pageTracker = _gat._getTracker("UA-xxxx-xx");
    pageTracker._initData();
    pageTracker._trackPageview();
    });
    </script> 
  • JAPAN Windows Mozilla Firefox 2009年3月1日 日曜日 9:00 PM

    ああなるほど、その方法がありましたか。すっかり盲点でした。
    jQueryのDOM構築後に呼び出されるreadyのfunctionでくるんでしまったほうが、一応sslなどで分岐できるのでスマートかもしれませんね。

    確かに、この状態だと結合してしまうと必ずエラーが出ますね。

    やはりそちらでも同じ結果になりましたか。一見違いがなさそうに見えるので少々不安だったのですが、少し安心しました。
    配慮していただけるとのことで、かなりホッとしています。ありがとうございました。

  • JAPAN Windows Mozilla Firefox 2009年3月3日 火曜日 5:38 PM

    初めまして、blog.tvyweb.netの管理人のxscaleと申します。
    競合するプラグインが見つかりましたので報告させていただきます。

    競合するプラグインはUltimate Google Analyticsです。
    Head Cleaner(仮)導入後コードが挿入されなくなります。

  • JAPAN Ubuntu Linux Mozilla Firefox 2009年3月4日 水曜日 1:19 AM

    xscale さん、はじめまして。情報ありがとうございます。
    できれば、プラグインの配布元 url と、利用されているバージョンも報告していただけると助かります。

    現在、準備中の正式リリース版では、特定のフィルタを指定して整形対象外にできるようにしています。
    そのオプションを適切に指定して、該当するプラグインが導入するコードを整形対象外にすることで対応できると思います。

  • JAPAN Windows Mozilla Firefox 2009年3月4日 水曜日 9:19 AM

    J君です。
    いつもお世話になります。

    http://wordpress.org/extend/plugins/wp-prettyphoto/

    現在↑このプラグインを利用していますが、head-cleaner-0.5.4 より新しいバージョンのものを入れると、wp-prettyphotoが動作しなくなります。
    何か対策がありましたら、ご教授頂けますと助かります。

  • JAPAN Windows Mozilla Firefox 2009年3月4日 水曜日 10:29 AM

    J君、どもです。

    wp-prettyphoto プラグインのソースを見ました。
    これは、このプラグインが吐き出している JavaScript が原因ですね。
    # 具体的には wp-prettyphoto.php の 156〜166 行目。

    以下に動作するように修正した wp-prettyphoto.php を置いておきますので、入れ替えてください。
    http://dl.getdropbox.com/u/110305/wp-prettyphoto.php

  • JAPAN Windows Mozilla Firefox 2009年3月4日 水曜日 10:51 AM

    J君です。
    ありがとうございます。
    head-cleaner最新バージョンにてバッチリ動作するようになりました。
    助かりました。

  • JAPAN Windows Mozilla Firefox 2009年3月4日 水曜日 6:34 PM

    xscaleです。
    早速のお返事ありがとうございます。

    http://www.oratransplant.nl/uga/

    上のURLがUltimate Google Analyticsの配布元です。
    使用バージョンは1.6.0です。

  • JAPAN Windows Mozilla Firefox 2009年3月4日 水曜日 6:41 PM

    xscale さん、どもです。

    さきほど、公開した head-cleaner-1.0.0-RC3 で、Ultimate Google Analytics でのエラーを回避可能になりました。
    # Ultimate Google Analytics の書き出すコードを Head Cleaner での整形対象外にすることが可能。

    設定方法は、同梱の readme_ja.txt をお読みください。

  • JAPAN Windows Mozilla Firefox 2009年3月4日 水曜日 6:50 PM

    xscaleです。

    head-cleaner-1.0.0-RC3に更新した後、コードを対象外に設定したところ、正常にコードが挿入されるようになりました。
    ありがとうございました。

  • JAPAN Windows Mozilla Firefox 2009年3月6日 金曜日 5:26 PM

    初めまして、XTORTと申します。

    IEのコンディショナルコメントなんですが、[lt],[lte],[gt],[gte]といった表記に対応していない気がします。

    私の検証不足かな?とも思ったんですが、正規表現に含まれていない感じです。

    ご報告まで。

    XTORT 返信 | 引用
  • JAPAN Windows Mozilla Firefox 2009年3月6日 金曜日 5:29 PM

    XTORT さん、はじめまして。

    IEのコンディショナルコメントなんですが、[lt],[lte],[gt],[gte]といった表記に対応していない気がします。

    すいません、すいません。そのとおりです。
    修正します。

  • JAPAN Windows Mozilla Firefox 2009年3月27日 金曜日 6:39 PM

    はじめまして。

    head内の乱雑さには甚だまいっていたのでこちらのプラグインを導入させていただいたのですが、
    私のサイトでは以下のような不具合が生じました。

    サイト最上部に「Object」という文字列が(数個)表示されその分サイトのデザインもずれる。
    (head内のhtmlソースをのぞいたところlink rel=”canonical”タグの上にObjectが挿入されている)

    プラグインをすべて外してみたのですがObjectの文字は消えませんでした。
    そこで、エラーログを調べてみたところ、
    head-cleaner.phpの727行(Is JavaScript)と918行(Read file)でエラーが出ていました。
    以下のファイルを開けないようです。

    略/head-cleaner.php?f=37ebe5b4dac287b81441abf23fefd5b8&amp;t=js

    上記では見えませんが文字参照のところでamp;amp;とダブっています。
    使っているJavaScriptが原因なのでしょうか?
    対処方法などお気付きの点がございましたらアドバイスしていただけると幸いです。
    よろしくお願いいたします。

    CHICK 返信 | 引用
    • JAPAN Ubuntu Linux Mozilla Firefox 2009年3月28日 土曜日 6:35 AM

      CHICK さん、はじめまして。

      サイト最上部に「Object」という文字列が(数個)表示されその分サイトのデザインもずれる。
      プラグインをすべて外してみたのですがObjectの文字は消えませんでした。

      うーん、プラグインをすべて停止してもダメですか。
      とすると、お使いのテーマと相性が悪いのも、テーマをデフォルトに変更しても「Object」が出るか、ご確認ください。
      出ないようであれば、テーマとの相性問題です。
      ご使用のテーマ名と、配布先をご連絡ください。ちょっと時間がかかるかもしれませんが確認してみます。

      また、差し支えなければ、実際に運用されているサイトのURLを教えていただけると確認作業がはかどります。
      コメント欄では差し支えがあるようでしたら、コンタクトフォーム ( http://dogmap.jp/contact/ ) から連絡いただければ、私宛にメールが届きます。

      • JAPAN Windows Mozilla Firefox 2009年9月8日 火曜日 3:59 PM

        headcleanerをありがたく使わせていただいています。
        また、をかもと様のコードを大変参考にしています。

        WebArena SuiteXにて、上記「サイト最上部に「Object」という文字列が(数個)表示されその分サイトのデザインもずれる。」という現象が出たので報告します。
        WebArena上では違うテーマに切り替えても出現し、他の環境では全く出ていません。

        963行目の以下の行を
        $tag = trim($element);

        下記のように修正したら直りました。
        $tag = trim($element->outertext);

        以上、報告を終わります。

        再現条件の詳しい報告が出来ず申し訳ありませんがよろしくお願いします。

        • JAPAN Windows Mozilla Firefox 2009年9月9日 水曜日 5:47 PM

          とりさん、どもです。
          ご指摘ありがとうございます。

          修正した Ver.1.3.1 をリリースしましたので、バージョンアップしてください。

  • JAPAN Windows Mozilla Firefox 2009年3月30日 月曜日 3:51 AM

    はじめまして :D tsuです。

    Head Cleaner 1.1.4にアップグレードしてから、ヘッダーのjavascriptが丸々全て出力されなくなりました。

    アップグレード直前にテーマも変えたのですが、これが原因でしょうか。

    何か解決策があれば、よろしくお願いします。

    あと基本的な質問ですが、ヘッダーにあるjavascriptは設定画面の「 部で有効な JavaScript」に表示されるんですよね?

    tsu 返信 | 引用
    • JAPAN Windows Mozilla Firefox 2009年3月30日 月曜日 4:13 AM

      すみません、解決しました。

      フッターにwp_footer()を加えてないという初歩的なものでした。どうもすみませんでした。

      あと、自分の場合はFlickr Managerと一緒に使ったら、一部のjavascriptが動かなくなりました。だから、Flickr Managerははずしました。

      tsu 返信 | 引用
      • JAPAN Windows Mozilla Firefox 2009年3月30日 月曜日 6:15 PM

        tsu さん、はじめまして。

        解決されたようで、良かったです。
        Flickr Manager の JavaScript の件は、こちらでも時間のあるときに調べてみますね。
        # ただし、調べられないかもしれないので、期待しないでいてください。

  • JAPAN Windows Mozilla Firefox 2009年4月15日 水曜日 10:36 AM

    サイト表示が重くて困っていたのですが、導入させていただいたところ、素晴らしい効果のあるプラグインです。

    プラグイン「WP-lightpop 0.7.5」と同時に使用したところ、Head Cleanerは問題なく動作するのですが、WP-lightpopが動作しなくなりました(ポップアップしなくなりました)。
    IEの表示では「エラー:’lightpop’は宣言されていません。」と出ます。

    WP-lightpopを停止すると、エラーは解消されるようです。
    また、Head Cleanerを停止すると、WP-lightpopは元通り動作します(firefox,chromeなどでも同様です)。

    Head Cleaner設定画面で「有効なフィルタ → LightPopController::addHead → 対象外にチェック」してみましたが、変化ありませんでした(対処方法がまちがっているのかもしれませんが…)。
    ぜひともHead Cleanerを使用させていただきたいと思っていますので、設定等ありましたら、ご回答いただけると助かります。

    使用環境は↓になります。
    WordPressバージョン 2.7.1
    MySQL 5.1.22-rc

    MSTYL 返信 | 引用
    • JAPAN Windows Mozilla Firefox 2009年4月15日 水曜日 12:57 PM

      MSTYL さん、はじめまして。

      Head Cleaner, wp-lightpop 共に私の作成したプラグインですが、私が作成したプラグイン用共通ライブラリ common-controller.php を含んでいます。
      たぶん、これのバージョンが違うことから発生しているのではないかと思われます。

      Head Cleaner 1.1.5, wp-lightpop 0.7.5 にバージョンアップ後、もしプラグインフォルダの includes/js サブフォルダ内に jquery-1.3.1.min.js (or jquery-1.3.2.min.js) が含まれていたら削除してみてください。
      これで直るかも。

  • JAPAN Windows Mozilla Firefox 2009年4月16日 木曜日 8:35 AM

    をかもとさま

    さっそくのご回答、ありがとうございます。
    ご指摘のとおり、jquery-1.3.2.min.jsがフォルダ内に残っていました。
    以前バージョンアップした時に、上書き?でアップロードしていたのかもしれません…
    一旦すべてを削除してアップロードしなおしたところ、どちらも問題なく動作するようになり、スッキリ解決いたしました。
    大変お手数をおかけしました。

    WP-lightpop & Head Cleanerともに、活用させていただいてます。
    ありがとうございました。

    MSTYL 返信 | 引用
  • JAPAN Windows Mozilla Firefox 2009年7月26日 日曜日 10:08 AM

    こんにちは。
    WPのテーマにwp.Vicuna Ext. Customを使っているのですが、CSSの呼び出しが@import urlとなり、Head CleanerでのCSS最適化等が出来ていないように思います。もし可能でしたら@importにも最適化を対応して頂ければと思います。

    返信 | 引用
    • JAPAN Ubuntu Linux Mozilla Firefox 2009年7月29日 水曜日 10:49 PM

      湊さん、はじめまして。

      現在のバージョンの Head Cleaner では @import url は一段目のみ対応していますが、入れ子になっている場合は対応していません。
      将来、対応するかもしれませんが、とりあえずはテーマを修正することで回避してください m(_ _)m

  • JAPAN Ubuntu Linux Mozilla Firefox 2009年10月3日 土曜日 2:37 PM

    こんにちは。
    便利に使わせていただいています、が LightBox2プラグインとの相性が悪いようで
    Head Cleaner を有効にすると LightBox2が動作しなくなります。
    全フィルタを対象外にしても、動かないためお手上げです。
    対応してくださると助かります。

    余談ですが、Google Maps Anywhere を使用する際に「複数の JavaScript を結合する」を有効にすると
    うまく動作しませんでした。

    ういろうの国の人 返信 | 引用
    • JAPAN Ubuntu Linux Mozilla Firefox 2009年10月3日 土曜日 2:40 PM

      あ、ごめんなさい
      LightBox2プラグインはこちらのです。
      http://www.stimuli.ca/

      ういろうの国の人 返信 | 引用
      • JAPAN Windows Mozilla Firefox 2009年10月7日 水曜日 12:36 PM

        ういろうの国の人さん、はじめまして。

        Head Cleaner を有効にすると LightBox2が動作しなくなります。
        全フィルタを対象外にしても、動かないためお手上げです。
        対応してくださると助かります。

        現在、WordCamp Kyoto の準備やら何やらで忙しくて検証できていません。
        時間のあるときに確認してみますね。もう少々、お待ちください。

        余談ですが、Google Maps Anywhere を使用する際に「複数の JavaScript を結合する」を有効にすると
        うまく動作しませんでした。

        私は、問題ないんですけどね。
        Google Maps Anywhere・Head Cleaner 共に最新版にアップデートしてもダメでしょうか?
        私の作成しているプラグインは、一部ソースコードを共有しているものがあるので、すべてが最新じゃないとうまく動作しないことが稀にあります。
        この辺は、ご容赦ください。

コメントをどうぞ


Twitter ID を入力すると新しいコメントがあった際、 @dogmap_jp が、あなた宛に@リプライでお知らせします。

入力いただいたメールアドレスから、TwitterGravatar に登録されているアイコンを表示します。
(メールアドレスは公開されません)

改行と段落タグは自動で挿入されます。メールアドレスは表示されません。

:mrgreen: :-P :-D :-) ;-) :-o :-| :-( 8-O :-? 8-) :twisted: :evil: :oops: :roll: :cry: :lol: :-x more »

コメント投稿30分後までは「コメント編集」をクリックして内容を修正することができます。