Google Chrome Frame を使ってみた

IEChromeのHTML renderer,JavaScriptエンジン(V8),CanvasSVGと角丸などのIE未対応CSSを使えるようになる。

Google Chrome Frame
Developer's Guide - Google Chrome Frame

Chrome Frame モードにする

Developer's Guide にあるように、インストールした後IEChromeのようにレンダリングさせる方法は 3つ。

1. metaタグで「このページは Chrome Frame優先」と指定
 <meta http-equiv="X-UA-Compatible" content="chrome=1">

ちなみに、早速対応してくれているのは http://alex.dojotoolkit.org/ とか。このページの"Dear interwebs:..."などの引用部分の背景が角丸になっている。IEだとここは単なる直角の角の矩形。

当然これは自分のページでないと出来ないので、metaタグを仕込めないページには 2. or 3. を。

2. URL の先頭に "cf:" をつける

アドレスバーの URL の先頭に "cf:" をつける。例えば URL が "http://acid3.acidtests.org/" なら、

cf:http://acid3.acidtests.org/

ただし、これはローカルファイル(C:\...)には使えないっぽい。

3. レジストリに強制的にChrome FrameモードにしたいURLを登録

2. の方法では、画面遷移する度に "cf:" をつけなきゃいけないし、iframe とかあった日には非常に面倒。そこで「自己責任でいいから、どうしても」な人は、レジストリをいじる方法もある。

HKEY_CURRENT_USER
  └ Software
    └ Google
      └ ChromeFrame
        └ OptInUrls
           ├*google.com*         [Chrome Frame を使いたいURLの文字列パターン。既定値は使われない]
           ├*yahoo.com/mail*     [シンプルなパターンのみで、正規表現は使えない]
           └*                    ['*' はワイルドカード]

Chrome Frame モードなら、Acid3もばっちり

素のIEだと、こんなメタメタなものが

URLの先頭に"cf:"をつけるだけで100点に。


UserAgentには "chromeframe" が追加される

アドレスバーにこんなん貼り付けてalertさせてみると、

javascript:alert(navigator.userAgent);

UserAgentには "chromeframe;" という文字列が見られる。

Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0; chromeframe; SLCC1; ...)

SunSpiderでベンチとってみた

JavaScriptエンジンがV8ならさぞや...ということで、レジストリに登録する方法でSunSpiderで強引にベンチとってみた。結果をグラフにしてみたら、案の定というか何というか、すごいことに。なお、試験環境は、AMD Athlon 64 X2 1.8GHz にメモリ 2GB のノートPC。


予想通りの大差。IE7 with Google Chrome Frame は、Chrome 並のスピードで、オーバーヘッドがかなり少ないことが確認できた。少しChrome が負けてるのは、もしかして Google Chrome Frame の方がエンジンのバージョン新しかったりするのかな? Chrome の方は Stable リリースだったし。

今後にいろいろ期待

「JavaScirptのスピードとか、HTML5とか気にする人はChrome本体使うでしょ」...と言われれば確かにそう。実際自分は、仕方ない時しかIE使わないし。だけど、会社のやんごとなき事情でIE6を強制されているエンジニアには、うれしいんじゃないかな。まだユーザがレンダリングモード選ぶのが面倒なので、今後はツールバーか何かにボタンでも仕込んでカチカチ切り替えられるようにして欲しい所。それがあれば「普段Chrome、IE限定のサイトでは臨時でIE」が出来るし。

ところでこれ、IE作ってる人にはかなりモチベーション下げかねないプラグインじゃないかな?シェア一位なんだから、くじけずにいいブラウザにして欲しいな。