読者です 読者をやめる 読者になる 読者になる

albatrosary's blog

Azure と Angular と Wercker CI とか

HTML5 Advent Calendar 1日目:12月1日時点の html5test とかで色々なブラウザを試してみる

HTML5 Advent Calendar

このエントリーは「HTML5 Advent Calendar 2014」12月1日の記事です。実は今日 HTML5 Advent Calendar を立ち上げようと話が持ち上がり急遽このブログを立てました。

HTML5 Advent Calendar 2014 - Qiita

HTML5も今年正式勧告となり次のHTMLを目指し色々と楽しんでいると思いますが各ブラウザの実装状況は今日時点でどうなっているでしょう?可能な限り「HTML5 TEST」を試してみました(あくまでも余興ですので)。

HTML5 TESTとは

HTML5 TESTとは555のチェックポイントから各ブラウザの実装状況をチャックするツールです。これは W3C が行っているものではなく github アカウント"NielsLeenheer"氏によるものです。

https://html5test.com/

NielsLeenheer/html5test · GitHub

ブラウザを点数評価してみる

Google Chrome [バージョン 39.0.2171.71 (64-bit)]

f:id:albatrosary:20141201161519p:plain

Google Chrome Canary [バージョン 41.0.2235.0 canary (64-bit)]

f:id:albatrosary:20141201161646p:plain

Safari [バージョン 8.0 (10600.1.25.1)]

f:id:albatrosary:20141201161744p:plain

Opera [バージョン 26.0.1656.24]

f:id:albatrosary:20141201162132p:plain

Firefox [バージョン 33.1.1]

f:id:albatrosary:20141201162328p:plain

Firefox Developer Edition [35.0a2 (2014-11-27)]

f:id:albatrosary:20141201162406p:plain

Firefox Nightly [37.0a1 (2014-11-30)]

f:id:albatrosary:20141201170007p:plain

IE11

f:id:albatrosary:20141201163308p:plain

バリデーションチェック

ブラウザの点数はともかく、実装したときに書いたものが正しいのかチェックするサイトがあります。HTML、CSSJavaScriptと揃ってますので確認すると良いです。

HTMLバリデーション

W3Cによる「Markup Validation Service」がありますので開発後のマークアップチェックはこちらで行うと良いです。

The W3C Markup Validation Service

CCSバリデーション

W3Cによる「CSS Validation Service」がありますので開発後のCSSチェックはこちらで行うと良いです。

The W3C CSS Validation Service

JavaScriptバリデーション

Ecma InternationalのTechnical Committee 39 (TC39) が作っているサイトです。ECMA Scriptのチェックはこちらで。

ECMAScript Language – test262

ベンチマークテスト

SunSpider (JavaScriptベンチマーク)

SunSpider は JavaScriptベンチマークです。このベンチマークは、コアをテストするJavaScriptの言語のみではなく、DOMまたは他のブラウザのAPIをテストします。これは、同じブラウザの異なるバージョン、および互いに異なるブラウザを比較するように設計されています。

SunSpider 1.0.2 JavaScript Benchmark

octane (JavaScriptベンチマーク)

octane も JavaScriptベンチマークです。こちらは Google製で SunSpider はAppleWebkitチームが使っていたベンチマークテストです。

Octane — Google Developers

最後に

これ以外にも色々な評価ツールがありますので、色々と試されると面白いかもしれません。そしてhtml5test の評価が高いから低いからとか555ポイント取れてないから云々の話はあまりこだわる必要はないと思います。こういう機能は実装されているのかな?とかされてないのかといったくらいのものだと思います。