latest log

酩酊状態で書いたエンジニアポエムです。酩酊状態で読んでください。

IE 6, IE 7, IE 8 が退場した未来

Internet Explorer の自動アップグレードについて | TechNet

長かった… 本当に長かった…
やっと、IE 6, IE 7 が居なくなるのですね…

uupaa.js ver 0.8 に埋まっている処理から情報を抜き出し IE 6, IE 7, IE 8 が居なくなった未来では何が可能になるのか抜粋してみました。

IE8 でやっと使えるようになる機能

一部は IE 6 や IE 7 でも使えるのですが、対応が限定的だったり不具合が多かったりと、安心して使えなかった機能も含まれています。

a::before {
  content: counter(article) ". ";
  counter-increment: article;
}
  • CSS attr method
a::before {
   content: attr(title) ": ";
}
  • CSS auto value
  • CSS inherit value
  • WebStorage (localStorage, sessionStorage)
  • HashChange Event
  • querySelector, querySelectorAll (ただし Selectors Level 3 で追加された pseudo-class は未サポート)
    • IE8 の querySelector は E:not(...), E:last-child, E:nth-child(...) 等が実装されていない
  • dataURI
  • WAI-ARIA
  • 最大接続数を window.maxConnectionsPerServer で確認可能に (maxConnectionsPerServer は IE だけの独自プロパティ)
    • HTTP 1.1 なら最大同時接続数が 4 → 6 に
      • HTTP 1.0 は 4 のまま
      • ダイヤルアップなら 2 のまま
      • レジストリの改変で最大接続数を制御可能に
IE 8 で改善された/仕様が変更された機能
  • String[indexer] で文字列の一部にアクセス可能に (IE8 からは "abc"[1] === "b") (IE7 までは "abc"[1] === undefined)
  • position: absolute; (IE6でも使えるがテキストが選択できなくなるバグがあった)
  • E:hover {...} (a要素以外にも適用可能に)
  • max-width: ..., min-width: ..., max-height: ..., min-height: ... (一部はIE7から)
  • 強化された XMLHttpRequest Internet Explorer 8 における XMLHttpRequest の強化
  • !important 宣言 (IE6では解釈にバグがあった)
  • border-color: transparent; (background: transparent は IE6 から利用可能)
  • 3つ以上のクラスセレクタを同時に指定可能に .E .F .G { ... }
  • readyState が他のブラウザと同じく "complete" を返すように
IE 8 で不要になる(意味がなくなる/使えなくなる)機能
  • zoom: 1 (hasLayout)
  • document.execCommand("BackgroundImageCache", false, true) (IE6)
  • CSS::expression
  • CSS Hack
  • node.getAttribute("className") (IE6, IE7 は "class" ではなく "className" にする必要があった)
  • ActiveXObject("Microsoft.XMLHTTP")
  • object.method = null; (クリティカルなメモリリーク対策)
  • node.tagindex, node.colspan を文字列ではなく数値として配慮する処理
  • node.checked と node.disabled の特殊処理
  • node.getAttribute(attr, 2) で <a href="relative/dir/file.ext"> をフルパスに変換する処理
  • [0,].length === 1 (IE6, IE7 では 2)
IE 9 でやっと使えるようになる機能
  • DOM Lv2 Event Model
    • document.addEventListener("DOMContentLoaded")
    • node.addEventListener(), node.removeEventListener()
    • event.target, event.pageX, event.pageY
    • event.stopPropagation(), event.preventDefault()
    • Capture Phase が使用可能に
node.addEventListener("click", callback, true)
  • color: transparent;
  • node.getElementsByClassName()
  • window.getComputedStyle()
  • window.innerWidth, window.innerHeight, window.pageXOffset, window.pageYOffset
  • node.textContent
  • CSS3セレクタ全般
  • opacity:
  • rgb(,,), rgba(,,,), hsl(,,), hsla(,,,)
  • multiple-background
  • background-clip:
  • background-size:
  • background-origin:
  • border-radius:
  • box-shadow:
  • canvas
  • SVG の一部機能 (IE9 ではフィルタがなく,DOMイベントに一部しか対応しておらず、他のブラウザとの差異や細かな不具合がある)
  • window.HTMLBodyElement などの HTML***Element 系 interface
  • window.Node interface
  • Array.isArray や Array#map 等のECMAScript 262-5th edition の機能
  • setter, getter ゲッタとセッタの定義 - JavaScript | MDN
IE 9 で改善された/仕様が変更された機能
  • Selectors API Level 1 (querySelector, querySelectorAll) をフルサポートし:notなどが利用可能に Selectors API Level 1
  • document や window などの HostObject が Object を継承するように仕様が変更された
    • for (i in document) { document.hasOwnProperty(i) } で例外が発生しなくなった
  • filter: progid:DXImageTransform.Microsoft.{{filterName}}({{values}})
    • 透過画像にフィルタを重ねてもジャギらないように実装が変更されている
  • Array.prototype.slice.call(NodeList) で NodeList を Array に変換可能に
    • Array.prototype.slice.call(arguments) で arguments を Array に変換するのは IE6, IE7, IE8 でも可能
  • node.innerHTML = "<style></style>"
  • node.cloneNode() (IE8まではクローンした <div> の参照がクローン元とクローンされた要素で共有されてしまい、クローン前にattachEventされているイベントハンドラも、クローン元とクローンされた要素で共有されてしまっていた)
IE 9 で不要になる(意味がなくなる/使えなくなる)機能
  • uuCanvas.js, uuAltCSS.js などの黒魔術
  • IE Event Model
    • event.srcElement, fromElement, toElement, cancelBubble, returnValue
    • window.event
  • querySelector polyfill (:not() などを自作の querySelector で処理する)
  • IE 専用の DOMContentLoaded 処理
  • getElementsByTagName("*") でコメントノードが列挙される事を配慮した処理
  • node.attributes の列挙処理への特別な配慮
  • innerHTML Hack
  • document.createElement("section") などの HTML5 shiv
  • Host Object が hasOwnProperty 等を持たず、アクセスすると例外を吐く事への特別な配慮
  • window.onunload でメモリの解放
  • node.cloneNode() Hack
  • document overwrite Hack 2011-02-11 - latest log
/*@cc_on var doc = document; eval('var document = doc'); @*/
var fn = function fnName() {};

if (typeof fnName === "function") {
    alert( "maybe legacy JScript(IE6, IE7, IE8)" );
} else {
    alert( "ECMAScript standard" );
}
  • イベントハンドラが受け取る event オブジェクトが DOM Level3 Event対応に
    • event.button の値が変化し、0(left click), 1(mid click), 2(right click) に
      • IE8 までの event.button とは値が変化している
        • IE8 では event.button & 0x1 が true なら left click
        • IE8 では event.button & 0x4 が true なら mid click
        • IE8 では event.button & 0x2 が true なら right click
IE 10 でやっと使えるようになる機能
  • text-shadow:
  • multiple columns
  • gradients
  • transforms
  • transitions
  • outline-offset:
  • resize
  • WebWorkers
  • WebSockets
  • Geolocation
  • Application Cache (Offline Cache)
  • node.style.userSelect = "none"
  • StyleSheet#insertRule, StyleSheet#deleteRule
  • XMLHttpRequest Level2 XMLHttpRequest - Wikipedia
  • File API
  • Indexed Database
  • Web Navigation Timing
  • Typed Array
IE 10 で使えるかもしれない機能
  • border-image:
  • WebRTC の一部
    • Video Captioning
    • Media Capture API
  • ES.next の一部
    • String#startsWith, endsWith, contains, repeat, toArray, reverse
    • Array.of, Array#from
    • Math.cosh, sinh, tanh, acosh, asinh, atanh, log1p, log2, log10, trunc
    • Number.isFinite, isNaN, isInteger, toInteger
IE 10 で不要になる(意味がなくなる/使えなくなる)機能
  • ビヘイビア (htc)
body {
  behavior: url(hoge.htc);
}
  • node.attachEvent, node.detachEvent
  • コンディショナルコメント MSDN Blogs
<!--[if IE]>
 ...
<![endif]-->
  • XDomainRequest (XMLHttpRequest Level2 を使いましょう)
  • えーと… いっぱい
IE 10 でも使えない機能
  • Function#name (関数名を取得)
  • XPath

参考リンク

IE 8 は 2014年4月8日で終了

IE 8 (Windows XP) は、2014年4月8日で終了します。あと2年です。

http://www.microsoft.com/ja-jp/windows/lifecycle/sp3eos.aspx

IE 6, IE 7 や IE 8 が退場した未来では "クロスブラウザ" という言葉は死語になり、
IE 6 全盛の時代に雨後の竹の子のように生まれたクロスブラウザなJavaScriptライブラリ達も、このまま死滅していく運命にあるのでしょうね。

「IE6を使い続けるほうがコストが低い」という理由で更新をOFFにしてきた企業に対しては、
「IE6を使い続けると逆にコスト高になる」という分岐点が来た事を提示して差し上げるべきかと。

「IE6, IE7 対応が不要なら割引料金」と提示するか、
「IE6, IE7 対応が必要なら割増料金」と提示するかですが、前者が良いかなと。
# 追加料金の書き方をちょっと変えるとずいぶん印象が違う - 頭ん中


(ε・◇・)з 間違いや抜けがありましたら @uupaa までお願いします