Home
Title list
RSS
Adminブラウザとレンダリングエンジン
最近のブラウザは html ファイルを描画する部分(レンダリングエンジン)
がライブラリなどで分けられているものが一般的です。
よく使われているブラウザとレンダリングエンジンをまとめてみました。
使用、サイト制作
まずはレンダリングエンジンをブラウザの使用やサイト制作に関係するところでまとめてみます。
- Trident - Internet Explore
- IE のレンダリングエンジンは Trident と呼ばれています。
ブラウザとしてよく使われているのは IE ぐらいですが、 Windows アプリ開発で HTML 表示用のコンポーネントとしても提供されているので、 Windows では意外といろいろなアプリで使用されています。 - Gecko - Firefox
- Gecko は Mozilla Foundation
で開発されているオープンソースなレンダリングエンジンです。
こちらも Trident のように他のアプリからも利用できるのですが、 少し使い方が特異なせいか、使用されているのは Firefox や Thunderbird といった Mozilla 製品ぐらいです。 - WebKit - Google Chrome, Safari
- Google Chrome, Safari のどちらもレンダリングエンジンは
WebKit
を使用しています。
これは Apple, Nokia, Adobe といった企業が中心となっている WebKit Foundation でオープンソースとして開発されています。
また、WebKit は iOS, Android の標準エンジンですので、モバイル用ブラウザではほとんど WebKit が採用されています。
さらに Linux の統合ディスクトップ環境である gnome の標準ブラウザ Epiphany も WebKit がレンダリングエンジンに使われています。 Linux には gnome のほかにもう一つ有名な KDE という統合ディスクトップ環境があります。 こちらのファイルマネージャ、ブラウザである Konqueror は KHTML というレンダリングエンジンが使用されています。 WebKit はもともとこの KHTML から派生して作られています。 - Presto - Opera
- Opera のレンダリングエンジンは
Presto
という名前です。
任天堂 DS などにも使われているらしいですが、 モジュールとして公開されていないため、 ほぼ Opera だけで使われているレンダリングエンジンです。
追記 2013-02-14
Opera もレンダリングエンジンを WebKit に移行することになりました。追記 2013-04-04
Chrome が WebKit から分岐した Blink になりそうです。 (ついでに Opera も) また、 Firefox もモバイル版だけかも知れませんが、 Survo 変わる可能性があります。なぜ、ブラウザとレンダリングが分けられているのか
ブラウザとレンダリングが分けられている理由は HTML でどんどん高機能なものが求められるようになり、 HTML の表示機能を作るのが大変になっているというところにあります。
例えば、 ブラウザとメーラーを作っていて、
ブラウザだけでなく、メーラーにも HTML の表示機能を付けたいという時、
個々のアプリで実装するよりもブラウザからレンダリングエンジンを分けられるようにして、
それを共有した方が開発はやりやすくなります。
コンピューターを買うとき、どのくらい魅力的なアプリがあるかということが重要です。
Microsoft や Apple はレンダリングエンジンをモジュールとして提供することによって、
アプリ開発を促すことが出来ます。
また、 WebKit などは大変なところはみんなで作って、 それをみんなで使おうという発想から生まれています。
プラットホーム
IE の Trident 以外のレンダリングエンジンはすべてクロスプラットホーム対応です。
Windows, Mac, Linux といったディスクトップ用 OS だけでなく、
iOS, Android といったモバイル用の OS にも対応しています。
WebKit だけでなく、 Opera, Firefox でもそれぞれのエンジンを使ったブラウザのモバイル用が出ています。
標準対応と速度
使う点で考えた場合、気になるのは HTML5, CSS3 といった標準対応や表示速度ではないかと思います。
これらはバージョンや使っているブラウザによって変わってくるので、比較は難しいところです。
特に速度はブラウザに抜きにはできないのですが、ブラウザの比較であれば、
オンライン上の速度の測定(ベンチマーク)や比較結果を載せたサイトがあります。
HTML5, CSS3 についてもブラウザごとの対応状況を一覧にしてあるサイトがあります。
個人的なイメージだと Firefox が他のものに比べて頭一つ標準への対応が早い気がします。 ただ、 Firefox はフリガナの <ruby> のように対応しないものはいつまでもしないなというところもあります。遅い方はというと、こちらは IE がかなり遅れてから対応している感じです。 しかし、 IE も自動アップデートするということなので、 Firefox のようなショートスパンでのリリースが期待できるようになるかも知れません。
CSS のベンダープレフィックス
まだ仕様が確定していない CSS の機能が実装される場合、レンダリングエンジンごとの ベンダープレフィックスが必要なことがあります。
| レンダリングエンジン | プレフィックス |
|---|---|
| Trident | -ms- |
| Gecko | -moz- |
| WebKit | -webkit- |
| Presto | -o- |
例えばこのブログの記事のタイトルに使っているグラデーションの機能は CSS では次のように記述しています。
background: -moz-linear-gradient(top, white, silver); background: -o-gradient(top, white, silver); background: -webkit-gradient(linear, left top, left bottom, from(white), to(silver));
このプレフィックスは仕様が確定してくると付ける必要がなくなってくるので、
バージョンによってプレフィックスが外れたりします。
そのまま付けておいても問題はないのですが、いっぱい付けるのも面倒ですし、
どの機能にベンダープレフィックスをつけなければいけないのかというのが、
わかっていると便利です。
これをまとめてくれている非常に助かるサイトがあります。
Firefox で Trident を使う
昔は IE でないとちゃんと表示できないようなサイトが結構あったのですが、
最近では標準にあわせることの方が重視されて、そういうサイトは減ってきました。
しかし、 MSDN のような Microsoft のサイトを Firefox でみれないということがありました。
しかも、たちの悪いことに 最近の Visual Studio ではリファレンスなどのヘルプはネット上の MSDN をみるようになっていて、結構不便です。
Firefox では、 Gecko だけでなく、アドオンでレンダリングエンジンに Trident を利用することも出来ます。 これを使って私は MSDN のページは IE のコンポーネントで表示するように設定しています。
Lunascape - トリプルエンジン
そんなにシェアがあるわけではないですが、レンダリングエンジンに関してちょっと変わり種の
Lunascape
も紹介しておきます。
この Lunascape では Trident, Gecko, WebKit の 3 つのエンジンを切り替えて使えるようになっています。
こちらも前節のように状況によってエンジンを切り替えるという発想で生まれたブラウザです。
ただ、 3 つ使うという複雑なことをやっているせいか、重くてあまり評判はよくないみたいです。 しかし、ブログなどのサイトや Web アプリケーションなどを作っているときには 簡単に切り替えられるので、見え方を確認するときに重宝します。
また、 User Agent の設定を切り替えて、擬似的に携帯用のページを表示できるようにもなっています。
User Agent の設定は若干わかりづらいですが、 Trident の個別設定ページで設定し、
使う場合も Trident エンジンを選択して表示します。
アプリ開発に利用
html が高機能化していって、個人で標準に対応したブラウザを 1 から作ろうと思うと無理に近いです。
しかし、このレンダリングエンジンを使えば、ブラウザを作ることもそこまで難しくなくなります。
まぁ、あまりブラウザを作ろうと思うことは少ないかも知れませんが、
アプリケーション中で html ファイルを表示したいということは結構あると思います。
今度はこのレンダリングエンジンをアプリ開発に利用する方法について書いてみたいと思います。
ただし、 Opera の Presto に関しては、オープンソースでもないですし、バイナリ(dll) として利用することもできません。
| レンダリングエンジン | ソース | ライブラリ利用 | dll |
|---|---|---|---|
| Trident | クローズド | ○ | Mshtml.dll |
| Gecko | オープン | ○ | mozctl.dll |
| WebKit | オープン | ○ | webkit.dll |
| Presto | クローズド | × | × |
IE コンポーネント、 Trident
Trident はコンポーネントとしてみた場合、 IE コンポーネントや WebBrowser コンポーネントと呼ばれています。
これを使う場合には、 MFC であれば、
CHtmlView クラス、
.NET であれば、
WebBrowser クラス
として利用することが出来ます。
Windows で開発するのであれば、これを使うのが一番簡単ではないかと思います。
Gecko
Firefox や Thunderbird といった Mozilla アプリケーションは以下のような構成になっています。
- GUI のレイアウトを XML ファイル (XUL)
- 全体を JavaScript
- スピードネックとなるような箇所を C++ コンポーネント (XPCOM)
レンダリングエンジンの話に戻ると、 Gecko も XPCOM として提供されています。
XPCOM は Windows の COM の クロスプラットホーム版のようなもので、
JavaScript などから C++ コンポーネントが利用できるようになっています。
このため、 Gecko を利用しようとした場合、XULRunner を使って、 XUL+XPCOM アプリケーションとして作成するか、 libxul を使って XPCOM を使えるようにする必要があります。
ちょっと HTML ページを表示したいだけなのに、 Gecko を使おうとすると、いろいろややこしく、
私は途中でやめてしまいました。
ただ、最近では
Mozilla ActiveX Control (mozctl.dll)
というのができて、 Windows では通常のライブラリのように利用できるようになったようです。
WebKit
WebKit は webkit.dll というライブラリとなっているので、 通常のライブラリのように利用することも出来ます。
しかし、 Qt では
QtWebKit
モジュールとして組み込まれて、
QWebView クラスで IE コンポーネントの CHtmlView のようにすぐ使えるようになっています。
クロスプラットホームで動作させたい場合には、こちらを利用すると簡単に使うことができます。
Qt のサンプルには、 QtWebKit を使った
ブラウザの例
もあります。
また、 Qt では簡単な Html であれば、 ラベルやテキストエリアといった ウィジェットでも表示することは可能です。
結局、どれを使う
エンジンを使ったアプリを作る視点から考えると
Windows 版のみなら Trident 、クロスプラットホームや Mac 用ならば WebKit がお勧めです。
Gecko を使うのは少しハードルが高い気がします。
Presto は残念ながら使えません。
2012-02-27
使用、サイト制作向けの情報を追加して、かなり書き直してみました。
- 2012-01-31
- | コメント(0)
- | トラックバック(0)
- | Edit
- |
