評(píng)IE10對(duì)HTML5的完美支持
近期Windows 8的消息充斥著整個(gè)網(wǎng)絡(luò)。微軟將IE10集成在系統(tǒng)中，并且宣稱(chēng)IE10會(huì)很好的支持HTML5。本文是對(duì)IE10支持HTML5的研究報(bào)告。
預(yù)覽：HTML5初探
在過(guò)去的幾年里我們做了一系列測(cè)試來(lái)評(píng)估主要的移動(dòng)平臺(tái)對(duì)HTML5應(yīng)用的支持。直到現(xiàn)在，我們?nèi)耘f沒(méi)有花時(shí)間在Windows phones上，主要因?yàn)閃indows Phone7瀏覽器太弱根本不值得評(píng)估。但是，在上周的Windows Build會(huì)議上我們得到一個(gè)開(kāi)發(fā)者預(yù)覽的平板電腦(運(yùn)行了Windows8和IE10)。我們想分享一下我們對(duì)HTML5用戶(hù)體驗(yàn)的第一印象。簡(jiǎn)單的說(shuō)(and with the caveat that we were running on the notably overpowered developer preview hardware)，IE10的HTML5用戶(hù)體驗(yàn)是我們接觸到的所有平臺(tái)上最好的。十年Web領(lǐng)域疲軟后，微軟復(fù)仇歸來(lái)。
Windows8 Web平臺(tái)
在我們進(jìn)入Win8和IE10對(duì)HTML5的支持細(xì)節(jié)之前，很值得回顧一下Windows8的一些概要。Windows8代表微軟在策略上的一個(gè)大的轉(zhuǎn)變，因?yàn)樗沟肳eb技術(shù)成為Windows原生應(yīng)用的首選。用Javascript、HTML、CSS開(kāi)發(fā)的應(yīng)用可以被構(gòu)建為Windows原生應(yīng)用了。
Windows的圖形、IO、設(shè)備核心服務(wù)訪(fǎng)問(wèn)，JavaScript都有和.NET以及C++的等效綁定。微軟的消息是你可以使用web技術(shù)構(gòu)建所有的Windows原生應(yīng)用。
那么，開(kāi)發(fā)一個(gè)簡(jiǎn)單的基于web的在IE10上運(yùn)行的應(yīng)用和開(kāi)發(fā)一個(gè)分發(fā)到Win8的原生應(yīng)用有什么不同呢?第一個(gè)不同點(diǎn)就是你允許訪(fǎng)問(wèn)的資源和怎么訪(fǎng)問(wèn)他們。作為一個(gè)基于web的應(yīng)用，你不能訪(fǎng)問(wèn)系統(tǒng)的保護(hù)資源如攝像頭、打印機(jī)等。要把你的web應(yīng)用打包成一個(gè)原生應(yīng)用，你必須創(chuàng)建許可列表文件來(lái)描述你想訪(fǎng)問(wèn)的受保護(hù)資源，然后將你的應(yīng)用提交到Windows的應(yīng)用商店。提價(jià)后，它將被做一連串的技術(shù)和政策檢查。盡管還沒(méi)有完全確定，我們猜猜應(yīng)用商店測(cè)試將會(huì)是微軟在Windows平臺(tái)的一個(gè)web技術(shù)評(píng)估部門(mén)。
HTML5支持
IE10里面的新特性有哪些呢?太多了，明顯的部分包括UI元素和特效。IE10預(yù)覽支持幾乎所有最近三年引入可視化HTML5和CSS3特性。IE9微軟已經(jīng)注意了幾個(gè)方面能力的提升如主要是硬件加速、畫(huà)布等幾個(gè)特性，但是IE10引入更多：
CSS轉(zhuǎn)變：2D和3D高效平滑轉(zhuǎn)換。3D轉(zhuǎn)換和抗鋸齒很明顯好于許多其他的瀏覽器。還有轉(zhuǎn)換的平滑度給人印象深刻，可能是硬件加速的原因吧
CSS動(dòng)畫(huà)：完全支持WebKit語(yǔ)法，這讓我們很機(jī)動(dòng)，因?yàn)檫@意味著Sencha Animator的動(dòng)畫(huà)在IE10上運(yùn)行起來(lái)很容易，只需要簡(jiǎn)單的查找替換(webkit替換為ms)即可
CSS3陰影：文本和盒子都支持(還包括插入物陰影)。合并陰影效果和其他特效將完美無(wú)瑕
CSS3傾斜：完全支持新的webki/mozilla語(yǔ)法，允許圓形和橢圓放射傾斜
這僅僅是一個(gè)開(kāi)始。還有web workers、web sockets、web fonts、Indexed DB、SVG濾鏡、flexbox布局等。好像只有圖片邊框沒(méi)有實(shí)現(xiàn)。
微軟獲得了幾個(gè)第一
在這些發(fā)布的UI特性中，IE10獨(dú)創(chuàng)了一些在其他瀏覽器中還沒(méi)有實(shí)現(xiàn)的，如CSS Regions、positioned floats。CSS Regions是一個(gè)Adobe做的一個(gè)草稿，它可以使報(bào)紙樣式的布局，實(shí)現(xiàn)類(lèi)似不規(guī)則插入、跨多列、讓文本圍繞浮動(dòng)的圖片。這些對(duì)于想在web上發(fā)行副本很有用。(最后，微軟還推動(dòng)grid layout，盡管這是其獨(dú)家實(shí)現(xiàn)……)
IE10也有一些針對(duì)觸摸接口的擴(kuò)展，控制元素滾動(dòng)、移動(dòng)、縮放。如，-ms-content-zooming CSS屬性可以控制可縮放元素、-ms-scroll CSS屬性可以滾動(dòng)行為。這些看起來(lái)還不是標(biāo)準(zhǔn)行為，所以能看到微軟起草覆蓋這些新特性也是件好事。
IE10缺少的?
有好幾項(xiàng)HTML5技術(shù)沒(méi)有出現(xiàn)在IE10里面，基于微軟平臺(tái)策略考慮，他們可能不會(huì)再出現(xiàn)在IE10里面了，WebGL很明顯不在菜單里。3D圖像，web開(kāi)發(fā)者智能使用JavaScript綁定Windows Direct圖形APIs并且只能將他們的應(yīng)用作為Windows應(yīng)用發(fā)布了。相應(yīng)的媒體圖像和設(shè)備APIs也永遠(yuǎn)不會(huì)出現(xiàn)了。這些就是微軟希望你通過(guò)原生綁定來(lái)毀滅的 APIs。
And What Will Ship?
我們對(duì)于Win8和IE10很機(jī)動(dòng)，我們認(rèn)為它結(jié)合了HTML5作為標(biāo)準(zhǔn)的跨平臺(tái)應(yīng)用開(kāi)發(fā)技術(shù)。我們希望我們不再必須使用原生包來(lái)訪(fǎng)問(wèn)有趣的設(shè)備API，但是微軟并不希望實(shí)現(xiàn)這些(策略考慮)。
我們當(dāng)然希望這樣。
【編輯推薦】
