BT

如何利用碎片时间提升技术认知与能力? 点击获取答案

专访HTML5 Boilerplate项目核心成员——石川

| 作者 赵劼 关注 4 他的粉丝 发布于 2012年3月15日. 估计阅读时间: 14 分钟 | 如何结合区块链技术,帮助企业降本增效?让我们深度了解几个成功的案例。

HTML5 Boilerplate项目是一个出色的前端开发框架,知乎上有一个话题介绍了该项目的特性。在项目的核心开发人员中,有一位华人,他就是石川。

前不久,InfoQ对石川进行了专访。

InfoQ:能否先介绍下您自己,以及您现在所从事的工作呢?

石川:我目前从事的工作主要是独立网络开发,设计自己的产品,写小说,用一年游牧世界。

在过去几年做了些比较公开的开源的项目,包括:

此外,我还受 Packt Publishing 邀请撰写,出版了关于移动网络的《HTML5 Mobile Development Cookbook》 一书。我还为Net Tuts等刊物写一些技术类文章

因为几年为一些国外企业做咨询顾问,积累了些知识,所以在闲暇之余帮w3ctech.com录制一系列 JavaScript,HTML5,Mobile 相关的公开课。

InfoQ:您觉得HTML 5中哪些部分是最重要,如果想要接触HTML 5可以如何着手呢?能否针对HTML 5的常见部分,例如Web Socket,Web Worker等等,提一些适用的场景呢?

石川:因为现在的网络已经大到很难一概而论。所以我觉得应该分为下面几类来说:

  • 应用程序 - Local Storage、Indexed DB还有File API都会对应用程序编写有用。
  • 游戏制作 - Canvas、WebGL适用于游戏制作。Web Sockets对网游特别是MMORPG类游戏很重要。
  • 移动网络 -  就移动网络而言,geolocation API等Device API适用于制作地图、团购类网站。
  • 网页编写 - 对传统信息类网站而言,Semantics和CSS3最为重要。

InfoQ:现在各浏览器及移动平台对于HTML 5的支持程度不一,甚至在国内还有低版本的IE无法摆脱,请问您认为如何在实际项目拥抱HTML 5才是最有效的方式呢?

石川:从技术层面上来说,这个并不是问题。使用 modernizr 一类的工具(包括在HTML5 Boilerplate 中),可以检测某个 HTML5 部分在浏览器本身的可用性。几乎所有HTML5常用的部分都有polyfill (一段代码或插件,提供开发者浏览器本身不能支持、提供的技术)。在 http://html5please.com上面,开发者可以查找想要使用的 HTML5,CSS3 等功能,知道他们是否已经可以使用;若是,可以知道你应该如何使用它们,用什么 polyfills,如果不被支持,怎么解决。从中你也可以知道哪些需要谨慎使用,或者避免使用。如果决定使用,可以使用yepnope来在需要情况下加载 polyfills。

从市场角度,我觉得开发者应该对针对的用户群体来分析要不要使用一个HTML5的功能,如果使用,要不要考虑兼容问题。比如 Facebook 是最早不支持IE6的公司之一,由于他们拥有较大的市场份额,使得他们在一定程度上对想要支持的平台有着一定的主导权。Twitter 选的是中庸之道。他们没有完全取消对较老版本的浏览器支持,但同时在渐进增强 (progressive enhancement)。这样在不影响使用较老版本浏览器用户的基础上,使得使用新版浏览器的用户有更好的体验。Google 选择的是向后兼容(backward compatible), 但是定期提高对各浏览器最低版本要求的底线。

InfoQ:现在很多人把HTML 5在各个浏览器之间存在差异,归结为HTML5规范还没有正式推出。但是回首过往HTML 4正式发布后,浏览器的差异也还是有的。那么HTML5时代是否还是会存在这类问题?也就是说,就算HTML5正式出来了,还是每个浏览器有很大不同。相对于HTML4时代会有好转吗?

石川:从浏览器制造者来来,之前的很大的问题出自于微软的 IE 没有自动更新,而 Chrome, Firefox 和 Opera 都有自动更新。现在微软也加入了自动升级的行列,所以开发者对 HTML5 的发展应该是非常乐观的。

在市场中,大部分的网站是中小型企业以外包形式给广告公司来做的。这个行业中客户经理和顾问的水平参差不齐。在这样的情况下,开发者可能要加强沟通,根据不同客户的背景、要求、技术的革新与项目经理沟通。

InfoQ:请问您怎么看待Microdata? 很多人都说这东西目的是好的,意义是伟大的,但是操作和推广起来有难度(很少有网站愿意去做),您怎么觉得呢?

石川:Microformats 和 Microdata 在前些时候引起过一些非常大的争议。HTML5 Boilerplate 的组员 Paul Irish,Divya,包括我自己在内,认为作为开发者,多数人在实际操作中很少使用Microformats 和 Microdata,我觉得对 Microformats 和 Microdata 有一定的了解是好的,但是不觉得他们是 HTML5 中现阶段的重点。

但是以 Jeremy Keith 为主的很多开发者则提出过不同的观点,他和很多类似的前辈则认为Microformats 和 Microdata 应该得到积极的倡导。认为虽然现阶段存在不足,但是搜索引擎,web crawler,和浏览器可以从网页中提取和处理 Microdata ,并用它来为用户提供更丰富的浏览体验。

个人的结论是如果一个网站是以提供信息为主的,那么对 Microformats 和 Microdata 的使用可能会在未来产生一定好处,仍然坚持认为总体来说,特别是对应用为主的网站则意义不大。

InfoQ:怎么看待Mozilla的B2G,还有HP开源WebOS,还有微软大肆宣传的“可以用HTML 5技术给Win 8写应用”?您觉得基于HTML5技术做系统级别的应用程序靠谱吗?主要障碍会有哪些?

石川:我觉得用 HTML5 编写应用程序完全靠谱。但是各大公司推出的 SDK 就要对针对的用户而论。有些框架过于臃肿,有些则轻巧。总体来说,我觉得用 HTML5 编写是一件好事,因为 HTML5 的开源性,以及整个行业的共享文化,会加速科技的进步而且将渗透颠覆一些传统行业。

主要的障碍会来自开发者对复杂的 JavaScript 编写缺少了解。因为 JavaScript 已经不是一个简单的脚本语言,在它向一门专业的编程语言的过程中,一些对此了解不透彻的开发人员难免会遇到:

  1. 初学者可能对纯 JavaScript 的历史缺乏了解,以为这些框架和工具在 JavaScript 的基础上加了很多层复杂的概念,做了很多改变。
  2. 对于只对 JavaScript 有初步了解的开发者来说,可能学习并不是件容易的事。

InfoQ:目前用HTML5开发复杂应用的越来越多(游戏和应用等等), 但是HTML5以及JavaScript开发一直缺少好用的开发工具,未来这种状况是否能够改善?现在该如何应对这种情况呢?

石川:这个要看工具的定义。现在用于各种语言开发的工具基本分为两种。比如 Adobe 推出的 Flex Builder 和 SDK,前者是 GUI 工具,而后者则是非 GUI 工具。在对比较基础的、重复性的工作上 GUI 确实加快了开发速度。但是真正开发应用或游戏的人在大多数时间还是用 Code View, 而不是 GUI。

目前我们所说的 HTML5 以及 JavaScript 没有很好的开发工具,指的是 GUI 一类的。 其实非 GUI 但是很好用的工具是有的,比如在 JavaScript MVC 方面,工具有backbone.jsSpineSproutCore 等;在 MVVM 方面则有 Knockout JS;在CSS3 UI 方面有Twitter Bootstrap

Juho Vepsäläinenjswiki 对不同的 JavaScript 工具做了很全面地总结。Addy Osmani 也在 Tools For jQuery Application Architecture – The Printable Chart 中很详细列出:如何搭配使用不同工具快速有效地制作出前端应用。

这个对中高级的开发者应该不是问题,是很容易面对的。但是对于初学者来说,就会有较高的门槛。我觉得这个不应该作为让开发者对 HTML5 以及 JavaScript 开发“望而却步”的原因,因为往往太好用的 IDE 会让后来学习的人懒得去研究这些技术的本质。所以抓住机会使用已有工具开发是可以做到有效的,同时也是个学习的过程。

InfoQ:HTML5游戏被讨论的很多,但是很多人觉得HTML5在游戏开发上永远也不是Flash和Unity3D等专业游戏开发工具/技术/引擎的对手,您怎么看?HTML5的安全性和源代码开放性是否适合网页游戏开发?它在哪些领域将可能取代Flash?

石川:跟欧美的开发者相比,国内 (或者说亚洲包括韩国)的 HTML5 开发者比较把注意力放在网游上,这当然与中国的特殊市场环境有着一定的关系。早在 HTML5 之前,因为知识产权及盗版等问题使得国内的游戏开发者将大多数的游戏开发精力放在网络上,现在 HTML5 的出现使得网络游戏有了新的开发平台。

我觉得短期内,HTML5 不会取代 Flash 。Adobe 目前决定将 Flash 的重点放在游戏的开发上,这无疑是出于市场考虑 (缩小范畴),Flash 孤注一掷在游戏上。但是 HTML5 肯定会扩大市场。现在已经有比较不错的工具比如LimeJS (免费), impactjs(商业)等。在 3D 方面,和 Unity3D 比,HTML5 的工具还有一定差距,但是随着 WebGL 的发展,可能会在未来拥有一定市场。

前些时候独立游戏工具制作者 Game Closure 因为在Google I/O 2011 时展出了他们的游戏工具半成品,之后拒绝了Zynga 收购而备受瞩目,Game Closure 推出了一系列的工具为游戏工具铺路:

  • js.io - 建立实时应用程序的 JavaScript Networking 库
  • webgl-2d - Canvas2D API in WebGL
  • hookbox - 一个Comet 服务器
  • orbited2 - 在每一个浏览器都可以使用

WebSocket开发者之一 @louisstow 刚刚(2012年3月11日)在他的博客文章上写到关于 Game Engines 的想法。

关于安全问题,在使用 Local Storage,Web Messeging 和 WebSocket  时,有一些需要注意的事项,比较具体的可以参考 Open Web Application Security Project (OWASP) 的文章。但由于大多数浏览器的及时升级,这些应该不会影响到开发。


石川的微博是:http://weibo.com/shichuan5,他的博客地址是:http://www.blog.highub.com/。欢迎大家关注石川和HTML5 BoilerPlate项目。

评价本文

专业度
风格

您好,朋友!

您需要 注册一个InfoQ账号 或者 才能进行评论。在您完成注册后还需要进行一些设置。

获得来自InfoQ的更多体验。

告诉我们您的想法

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我
社区评论

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

讨论

登陆InfoQ,与你最关心的话题互动。


找回密码....

Follow

关注你最喜爱的话题和作者

快速浏览网站内你所感兴趣话题的精选内容。

Like

内容自由定制

选择想要阅读的主题和喜爱的作者定制自己的新闻源。

Notifications

获取更新

设置通知机制以获取内容更新对您而言是否重要

BT