AlloyTeam Web 2017大会总结

17年10月29号有幸和同事参加了腾讯AlloyTeam Web前端大会，这是我参加过干货最多的一次大会。趁现在心情还未平静，想记下参加这次大会的感受和学到的知识。

AlloyTeam Web 2017议程

面向亿万级用户的Web同构直出

大型Web项目可用性提升 - 零脚本错误的实战

如何构建后现代前端工程化开发体系

Javascript与机器学习的前世今生

高效H5动画设计与性能优化

ES2017时代的后函数式编程

如何把自己构建成大型互联网公司需要的前端人才

AlloyTeam 不只是前端，更是“全端”

参加这次会议我最大的感受就是：腾讯前端团队真是人才济济，不愧是汇聚国内最顶尖的人才的团队。本以为前端大会，大概也就讲讲html、css、javascript。但是完全错了。我参加的5个主题，就只有大型Web项目可用性提升 - 零脚本错误的实战和高效H5动画设计与性能优化比较接地气，其他的都是涉猎非常广泛的知识，用“全端”来概括这次大会更加贴切。

特别是人工智能，人家涉及的是神经学习、量子计算，而我还在苦苦纠结IOS和android的兼容性，屏幕适配。唉，人比人气死人。别人走得比你远，还走得比你快。不过能接触这些人也是一笔很重要的财富，知道自己还有很多前进的空间。还需更加努力，至少比以前的自己要好。

前端的同构直出

前端的同构直出这个概念还是第一次接触。直出的概念其实早就存在，就是以前的前端服务端渲染，最开始的ASP、PHP渲染页面是一个意思，但是同构直出是node.js出现之后才能看到的概念。同构得益于前后端都是javascript，前后端可以写一套代码，两端复用，能极大地提高开发效率。

先说下历史，web1.0版本的时候，都是后端代码计算渲染拼接html字符串并且传给前端，输出页面。ajax技术的面世和v8引擎的普及，web2.0时代主流是前后端分离，后端只负责数据服务，所有逻辑交由前端处理。首先前端拿到index.html。渲染后异步加载所需资源并且渲染。而下一代web开发模式很有可能就是这次大会接触到的web同构直出：前端js同时执行在前端和后端，由后端node.js来渲染首屏页面，直接向浏览器输出完整的首屏页面。这种写法结合了第一代后端渲染的优点，和第二代前后端分离的思想结合起来，达到最优web体验的目的。

但是这也有一些不足点地方：

1. 极大的增加了后端服务器的计算能力
2. 增加不少前端开发的门槛
3. 前端调试可能会比较麻烦，（以前php有过类似体验，但是不敢确定同构指出是否会有）

优点提升并不明显

1. 提高网页seo。（但是现在Google爬虫已经支持js异步渲染的页面，声称百度也已支持）
2. 提高首屏加载速度。（还得看情况，如果后端计算资源不足，渲染速度也不一定比得上前端渲染）
3. 为移动设备省电。。。

总的来说，想要在人力有限的创业团队大规模使用同构直出开发前端页面，我觉得有很大的困难。只希望以后能有那位大大再开源某些库能解决这些问题，同构直出的春天才会到来。

关于同构直出还有一个很重要的知识点就是容灾。

在后端计算资源增加很多倍的情况下，还要让同构直出服务足够的稳定。需要一套良好的容灾设计。

大会的方案，利用反向代理服务器来处理负载均衡。如果在同构直出服务器压力很大或者崩溃的情况下能把请求转接到普通的静态资源服务器，这样网站服务还能和正常网站一样运行，只是没有直出服务而已。

最接地气点，错误上报及处理

错误上报处理应该是大会里的几个主题里比较常见，应用比较广的功能。但是平时开发几乎没接触过错误处理的我，觉得讲师提供的方案还是很值得参考的。

现在前端为了加快资源加载速度，都会把js代码合并压缩后再部署上线。这时候上报的资源往往不能指到具体哪一行代码出了错，这样错误上报也没有意义了。但是又不能妥协不压缩代码。压缩代码的过程中产生的sourcemap文件体积过大，也不能为了妥协而把sourcemap一起部署上线。

所以，大会给的方案是：把sourcemap文件和错误上报的信息都放到错误处理服务器上。在错误处理服务器上把上报的信息，结合sourcemap解析出对应源码错误的位置。

另外大会提到点sentry，是市面上这方案做的比较好的。但是现在我业务重点不在这，只能有时间再去研究。

倒是业务根据业务需求和大会带来灵感。倒是觉得alloylever比较适合我当前的业务。

工欲善其事必先利其器

额，相对来说，这个讲师讲的内容比较水，大部分都是在推广自己的开源项目。估计不会用到。但是有一点我深有体会，就是工欲善其事必先利其器

我也觉得我当前最影响开发效率的一点是，定制开发没有很好的工程化，平台的开发环境也不是特别友好。一开始的时候嫌麻烦，总是一再妥协，用麻烦的方式开发—-在test环境上开发，在正式环境上测试。。。以至于把大量时间浪费在开发环境上。

总结来说，我觉得我也有必要来一次“百日维新”：

1. 熟练使用git、gitx、iterm2、webpack等开发工具
2. 完善开发环境，强力要求不同环境要有同样环境的接口。避免不同环境不同表现的问题。
3. 在正式环境埋彩蛋。
4. 完善脚手架、完善文档

js的未来

能用js来编写的终究会用js来写。

当前的风口—-人工智能当然也不会错过。

这门议程是最最高大上的一门，没有之一。所以基本上不会在项目中使用。

在这门讲座中震撼我的是腾讯团队真的什么人才都有。真正的大牛不仅学习深度比你深，广度也远远超出普通人。而且，最怕比你强的人还比你努力。这位讲师也只是嗅到自己平时使用的js也能涉猎人工智能，就闲暇时间自己买了书自己研究，不耽误工作的情况下还能往自己感兴趣的方向深入，这才是最可怕的人。。。

当然和AlloyTeam的顶尖人才比就是鸡蛋碰石头，达不到大牛的高度，自己也要努力创造我自己的新高度。不能比他们强，至少要和他们一样努力。

花了8k买的新电脑，不能浪费了，周末要赶紧去咖啡厅图书馆装X。

真正能把前端变成全端的Service Worker

Service worker提出的概念并不久，和Service Worker相应的技术是PWA（progressive web app），也就是渐进式web应用。