幾周前微軟討論了flickr資源管理器示例,對比了ie9平臺預覽第二版、chrome、safari以及firefox在圖片渲染方面的性能。不久前 ie9更新了平臺預覽第三版,微軟也在今天提供了又一輪測試對比,并引入了amazon shelf概念應用。
amazon shelf和flickr資源管理器一樣是使用html、css和javascript標準編寫的,并且包括一個非常關鍵的html5新功能canvas元素,canvas是一種非常強大的功能,能調用javascript api直接繪制圖形。
ie9中的canvas是默認開啟硬件加速的,當ie9用戶瀏覽一個使用了canvas的網站時,ie會自動調用pc的所有資源來提供最佳性能,這是當前的瀏覽器無法實現的。使用ie9時,amazon shelf可以實現每秒60幀的響應速度,堪稱實時響應,而普通的瀏覽器僅能達到1至8 fps。
下面來看一下各大瀏覽器的對比,微軟解釋說此次對比中之所以沒有添加ie8,是因為它并不支持canvas元素。
首先,來看一下chrome 5的表現。chrome不使用任何gpu資源,每0.99秒刷新一次頁面,在書架加載動畫時幀速約為1fps,這一成績十分低。
其次來看蘋果safari 5。在動畫加載時,safari沒有任何渲染動作,成績為0,同樣也僅占用cpu資源。
mozilla昨天發布了firefox 4 beta 1,不過微軟在此次測試中使用的是beta 2的預覽版本,在默認配置下firefox的gpu硬件渲染并未開啟。firefox每0.25秒刷新一下頁面,幀速為8fps。
最后來看ie9平臺預覽第三版,從下圖可以看到,ie9調用了gpu硬件實現了渲染加速,cpu呈周期性處理數據,能抽出更多時間來處理其它應用程序,因此提供了穩定、流暢的頁面渲染,幀速高達60fps。
