HTML5 in China 大会综述

6 月 10 日， HTML5 in China 大会在北京召开，来自各个相关领域的技术精英、专家学者从不同角度分享了 HTML5 的历史、优势、问题、影响和发展前景，观点和经验的碰撞与结合使参会的软件开发人员对 HTML5 有了更深的了解和更大的热情，对国内开发社区在 Web 方向的发展起到了良好的促进作用。 InfoQ 中文站全程参与大会，总编霍太稳应邀主持了 HTML5 游戏专场的演讲和讨论。本文结合会议的实况和嘉宾的幻灯片对HTML5 in China 大会做一技术综述，希望能够让读者对HTML5 有更全面的了解。

创新工场董事长李开复先生在开场致辞中对HTML5 技术的开放和自由的特质给予了极大的肯定。他表示，一些企业为了自身的商业利益，在产品中采用了闭源的、私有的技术和API，这种做法伤害了创业者、开发者特别是消费者。 W3C 的成立改善了这种状况，技术专家学者制定了开放的技术规范，说服越来越多的企业采用这些标准。同样，对于 HTML5 这样一个开放、自由的标准，创新工场一定会支持。个人云的发展，需要支持更多的运行平台，特别是移动设备，而 HTML5 的跨平台性使其在开发社区的技术选型中占据了重要的地位。

W3C 组织 HTML 主管 Michael Smith 以《Why HTML5》为题分享了自己对 HTML5 技术优势的理解。Michael 认为，HTML5 技术主要受益者包括：

1. Web 发布者 / 内容提供商
2. 多媒体网络提供商
3. Web 游戏
4. 社会化服务
5. 电子商务网站

以 HTML5 的多媒体特性为例，Micheal 表示，视频播放、动画、3D 交互图像、Web 视频聊天 / 会议、音频的采样和混合都将是 HTML5 的重要优点和应用趋势。

美国华尔街 HTML5 资深研究专家殷唯一表示，HTMl5 的发展势不可挡，他举了几个实际例子：

1. 迪斯尼与微软、Vectorform 公司共同制作了一款基于 HTML5 技术的数字动漫书《创战纪》。
2. 谷歌将逐渐取消对（不支持 HTML5 的）老版浏览器的支持。
3. 即将发布的 Windows 8 硬件加速特性提高了 HTML5 对游戏等应用的性能。

有趣的是，主流浏览器厂商的代表齐聚本次大会，介绍了各自浏览器对 HTML 5 的支持和发展趋势。

来自 IE 东家——微软公司的资深技术专家黄继佳着重强调了 IE9 的三种美：

1. 高效之美。IE9 采用了新 JavaScript 引擎 Chakra ，在 WebKit SunSpider 性能测试中占据优势。
2. 简洁之美。IE9 能够与 Windows 7 无缝衔接，地址栏更加智能。
3. 可信赖之美。黄继佳表示， IE testing center 的测试结果证明，IE9 对 HTML5 相关技术的支持程度较高，兼容性值得肯定。

除此之外，黄继佳还透露，微软一直在尝试实现更多的 HTML5 技术，有些已经做出了原型或者正在研发中，感兴趣的朋友可以到微软的 HTML5 实验室网站上找到最新的技术成果和演示程序。

Firefox 中国资深工程师米嘉的幻灯片颇具特色，由采用HTML5 和JavaScript 技术实现的Web 页面组成，他主要介绍了HTML5 在现代Web 技术中的十种有趣应用：

W3C 中文兴趣小组主席、 Opera 宣讲师谢子斌则从移动浏览器的角度分享了 HTML5 技术在移动平台上的应用趋势，他认为值得关注的新特性包括：input 类型 / 属性、audio、video、Web storage、Geolocation API、Canvas 等。

谷歌中国区技术专家丁建宁也介绍了 Chrome 浏览器发展、HTML 5 技术新特性和 Google Maps 等应用。

接下来的会议分成了游戏专场和非游戏专场，由不同领域的专家分享各自的经验。

非游戏专场

掌中宽途开发总监杜亚波和软通动力前端开发主管邱智钢两人合作开发了一款HTML5 的新浪微博应用，并在现场做了演示。移动产品的需求包括跨平台、用户体验丰富和一致，而技术框架的要求则是入门门槛低、开发快速、成本低等。两人以实际的开发经验告诉大家，HTML5 技术满足这些需求，而且做出的产品易于部署和维护。

腾讯的技术专家于涛则以 WebQQ 为例，介绍了 HTML5 技术在 WebQQ 中的广泛应用：

• 动态桌面
• 触控操作
• Canvas 实现的时钟
• 音乐盒子 widget
• Notification
• Geolocation 位置服务
• HTML5 游戏

在谈到如何解决 HTML5 兼容性问题时，于涛给出了代码示例：

soundModeDetector = function(){
if((($B.name==‘mobileSafari’) || $B.safari || $B.chrome || $B.ie) && document.createElement(‘audio’).volume!==undefined) {
return 3; // 以上浏览器的高版本支持 audio 对象播放 mp3 格式
}else if(J.browser.plugins.flash>=9) {
return 1; // 支持 flash 控件
}
else if(!!window.ActiveXObject && new ActiveXObject(“WMPlayer.OCX.7”)) {
return 2; // 支持 wmp 控件
}
else{
return 0; // 一直很安静
}
};

蓝汛公司云产品总监冯广坤从云计算的角度分析了 HTML5 的发展优势，采用 HTML5 技术实现的游戏不仅用户体验高，而且可以通过使用云服务和 CDN 服务显著地降低运维成本，同时提高用户响应时间，不失为 HTML5 游戏开发公司的一条捷径。

口碑网前端开发负责人鄢学鵾剖析了 HTML5 在电子商务中面临的挑战。目前国内对低版本 IE 的依赖性很大，导致 HTML5 技术的普及存在困难，也让开发社区对兼容性的处理感到头疼。在 HTML5 的新标签使用问题上，口碑网的经验是：

• 不只为语义化元素使用额外的 JavaScript 或嵌套标签，但会采用语义思想来命名，如
  。
• 在 JavaScript 依赖性强的项目上大胆使用语义化标签，对用户进行友好提示。

对于 HTML5 的应用趋势，鄢学鵾建议：

• 渐进增强 + 优化退化
• 站在巨人的肩上
• 从 Web Page 到 Web Application
• 提前技术准备 + 尽可能的使用 + 成功案例 + 布道

游戏专场

来自盛大创新院的曹刘阳在演讲中认为 HTML5 提供的新 API 给开发社区提供了巨大的创意空间。在传统 HTML4 时代，Web 开发人员被各种限制所束缚，不得依赖于第三方技术如 Flash，而 HTML5 的诞生逐渐冲破了这些限制，Web 前端开发迎来了新机遇。曹刘阳表示，在 HTML5 中，WebSocket、Canvas 和 Transform（CSS 3）是最具应用潜力的三种技术。他认为 HTML5 的发展对软件工程师提出了更高的要求，一方面是严谨性：

• 代码可读性高
• 健壮性高
• 高内聚低耦合
• 玩转语言特性
• 框架的掌握程度
• 调试能力
• 开发工具的熟练度

另一方面则需要创新性：

• 看到表象，思考实现原理
• 组合旧的 API，思考新的用法
• 思考新 API 的应用场景

HTML5 研究小组的秀野堂主则以实际开发的联机海战游戏为背景，讲述了 HTML5 技术在其中的应用和心得体会。该游戏的亮点在于大胆使用了众多最新的 HTML5 技术：

• 实时、稳定的网络连接（WebSocket）
• 高效物理动作（抛物线、碰撞）（JS 物理引擎）
• 音效处理（Audio）
• 高性能的子线程运算（雷达）（WebWorker）
• 页面效果处理（开炮、航行）（Canvas）
• 实时数据的临时存储（localStorage）
• 离线应用与文件缓存（applicationCache&&manifest）

秀野堂主向大家分享了在使用 HTML5 技术过程中得到的宝贵一线开发经验：

• 在 Win 7 的 64 位操作系统下，所有浏览器都不定时出现 Canvas 绘图异常，调试保存后往往看不到改动的效果。
• 开发基于 NodeJS 的 WebSocket 服务端程序，绝不要使用 Win 7。如果非要用 Windows 操作系统，Win2008、Win2003、XP 都很不错，推荐使用 Linux 环境。
• 非 iPhone 手机浏览器共同的问题——不支持 WebSocket。
• applicationCache 的使用需要做好版本与文件命名规划，否则更新是个问题。
• Canvas 动画制作一定要有面向过程的概念，不能脱离主程序。
• localStorage 吃不消密集读写，会崩溃。
• SSJS 非常好，建议关注。

同时，他还指出浏览器厂商在 HTML5 的支持方面存在“走回头路”的现象，应该提出批评并提高警惕。

超闪公司的两位高管郝克明、彭涛介绍了通过云端运行社会化游戏的情况，HTML5 技术实现的云端游戏带来的优势包括：

• 跨平台——客户端低功耗，结构友好，具有最佳的跨平台结构，能支持大多数的社交游戏。
• 低流量——平均流量 10—40KB/S，3G 和 Wifi 网络均可。
• 低延时——平均延时能够达到 500 毫秒以内。

个人开发者代表施烜则从 Canvas Image、图形预渲染、极速网站、培训教育等四个方面分享了对 HTML5 的看法。在极速网站主题中，他提到 HTML5 技术可以让网站程序化（Web app），就像目前的 Web 游戏一样达到四种标准：

• 永不换页——所有数据请求都在后台处理
• 立即响应——对于键盘鼠标的动作立即响应
• 极速反馈——数据请求 20-200 毫秒返回结果
• 瞬间重启——程序本地缓存并自动更新

施烜认为 JavaSript 将成为最主要的编程语言，HTML5 技术使游戏开发不再昂贵。

本次大会的另一个主要日程是宣布正式启动中国首届HTML5 原创游戏比赛。在启动仪式上，HTML5 研究小组负责人田爱娜、Spilgames 中国区CEO 陈琦和创新工场联合创始人汪华分别做了精彩发言。本次比赛从即日起征集参赛作品，并将在年底公布获奖结果。

感兴趣的读者可以从这里下载本次大会的演讲幻灯片资料，也可以访问HTML5 研究小组的网站和微博来了解大会和比赛的精彩内容。

HTML5 in China 大会圆满结束了，不过 HTML5 在中国的发展才刚刚起航，InfoQ 中文站还将继续关注并报道相关的新闻。

注：HTML5 研究小组负责人田爱娜提供了相关素材，同时本文引用了众多演讲嘉宾的幻灯片内容和观点，在此一并表示衷心感谢。