从淘宝前端工程化演进，看工程化之路如何“私人订制”

随着前端开发复杂度的日益增加，各种各样适应业务的组件框架也层出不穷。同时，我们面临业务规模的快速发展和工程师团队的不断扩张，Web 业务日益复杂化和多元化，前端开发已经由以 WebPage 模式为主转变为以 WebApp 模式为主了。现在的前端项目，再也不是过去那种切个图 + 搞几个 jQuery 插件就能实现业务所有功能了。工程复杂性越来越高，同时也伴随更多的问题出现，如何进行高效的多人协作？如何保证项目的可维护性？如何提高项目的开发质量？

这个时候就出现了前端工程化这样一个概念，希望能在日常开发中制订一个规范化的前端工作流，很好地规范统一项目的模块化开发和前端资源，让代码的维护和互相协作更加容易更加方便，令前端开发自动化成为一种习惯。同时，让大家能够释放生产力，提高开发效率，更好更快地完成团队开发以及项目后期维护和扩展。

从前端工程化的成熟度来讲，一般一线大厂的进化程度较高，这些都是由业务增长推动团队和技术不断进化的。当你每天处理的业务量越来越多，加入项目的人数不断上涨，那么就急需一套规范化的工作流程，来提高工作效率。为此，GMTC 全球大前端技术大会对来自阿里巴巴的高级前端技术专家朱华军（花名：阿大）老师做了一次采访，他专注于研究前端工程化领域，推动开发工具、流程和规范的统一，完成淘宝近百人前端团队研发模式的整体升级，请他来聊聊淘宝的前端工程化演进之路，希望对各位有所启发，以下为采访内容：

阿大：我真名叫朱华军，在淘宝每个人都有花名，我的花名是：阿大！2009 年加入的淘宝，2012 年之前主要负责线上业务前端技术部分，之后开始专注前端工程体系的建设，目前负责阿里巴巴集团前端工程中台，致力于提升前端的研发效率和研发质量，降低前端研发的协同门槛和投入成本。

阿大：前端工程化在不同的阶段是可以有不同理解的。如果就一个人开发，用一些工具来提升自己的开发效率，这是工程化最初的阶段（工具化）；慢慢开始有多人协同开发的时候，大家需要约定一些规范，所有人都需要遵守，这是一般规模团队的做法（规范化）。当协同规模再大一点的时候，一般 20 ~ 100 人左右，规范的落地就变得没那么容易了，通过一个流程的方式来保障规范的执行就显得尤为重要（流程化）。当协同人员数量到几百甚至上千的时候，就会形成一个一个的小技术圈子，开始出现能力的重复建设和内耗，这个时候就需要对日常研发过程中的所需能力进行分层，抽象出来的基础能力通过某个平台来承载，其它业务或团队定制部分基于抽象出来的能力进行二次开发（中台化）。

工具化——规范化——流程化——中台化是不同团队规模阶段的不同工程实践方向。虽然小规模团队没有必要去搞一个工程中台，站起来喊一嗓子就能高效解决地问题，但是可以通过制定规范和使用流程有效地提升协同效率。即使是个人，也可以通过合理的使用工具，极大地提升个体效率和质量。我想这就是工程化思想带给前端最大的价值吧！

阿大：淘宝前端的工程化路径其实就是工具化，规划化，流程化这一演进过程。大概 2011、2012 年左右，基于 Node.js 的命令行辅助开发工具开始流行起来，团队内开始出现各种命令行工具，不过这些工具属于民间开发，没有统一的使用方式和长期的支持。然后团队就开始组建专门的工具小组，所有民间工具收归到一个官方命令行工具。这个官方工具提供一定的扩展能力（一套插件机制），这样不同的业务形态工具（比如支持无线 H5 开发的工具和支持普通 PC 开发的工具）可以在统一的工具下通过插件的方式实现。工具底层统一提供异常收集、插件更新、跨平台平台兼容等基础能力。在规范研发工具的同时，团队还出台了内部研发规划。不过在实行一段时间后发现规范的落地是一个蛮大的问题！同时，团队开始关注日常研发效率和质量。但是仅仅通过工具没有办法获取相关的数据，这个时候研发流程的建设就被提上了日程。如果本地工具负责的是代码提交到仓库之前的工作的话，那么流程就是负责代码提交仓库之后的事情了。这个时候我们建设了三个平台：云构建、门神和研发流程平台，云构建是一个在线构建逻辑管理和运行平台，构建器（构建逻辑的 NPM 封装形态）和基于 Docker 的任务运行容器集群是云构建的核心技术。门神是一个代码检查平台，前端规范部分就是靠它来落地的，比如编码规范检查，代码注释检查，三方库 License 合规检查等等。最后通过研发流程平台，将权限、构建、检查和发布上线的过程串起来，同时也实现了研发规范的落地和研发数据的沉淀。

阿大：其实我个人在外分享前端工程是比较少的，就目前而言工程化走到越后面通用性越低！毕竟私人订制型的服务肯定用的最爽。但毕竟是私人的，并不能通用，最多也就思想层面可以借鉴，所以并不是别的公司好的前端工程体系建设，放在你的公司一定合适。中小型公司一般前端团队的规模都不会特别大，一般团队规模在 10 人以内的我建议不用系统化的去考虑工程相关建设。前端同学都是很爱捣鼓的个性，充分发挥个体的能动性即可，整体的研发效率和质量不会因为你做了规范或者统一了工具有明显提升，大部分的情况反而是下降的。当团队规模在 20 人以上的时候，协同的瓶颈就开始显现，如果没有一定的规范、流程和工具的约束，20 人的整体产出很大可能是远远小于个体之和的。这个时候一定要制定相关的研发规范、统一技术架构，如果规模在 50 人以上的话，就要配以一定的工具和流程来对研发过程进行有效约束，同时需要有研发数据的积累沉淀，通过数据指导体系优化。

阿大：一个技术发展的是否成熟，很大程度是可以通过工程化程度体现的。前端近几年的快速发展是软件行业有目共睹的，大部分的公司前端已然不是单纯的前端了！目前前端工程相关的领域的讨论和建设虽然大家感觉比较火热，但其实还是比较初期的。随着前端及前端周边技术的不断完善和充实，未来前端工程能力会更加趋于一种服务能力，会更好地与机器学习等智能化方向结合。会极大地降低复杂的、优秀的前端技术的应用门槛，同时也有可能通过完善的工程能力的建设，淘汰一大批入门级的、劳动力型的前端职业人员。

朱老师将会在本次 GMTC 全球大前端技术大会上担任”前端工程化“专场的出品人，对前端工程化方向感兴趣的朋友不妨来现场看一看。本次大会我们还设置了小程序、性能优化、前端框架、Node、移动 AI、图形渲染、前端团队管理等热门技术专场，可点击”阅读原文“了解大会详情。购票咨询：18514549229（同微信）