tmallfe / tmallfe.github.io

天猫前端
http://tmallfe.github.io
3.93k stars 508 forks source link

新书《跨终端 Web》 #2

Open luics opened 10 years ago

luics commented 10 years ago

鬼道的新书《跨终端 Web》开始预售了。本篇是三七为本书写的推荐序,已将“跨终端 Web”的由来说得比较清楚了。提供了本书的样章 ,欢迎鉴赏。

如果本书可能对你或你的朋友有帮助,可以:

  1. 转发@鬼道-徐凯的置顶微博,转发楼层号在 Fibonacci 数列中的同学获得一本《跨终端 Web》, 没有上限(活动在95楼截止了,楼层号太难数了...)。
  2. 样章:《跨终端 Web》第一章 勘误
  3. 《跨终端 Web》视频:概述基准接口 @ADC-D2 & W3CTECH

预售 | 勘误

推荐序

2012年底,我从云OS运营团队转岗到天猫前端团队,之前和手机硬件厂商、Mobile OS及App市场的合作经历让我重新思考前端的未来和电子商务的技术方向。除了在天猫内部实践基于移动优先(Mobile First)的设计研发外,还和infoQ合作把QConbeijing 2013的前端议题定为“跨终端Web”,于是就有了采访稿《从可编程到跨终端——QCon北京2013“跨终端的Web”专题出品人鄢学鵾专访》 ,阐述当时的认知和想法。现在“跨终端Web”已经诞生一年半了,鬼道同学把这些想法和实践都编写成书实在让人惊喜和敬佩,我有幸成为这个成就的见证人,并再次有机会和大家谈谈跨终端Web的初心和思考。

1991年诞生了World Wide Web、HTTP和HTML,1995年诞生了JavaScript、Java和PHP,1996年诞生了CSS,1998年CSS2.1正式发布,1999年CDN诞生且HTTP1.1和HTML4.01正式发布,2000年ECMA-262 3rd正式发布,2001年IE6发布。作为Web开发者和前端工程师的我们应该对这些大事件相当不陌生,但如果你仔细看看这些年份就会发现我们所使用的绝大部分技术和方案都比IE6老。在那个时期没有真正意义的前端,常见情况是美工切图,后端嵌套模板,也没有所谓的前端架构,前后端的发布机制几乎一样,那就是门户盛行的时代,Yahoo、新浪、搜狐和网易当道。

IE6是第一轮浏览器大战的胜者,垄断式的胜利直接导致Web基础设施至少10年的缓慢发展,标准的意义也就不那么明显了。其实1994年就有了W3C,但民间为了解决W3C面对浏览器厂商不给力的混乱状况于1998成立了WaSP(The Web Standards Project),其中一个创始人于2003年发表了影响力巨大的著作《Design with The Standards(网站重构)》,当然在中国产生了估计作者都没有想到额外影响,那就是出现了重构工程师。2004年Firefox 1.0、Gmail和Google Sugguest发布,2005年AJAX横空出世和Google Maps发布,2006年jQuery和YUI发布。这些事件的到来显示出了低成本的Web在跨浏览器上巨大威力和人机交互的显著改善,导致当时互联网99%以上内容都是使用Web来呈现,所以对于当时绝大部分人而言,WWW就是互联网。巨大的需求导致Web开发的规模化和专业分工,这就是前端工程师开始出现,并大量集结于以Web业务为主的互联网公司的原因。

我们可以称这个时代为前端工程师1.0,比如在Google、Facebook、Yahoo、阿里巴巴、百度、腾讯等公司中,前端团队小有规模且以Web开发为主,此时的前端工程师们大量使用HTML、CSS、JavaScript开发基于桌面浏览器的网页和应用。这个时代的前端工程师主要具备三个方面的能力,一是跨浏览器的兼容能力,需要理解渐进增强和优雅退化的思想,深入Web标准并结合环境数据制定GBS (Graded Browser Support 浏览器分级标准);二是富交互Web的开发能力,能够基于甚至开发JavaScript库去实现人和机器的复杂互动;三是性能优化能力,实践表明前端占Web 性能80%,类似CDN和按需加载等各种性能优化方案深度地影响了前端架构和发布机制。

虽然今日市面上大部分前端工程师招聘条件还是基于前端工程师1.0的,但我们的环境自2007年iPhone发布起就在悄然却快速地变革,我们可能是家里唯一使用电脑的那个人,而手机在吃饭、走路、约会、上厕所等等时都已经成为不可或缺的陪伴。当我还在云OS做运营时便学到了一个令人震惊的发现:人类发展五千年到现在的最大共同点可能是每人都有移动智能设备。人们已经处于各种各样碎片化的智能移动设备上,这些设备有触摸屏、相机、麦克风、陀螺仪、加速计等等特性使得人同机器交互的方式发生了巨大的革命,更重要的是它们都和网络连接没有了离线状态。于是,当一个人在大街上看到奇闻异事随手用手机拍下来并发到微博上,TA的朋友可能在手机、平板电脑或普通电脑的微博上看到并转发,也可能被TA的朋友转到微信或IM等等,TA朋友的朋友同样可能在手机、平板电脑或普通电脑的另一种软件上看到这个信息,更甚至信息被电视媒体或平面媒体发现并造成更大范围的传播,更多TA不认识的电视或平面媒体通过扫描报道时的二维码又找到TA的微博,这一切可能在瞬间完成。这个小场景告诉我们人和信息是在智能终端(Phone、Pad、Desktop、TV等设备)、软件终端(浏览器、SNS、IM等应用)和传统终端(电视、广播、平面等媒体)间交叉流动的,这是一个去中心的网状结构,也是互联网的本质特性,所以跨终端不仅仅是跨越设备(device)更是跨越人机交互的场景入口(end)。

面对这种终端碎片化的潮流,前端工程师怎么办?解决方案就是基于最重要的前端开发思想渐进增强和优雅退化得出的移动优先:一是毫无疑问绝大部分用户已经或正在成为智能设备用户,我们要为80%的目标用户服务;二是专注于核心业务需求,人的本性、业务本质和商业模式本质基本上不会随着终端改变而改变,所以相同业务在手机、平板、桌面和电视上呈现的本质和商业模式不会有不同,小屏幕终端是我们重新思考业务本质和核心人机交互流程的机会,其挖掘出的本质会改变其他终端;三是针对未来人机交互,现在移动设备引领人机交互的变革潮流,通过必备特性虚拟或增强现实,并逐步引入到桌面和电视等等设备中。所以,选择哪个具体技术方案,是响应式Web,还是服务端响应式Web(URL不变,通过服务端在不同设备展现不同模板),还是多个URL Web(不同的终端不同的URL),还是Hybrid应用(Native和Web混合使用,比如iOS App Store一直就是引用壳里面套个网站),还是Native应用,是依据业务本质、人性需求和人机环境趋势来综合判断的。由于Web的本质特性就是低成本跨平台但对设备先进特性支持不够,而Native应用能够充分利用硬件先进特性但受限于系统平台,导致开发者没有发布能力,所以大多数情况下,可以把跨终端Web作为默认选择。

在跨终端的时代,渐进增强和优雅退化依旧是最重要的前端开发思想,但前端工程师们不能像以前一样仅仅固守在Web上,Web和客户端应用的融合已经成为必然,Web从页面(page)到应用(application)反应了人机交互革命带来新的体验趋势,客户端和动画开发成为了前端工程师的基本功。移动优先的跨终端解决方案核心是一套数据有多个高品质低成本展现方式, 这促使前后端分离成为必须,前端工程师不仅仅要关心客户端环境也要关心服务端环境,所以GBS需要升级到GTE(Graded Target Environments,分级目标环境),工程师更关注端到端的数据接口约定(比如正文中的IF就是这种思想下的一种实践方案),这会彻底改变前端的开发方式、架构和发布机制,也会导致前端团队快速膨胀直到前后端比率趋于一致。这是一个巨大的挑战,也是一个前所未有的机会,更是时势的要求。我把这个时代叫着前端工程师2.0。

这篇推荐序被我拖延了很久很久,结尾之时恰逢鬼道同学入职天猫一周年,就拿老乔的话来zhuangbility一下:“你如果出色地完成了某件事,那你应该再做一些其他的精彩事儿。不要在前一件事上徘徊太久,想想接下来该做什么。”这应该是最好的礼物之一。

三七 2014.4.8

推荐词

woiweb commented 10 years ago

赞一个。

imsobear commented 10 years ago

斐波那契,哈哈,有意思~

luics commented 10 years ago

@cuebyte 请微博私信我姓名、邮寄地址、手机,会给你寄过去,我的微博 @鬼道-徐凯

lan13ji commented 10 years ago

现在出售么?

luics commented 10 years ago

@lan13ji 有售 http://www.amazon.cn/dp/B00L2IAC1Q

yxlogit commented 9 years ago

书不错,现在来可以送么^_^

luics commented 9 years ago

@yxlogit 欢迎,入职送书哈。

frozendeath commented 9 years ago

书已购,非常赞,求签名 :-)

Lincoln-xzc commented 9 years ago

赞一个

billgo commented 8 years ago

是不是应该来一份呢