Feature Detection は未知の UA に対してのみ行うべき?
Chrome Frame とか作ってる Alex Russell さんと、Yahoo の Nicholas Zakas さんの意見。
- http://infrequently.org/2011/01/cutting-the-interrogation-short/
- http://www.nczonline.net/blog/2011/02/08/on-ua-sniffing-browser-detection-and-alexs-post/
要約すると、最近では既に UA Detection は悪で Feature Detection は善というふうな風潮になってきているが、Feature Detection は遅いし、既知の UA に対してまで毎回 Feature Detection する必要は無いのではないか。既知の UA へは Feature Detection の結果を再利用するだけでいいのではないか。と。
自分としては、以下の理由から有効性が疑わしいと思っている。
- 互換性を提供するライブラリやプラグイン(Gears や ExCanvas など)がある。もしあるライブラリが IE6 に Canvas は無いだろうと決め打ちしたら、ExCanvas のほうでその面倒を見ないといけない。
- Feature Detection のスイートを走らせるのに 30ms とかそれ以上かかると書いてあるが、それぐらいのことを気にする必要のあるアプリはほとんど無いのではないか?
- そんな事考えるぐらいならページのリソースを 30ms 早くロードする方法を考えたほうがいいと思う。
- デスクトップでは主要なブラウザとバージョンを合わせても10個も要らないと思うけど、モバイルも合わせたら大変な量になる。
- http://www.quirksmode.org/webkit.html (既にこの表ですら古いと思うけど)
- サポートする UA が増えればカオスになる。(一般的に、Feature が N 個、Known UA が M 個あれば、コードの量は N*M になる。)
など。
自分としては、Feature Detection はページロード時ではなく、その機能を最初に使うときに1回だけやって結果をキャッシュすることにすればいいと思う。そしたら 30ms とかの遅れだって関係ないし、使わないコードを走らせることもなくなる。
ちょっと書き方がわかりにくかったかも。つまりこういう↓ことが言いたかった(たぶん動くよね…?)
var addEvent(target, name, fn) = function() { // 最初に使うときに Feature Detection して、次からは addEvent を置き換える。 if (window.addEventListener) { addEvent = function(target, name, fn) { target.addEventListener(name, fn, false); }; } else if (window.attachEvent) { addEvent = function(target, name, fn) { target.attachEvent('on'+name, fn); }; } addEvent(target, name, fn); }