写点什么

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

  • 2019-04-19
  • 本文字数:2808 字

    阅读完需:约 9 分钟

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

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


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


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


GMTC:朱老师您好,可以请您先简单的介绍一下您自己和您现在所负责的工作吗?


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


GMTC:前端工程化是近两年前端圈非常火的话题,请您简单谈谈工程化的意义?


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


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


GMTC:淘宝近百人研发团队的前端工程化是如何演进的呢?(其中遇到了哪些问题,是如何解决的)


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


GMTC:前端工程化是为了提升业务效率,那么对于中小型公司的前端工程化之路您有什么建议吗?


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


GMTC:面对前端业务以及技术架构复杂度的不断提升,您觉得前端工程化未来会是一个怎么样的发展趋势?


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


朱老师将会在本次GMTC全球大前端技术大会上担任”前端工程化“专场的出品人,对前端工程化方向感兴趣的朋友不妨来现场看一看。本次大会我们还设置了小程序、性能优化、前端框架、Node、移动 AI、图形渲染、前端团队管理等热门技术专场,可点击”这里“了解大会详情。目前大会8折售票倒计时进行中,团购更优惠,购票咨询:18514549229(同微信)


2019-04-19 00:006468

评论 1 条评论

发布
用户头像
移动方向-移动Ai
2019-05-08 09:23
回复
没有更多了
发现更多内容

跨端轻量JavaScript引擎的实现与探索

京东科技开发者

低代码与鸿蒙开发:重塑软件开发的未来

不在线第一只蜗牛

低代码 鸿蒙开发 鸿蒙系统

人工智能的本质是编程+数学吗?

算法的秘密

✅inventory hint,解决热点数据如何高效更新

派大星

:MySQL 数据库 java 编程 热点数据

LLVM编译报错解决:collect2: fatal error: ld terminated with signal 9 [Killed]

百度搜索:蓝易云

云计算 Linux 运维 云服务器 ECS

你知道h.265吧?但关于AV1编码格式你也来了解一下吗?

Geek_ee6d52

【教程】oc代码混淆_OC代码混淆工具

Docker cp命令详解:在Docker容器和主机之间复制文件/文件夹

霍格沃兹测试开发学社

10个AI人工智能PPT生成软件,轻松搞定PPT制作!

彭宏豪95

人工智能 在线白板 AIGC 效率软件 AI生成PPT

Java HashMap 和 HashSet 的高效使用技巧

小万哥

Java 程序人生 编程语言 软件工程 后端开发

如何关闭Windows自动更新

霍格沃兹测试开发学社

Vue3 - 插槽 Slots

霍格沃兹测试开发学社

业界首份 GitLab DevSecOps 线上成熟度评估邀您来测

极狐GitLab

聊聊CWE 4.14 与 ISA/IEC 62443中,如何保障工业软件的安全性

华为云开发者联盟

安全 开发 华为云 华为云开发者联盟 工业软件

Libcomm通信库:GaussDB(DWS) 为解决建联过多的小妙招

华为云开发者联盟

数据库 后端 华为云 华为云开发者联盟 华为云GaussDB(DWS)

ElasticSearch架构介绍及原理解析

霍格沃兹测试开发学社

「2024」不再内卷,让AI低代码带你玩点新花样!

优秀

AI 低代码 AI低代码 AI 人工智能

度小满轩辕:金融行业的大模型实战派

脑极体

AI

如何修复MySQL中损坏的表

百度搜索:蓝易云

MySQL 云计算 Linux 运维 云服务器

100M 768 维向量数据,Zilliz Cloud 稳定支持 Shulex VOC 业务场景

Zilliz

AI Zilliz 向量数据库 zillizcloud

ChatGPT是什么意思?从产品简介、替代软件到应用场景等全方位解读!

彭宏豪95

人工智能 在线白板 AIGC ChatGPT 效率软件

两会热议高质量发展 华大北斗用芯领航

江湖老铁

四种领导风格的大白话理解

芃篙君

管理

Mysql join加多条件与where的区别

百度搜索:蓝易云

MySQL 云计算 Linux 运维 云服务器

嘿!AI 编码新玩法上线!

阿里巴巴云原生

阿里云 AI 云原生

低代码与前端框架:现代软件开发的新黄金搭档

快乐非自愿限量之名

软件开发 低代码 前端框架

官宣!前联邦快递亚太区董事总经理 Robin 加入 Tapdata 担任首席运营官

tapdata

数据库

re:Invent 产品体验与感受分享:Amazon ElastiCache Serverless 缓存的即时扩展

亚马逊云科技 (Amazon Web Services)

Serverless

Apache Doris 2.1.0 版本发布:开箱盲测性能大幅优化,复杂查询性能提升 100%

SelectDB

数据库 大数据 查询性能 物化视图 #数据分析

IO模型介绍(select、poll、epoll)

京东零售技术

Java 后端 io

Easysearch 内核完善之 OOM 内存溢出优化案例一则

极限实验室

elasticsearch OOM 内存 easysearch

从淘宝前端工程化演进,看工程化之路如何“私人订制”_大前端_朱华军_InfoQ精选文章