IE10预览:HTML5初探 翻译自Sencha

IE10预览:HTML5初探

在过去的几年里我们做了一系列测试来评估主要的移动平台对HTML5应用的支持。直到现在,我们仍旧没有花时间在Windows phones上,主要因为Windows Phone7浏览器太弱根本不值得评估。但是,在上周的Windows Build会议上我们得到一个开发者预览的平板电脑(运行了Windows8和IE10)。我们想分享一下我们对HTML5用户体验的第一印象。简单的说(and with the caveat that we were running on the notably overpowered developer preview hardware),IE10的HTML5用户体验是我们接触到的所有平台上最好的。十年Web领域疲软后,微软复仇归来。

Windows8 Web 平台

在我们进入Win8和IE10对HTML5的支持细节之前,很值得回顾一下Windows8的一些概要。Windows8代表微软在策略上的一个大的转变,因为它使得Web技术成为Windows原生应用的首选。用Javascript、HTML、CSS开发的应用可以被构建为Windows原生应用了。

Windows的图形、IO、设备核心服务访问, JavaScript都有和.NET以及C++的等效绑定。微软的消息是你可以使用web技术构建所有的Windows原生应用。

那么,开发一个简单的基于web 的在IE10上运行的应用和开发一个分发到Win8的原生应用有什么不同呢?第一个不同点就是你允许访问的资源和怎么访问他们。作为一个基于web的应用,你不能访问系统的保护资源如摄像头、打印机等。要把你的web应用打包成一个原生应用,你必须创建许可列表文件来描述你想访问的受保护资源,然后将你的应用提交到Windows的应用商店。提价后,它将被做一连串的技术和政策检查。尽管还没有完全确定,我们猜猜应用商店测试将会是微软在Windows平台的一个web技术评估部门。

HTML5支持

IE10里面的新特性有哪些呢?太多了,明显的部分包括UI元素和特效。IE10预览支持几乎所有最近三年引入可视化HTML5和CSS3特性。IE9微软已经注意了几个方面能力的提升如主要是硬件加速、画布等几个特性,但是IE10引入更多:

n CSS转变:2D和3D高效平滑转换。3D转换和抗锯齿很明显好于许多其他的浏览器。还有转换的平滑度给人印象深刻,可能是硬件加速的原因吧

n CSS动画:完全支持WebKit语法,这让我们很机动,因为这意味着Sencha Animator的动画在IE10上运行起来很容易,只需要简单的查找替换(webkit替换为ms)即可

n CSS3阴影:文本和盒子都支持(还包括插入物阴影)。合并阴影效果和其他特效将完美无瑕

n CSS3倾斜:完全支持新的webki/mozilla语法,允许圆形和椭圆放射倾斜

n 这仅仅是一个开始。还有web workers、web sockets、web fonts、Indexed DB、SVG 滤镜、flexbox布局等。好像只有图片边框没有实现。

微软获得了几个第一

在这些发布的UI特性中,IE10独创了一些在其他浏览器中还没有实现的,如CSS Regions、positioned floats。CSS Regions是一个Adobe做的一个草稿,它可以使报纸样式的布局,实现类似不规则插入、跨多列、让文本围绕浮动的图片。这些对于想在web上发行副本很有用。(最后,微软还推动grid layout,尽管这是其独家实现……)

IE10也有一些针对触摸接口的扩展,控制元素滚动、移动、缩放。如,-ms-content-zooming CSS属性可以控制可缩放元素、-ms-scroll CSS属性可以滚动行为。这些看起来还不是标准行为,所以能看到微软起草覆盖这些新特性也是件好事。

IE10缺少的?

有好几项HTML5技术没有出现在IE10里面,基于微软平台策略考虑,他们可能不会再出现在IE10里面了,WebGL很明显不在菜单里。3D图像,web开发者智能使用JavaScript绑定Windows Direct 图形 APIs并且只能将他们的应用作为Windows应用发布了。相应的媒体图像和设备APIs也永远不会出现了。这些就是微软希望你通过原生绑定来毁灭的APIs。

And What Will Ship?

我们对于Win8和IE10很机动,我们认为它结合了HTML5作为标准的跨平台应用开发技术。我们希望我们不再必须使用原生包来访问有趣的设备API,但是微软并不希望实现这些(策略考虑)。The final, but major, caveat is whether all these technologies will retain their speed and performance when Windows 8 is squeezed onto next year’s $299 tablets which are likely to have a GigaByte of memory and a lower-powered ARM processor.

我们当然希望这样。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏编程直播室

《使用 Angular2+ 开发 Markdown 编辑器》提纲

1562
来自专栏互联网杂技

HTML5干货』响应式布局的设计方法和响应式前端优化

作为一名优秀的web前端人员,不懂响应式布局怎么可以呢? 今天跟大家分享web前端开发和设计的干货。关于响应式布局的设计方法和响应式前端优化。 我们都知道,目...

45212
来自专栏携程技术中心

RN沙龙 | 那些携程火车票业务在RN实践中踩过的坑

姚瑞琼,前端程序媛一枚。2014年毕业后加入携程火车票事业部,今年年初起至今,主要负责React Native方案在火车票业务线的实践,先后参与并负责汽车票RN...

4749
来自专栏无原型不设计

新手看Mockplus2.3

Mockplus是我从今年下半年开始使用的一款原型设计软件,我被它简单高效的特性深深吸引着。他最近迎来了一次大版本(2.3)的更新,作为一名新手,我看着他再度走...

2807
来自专栏知晓程序

开发 | 谁说 LBS 小程序开发难?前端女王大人手把手教会你

利用它,你可以在小程序中调用一个功能完整的地图,让小程序里所展示的地点更直观、更精确。

1072
来自专栏大数据钻研

前端工程师如何干掉设计

前端是一个承上启下的职位,正因为其位置的特殊性导致其必须了解设计和后台的一些基本知识。本文并非教大家如何取代设计的工作,而是讲解前端如何更快更便捷的实现一些简单...

3334
来自专栏知晓程序

帮你快速抢红包,微信聊天记录竟有这些隐藏操作? | 晓技巧

1373
来自专栏数据小魔方

创意图表的几种玩法

今天小魔方要放个大招,给大家教几种图表的创意玩儿法。 相信不少小伙伴们在在浏览财经杂志的时候 都看过一些创意图表 里面运用了大量的图标和拟物元素 譬如这张 ? ...

3116
来自专栏编程

2017年JS 框架回顾:后端框架

英文:Laurie Voss 译文:葡萄城控件 www.cnblogs.com/powertoolsteam/p/the-state-of-javascrip...

2599
来自专栏ThoughtWorks

前端不止:请告诉我,你要什么样的图标

有一个英语成语叫做一画胜千言(A picture is worth a thousand words),不知道大家有没有听过?它是指的是一张静态的图片就可表达一...

3917

扫码关注云+社区

领取腾讯云代金券