Facebook工程师谈前端：去框架化是趋势

个人简介 Hedger Wang现任Facebook资深前端工程师。自2011年加入Facebook后两年间一直从事手机Web平台研究与系统核心开发的工作。最近的工作中心则转向于一线产品开发，专注于桌上型富用户端程序的开发。在加入Facebook以前，Hedger亦曾经分别在Yahoo! (2004 - 2008) 与Google (2008 - 2011) 担任前端工程师，对于不同的技术平台与产品开发，有累积相当的经验。

QCon是由InfoQ主办的全球顶级技术盛会，每年在伦敦、北京、东京、纽约、圣保罗、杭州、旧金山召开。自2007年3月份首次举办以来，已经有包括传统制造、金融、电信、互联网、航空航天等领域的近万名架构师、项目经理、团队领导者和高级开发人员参加过QCon大会。

   

1. Hi Hedger。

Hedger：你好。

   

2. 欢迎来到QCon全球软件开发大会上海站2013的采访间。首先能请您先简单介绍一下自己负责的工作吗？

Hedger：现在负责的是广告部门的前端的广告投放的平台的开发，主要就是一个服务广告用户的客户端。用户来到这边，可以通过这个系统去动态的去编辑产生一些广告，然后去维护管理，主要是这样的东西。这是我今年开始的专案，在之前的话主要是一直从事行动网站的开发，大概做了两年多，这主要是在Facebook部分。

   

3. 你们的团队大概是什么样的规模？

Hedger：规模的话，其实我们主要是依照专案为主，那一个专案遇到时间的长短，不过，正常情况下大概的话是三到六个月。一套专案的情况，你会有不同的脚色，工程师、设计师、产品经理跟项目经理。专案结束之后，你会有其他的专案，每个专案它的来的人的组成都会不太一样，并不是说依照部门去决定，而是依照专案来决定。在我目前这个专案的话每天有直接接触的工程师，应该是六到七位左右，这是只前端工程师的部分。基本上与后台工程师基本上没有需要直接互动的地方，主要是因为我们用的全都是API，我们开发产品，全部都是基于API的东西。这要提一下，所谓的前端工程师，在我们公司是比较广泛的，就是泛指任何的工程师只要拿到资料之后，负责把资料呈现出来的人。所以你用的语言不限于一般常见所谓的JavaScript，还包括在Facebook大量的PHP。那我之前的工作经历的话，我之前在加入Facebook之前，我在Google做了三年半。那很有趣的事情是，JavaScript是我用最少的语言，大部分语言是Java跟C、Python，可是即使那样的情况下，我的其他前端工程师，因为我的工作内容还是一样，把我要的资料找出来，然后以符合产品跟设计师需求的方式把它呈现在用户面前。

   

4. 是不是可以理解为数据库以上的东西都是前端工程师负责？

Hedger：API以上。你要去直接碰到数据库的话，基本上来说那是一个比较不实际的东西。在比较大规模的话，经常来说，你不应该也不需要直接去存取数据库本身，你只需要有合适的API，然后能够让你提供合适的资料，让你资料读写。那至于说，那下面所有的底层叫做服务端，Service Layer。

   

5. 是否因为Facebook已经有一个比较完善的API系统，所以它是这样一个构成？

Hedger：整个设计思路是这样。我之前在Mobile，是行动部门的Team。我是属于Core Infrastructure，就是核心的架构团队。就是基本上我们做事情是，我们开发工具，让别人可以拿这个工具快速的架构出行动网站。那本质上来说的话，公司并没有特别去区分说，什么样的工程师要去做行动网站，什么样的工程师要去做桌面上的网站。应该是所有的工程师都能够用现有的工具去建构出你所要的，不管是桌面上也好，或者是说行动端的也好。实际上工程师中的确只有少部分的人是专属于前端工程师，因为在所有的用户端有很多奇奇怪怪需要特别去优化的一些东西，必须要大量跟设计师互动的东西，去优化，他需要一些特殊的技能，那这些技能前端工程师比较擅长。因为通常来说设计师本身他有四项基本职能：第一个就是色彩，第二个是形式，点、线、面这种形式，第三个就是资料架构，就是如何抽取合适的资讯，把它呈现在页面上，这需要相当的一个抽象规划过程。还有就是所谓的互动的流程跟逻辑，如何去完成一个购物的设计。那其中包括了资料呈现，以及互动的逻辑本身，这是由前端工程师去建构出来。前端工程师还做了很多其他的琐碎的东西，包括了相容性，还有性能。不过呢，相对工程师数量来讲，前端工程师相对来说是比较少数的，因为大部分的工程师他们本身都能够掌握前端工程师他们开发出来的工具，比如说我们开发核心的组件库，其他人只要用，开发出来核心组件库，他就可以很容易的去做。我今天有个选单或者是有个按纽，他能够确保这个东西在不同的环境下面，他会有正确的样子，这样呈现是这样的东西。

   

6. 所以前端工程师、设计还有产品就是PM——你们有PM吗？

Hedger：有。

   

7. 大概是几比几？

Hedger：取决于产品本身的复杂度。因为Facebook是工程师文化非常强的地方，很多的产品基本上来说，很多的功能基本上他们有产品经理。但通常来说，当事情复杂到一定程度，就是他需要三名以上的工程师，一到两名的设计师的话，通常这个时候依照产品本身结构，需要一个恰当的产品经理。产品经理他主要的工作在于协调以及规划事程，安排事程，去确保内部有足够的资源，沟通管道能够顺畅，然后产品能够顺利的上线。然后如果说比较需要做更多外部的事。以广告系统为例，你要去跟大量的行销部的、业务部方面去协调，这个产品经理要去做处理。尤其是还要包括对产品本身的瞭解，他能够非常熟悉。

   

8. 那么可以谈谈目前JavaScript主要的这个大的方向，你觉得这个包括你刚才也比较了一下React JS，它们都有哪些区别吗？

Hedger：JavaScript主要的方向我目前注意到主要是有几个，一个就是所谓的去框架。最原始的JavaScript是没有框架的，工程师来了，就是写一段页面执行就没事了。但是你可能有五六十个更多的工程师东西写，每个工程师这样写的时候这个世界就混乱了，产生大量的错误。于是有人跑出来说，好，那我来一个大框架好了，我这边是一个Google，我是一个雅虎的YUI，我是一个淘宝的Kissy，他们都有各式各样的框架。框架有了，也是通过框架显现的时候，整个JavaScript它本身秩序，还有规范都定义下来，这是算所谓的中期。但框架还有个问题，就是框架之间彼此不相容，框架本身有自己独特的命名规范，有自己独特的方式去采去定义一些基本的东西。比如说你如何去创建一个Class，你如何让Class去做集成，你如何去产生一个组件，类似这样的东西，他们有不同规范。每个框架各有各的长处，有大的框架，有小的框架，这种语法是不相容的，通常情况对一个稍微比较大一点的公司来说，倾向于开发自己的框架，框架之间只有走到大而全。然后现在代码开始变得去框架化。去框架意思是说你应该让开发者开发所谓的微框架或者小框架，然后呢让它们之间能够彼此相容，然后你竞争去采用比较好的东西。因为这个想法出来，JS，比如说最简单的东西，你要去做跑一个回圈，像这种基本东西，他有非常非常多的不同之处，有复杂的，有简单的。通常希望是你总是能够在一些开源的环境，比如Github能找到你要的东西。然后你透过JS规范化的话，它非常大量的东西，你怎么去做，而且彼此间互不干扰。即使这个东西，你要是没有，你总能找到你需要的。你不需要说碰到一个问题，譬如说YUI里面没有，那你就完蛋了，为什么？因为这个东西，这些所谓的大方向，他本身是封闭的，去框架这是第一个；第二个就是说，JavaScript它越来越变得一个所谓的共用的语言，像以Facebook来为例，我们用的是ECMAScript 6版本的JavaScript，但是你要知道是ECMAScript 6有很多我们觉得非常好用的东西，实际上在浏览器里面是不相容的。所以实际上虽然是同样的JavaScript，但它还是有不同的版本。那实际上在部署的时候，我们会把JavaScript通过转译的方式，转移到他能够实际上在浏览器里面运行的方式运作。这个最大的差别就是什么呢？就是说Class本身它可以运用一些比较高级的语言技能，这个东西本身就是比较高级的JavaScript语言特征 。但最后在执行阶段的时候，他都会被转译成所谓可以执行的JavaScript，就是Google所谓的DART。这样他本身在现阶段来讲，他也是转移成JavaScript。在Facebook 比较有趣的是，通过对标准的探讨跟研究，然后我们去定义规范这些你可以去使用的高级的语言特性 。然后在实际上，浏览器执行的时候它是执行一个被转译过的版本。这样子有个好处就是说，开发者第一个他可以还是用所谓的标准库，但他可以用一些比较高级的东西，他不需要手动去做一些比较烦琐的东西，看语言看起来比较精简。我认为这个长期方向应该是这样的方向，就是说JavaScript本身，它很多所谓的大框架，基本上是会逐渐产生一种崩溃、会被废弃的状态。因为他基本上来说，leaky abstraction，是没有任何一个抽象是能够试图去照顾到所有的使用状况。第二个是这个语言本身它是逐渐在进化的，它进化需要有一个规范，那规范这个目前来讲是依照去定义的机会。你必须能够去使用这个东西，他能够在浏览器端能够适当的解析，这是我目前采用的方法。我可以看到长期来讲，目前来讲，JavaScript有一个说法如果一个东西，他可以被JavaScript写成的话，那么长期他终究会被JavaScript写成，我常常看到很多案例就是，谁谁谁又把某一个游戏，本来是本地端执行的，他用JavaScript写的。就是说最近你上互联网看到的是，有人把早期的作业系统，比如说Windows是Mac OS7JavaScript写，然后在JavaScript上运行。你如果看到像Mozilla或者Chrome的话，它本身也有类似的东西，比如Mozilla他有叫ASM，也是一样，它是一个JavaScriptu子集，那基本上本身来说，这是通过一些开源的工具，比如说，你可以把一些C++写的东西，然后编译程成为JavaScript，然后它产生出来的是非常非常高效的。像这样编译出来的JavaScript，它基本上让解释的性能甚至可以达到90%，相当于C++写出来的代码，是这样。

   

9. 其实像您刚才提到的这个过程，它的标准统一其实是一个非常困难的事情，现在其实包括HTML5标准，几个浏览器之间都统一不了？

Hedger：JavaScript本身它的标准，你要说标准我们一直是这样，这个它非常难以统一。一个是它有非常多实验的东西，你如果去看的话，很多东西基本上它是所谓的Draft，就是一个草案。比如说Google本身就非常执着于产生这种新的草案，比如JavaScript语言它在Web上面它有些包括了一些API，Video的跟游戏相关的，比如说最近提出的Web，可是这所谓的Draft它都有一个特色是什么呢？它并不是一个天马行空的一个标准说，我就是要有这样的一个东西出来，那浏览器本身没有，那没有关系；还有个特色是，尽可能让这些标准今天就可以使用，但是他怎么做到呢？我举个例子，比如说HTML5，它有很多语言的过程，比如说它有个标准方向，比如说Array.map，Array.recuce这些东西，没有怎么办？你可以去把它添加上去，这是语言的高级特性。但是这个在JavaScript旧的版本里它是没有的，你今天可以去监测到用户端是否这个东西，让你把它添加上去，写好的话，你就会使用这些所谓的新的标准。就性能上来讲，它性能并没有好到哪里去，甚至来说还是糟糕的。但是它有个核心的概念是，你今天就可以去使用它，那有更多人去使用它的时候，你可以想到是有一天，可能是快则几个月，慢则是数年之内，一旦浏览器它本地端开始支持之后呢，就会使用。举一个简单的例子，比如说Web的API，Html的API你如果先去看浏览器做的话，早期它都是有加开发商的名，前面都是有加开发商的名字。比如，你去做到比较新的版本，他都把那个开发商的名字都拿掉了，JS是一样道理。基本上情况就是说会有很多时间性的出来，会有很多相关的库能够去把这个，把他们之间的那个漏洞把它填补起来，尽量让开发者今天就可以使用，因为你通过使用你才可以得到回馈、反馈，才会知道说，你才会瞭解到，这个东西到底是不是一个恰当的一个编程的一个API的一个形式。如果可以的话，很快的你就把它直接套用在浏览器里面。其实浏览器本身演进都是相当相当的快，它们更新的周期大概是三到六个月，就会有一个新的东西，所以这个方面我基本上是还蛮乐观的。

   

10. 那么像您这边讲到的这个React JS，它是什么时候开始在Facebook用的？现在是一个什么样的应用情况？

Hedger：真正开发大概是两年多以前。一开始其实有一位工程师，相当长的业余时间自己捣鼓出来的。但是我们内部同事有很多其他不同的，一直在每个人都有自己的偏好，大部分的工程师甚至还是喜欢自己去捣鼓自己出来一个，然后自己用，最大的困难是你如何去说服别人说，证明以后这个东西有用，那经过相当一段时间之后，React JS是被大多数的工程师觉得这个东西是可行、可用，而且受到相当的支持。大概四个月前我们把它开源，然后放到Github去。目前的使用，基本上大部分的广告前端都是用React JS写作的，Facebook本身产品的话在Mobile，还有在桌面的部分，一些主要比如选单， 一些用户输入的控件都是React写的。Facebook之前购买了Instagram，它的前端全部都是客户端全都是React JS写的。一些公司，比如说有叫Khan Academy，网络学院，之前是用Backbone，后来用了React。它的版本现在是0.5，所以我可以说它是一个比较实验性的阶段，但是也是实验性的阶段，意思是说它的API可能还会有改动，有些名字我们觉得太长了，我们会把它缩短，会一些特殊的开发需求，我们会加入。比如说我们一直想在动画上面去做一个比较完善的支持。但是本质上来说，它已经在使用在产品面，并且比如说广告是这家公司维护，Facebook维护生成非常重要的，那我们用广告前端都是用React来做。

   

11. 那还是前端应该至少应该要看看这个东西才行？

Hedger：我觉得因为我做前端做了蛮多年了，因为我从04年开始在雅虎工作，一直到现在，一直都做前端。用过非常多不同的语言，然后不同的平台，服务器端也好，用户端的也好。还有再比如说在本地端做Android方面，我也可能，所以我觉得非常非常有趣的一个东西，我个人觉得这个东西非常乐观，我只能这么说。我大概之前有在网络上看过，好像国内对前端这个东西好像有点比较消极，我觉得很大部分并不是前端这个东西出问题，很多东西是组织架构，组织架构还有文化方面。我举个例子，在硅谷前端工程师是最缺的，你很容易找到一般工程师，但是最缺的，除了一些比较专门的人，比如大数据工程师，还有iOS工程师之外，前端工程师非常缺乏的，在发展待遇方面都是非常好的，那我自己是比较看好，为什么？因为从我开始做这行开始，基本上我可以看到这个东西从无到有，截至到目前为止，可以看到很多新鲜的东西，有些前端工程师自己去开发出来，去演变出来，我看不到这个东西的终点在哪里，我就觉得每天做这个非常有趣。