最爱折腾的前端在云时代如何备考？-Js中文网

云时代为前端技术⼈员织就了⼀张全新的互联⽹，以往在 UI 交互技术孤岛上的前端技术⼈员被联上了⽹，终于可以站在 C/C++、Java、Python……等程序员⾯前⾃豪的说：你们能⼲的我们也能⼲，⽽且，⼲得更好！

概要

这⼏年很少写⽂章，⼀⽅⾯确实很忙，另⼀⽅⾯怕误⼈⼦弟，⼀家之⾔望指正。

在这篇文章中我想分享⼀下云时代的前端技术展望。在开始之前，先聊聊云时代的背景。

任何⼤规模技术变⾰都逃不开⼀个驱动⼒：商业价值。今天世界经济不确定性陡增、⼈⼝红利消失、流量被市场寡头控制……整个互联⽹⾏业从没像今天这般短兵相接、剑拔弩张，这就要求互联⽹从业者更加注重商业价值。

云时代带来了：通过极致效率、⾼可⽤、精细化成本控制，来满⾜商业价值的要求。极致效率让招聘成本和研发成本⼤幅度降低，资本对互联⽹从业者提供的加速性能爆棚；⾼可⽤让运维成本⼤幅度降低，现在的互联⽹基础设施在云端为商业保驾护航，丝滑的阿⾥双⼗⼀验证了这⼀点；精细化成本控制让基础设施如：服务器、带宽、存储空间……可以随着业务发展按需投⼊，业务初期节约的资本可以投⼊到获取⽤户等更加迫切的事情中去。因此，云计算为互联⽹商业带来了前所未有的优质环境。

作为所有技术栈⾥最爱折腾的前端，拿着亚⻢逊云 Lambda 超过 60% 的 JavaScript 市占率，⾯对云计算和云时代的⼤考，究竟应该怎样备考呢？本⽂将按照从环境到应⽤的顺序，逐步揭开云计算时代的⾯纱。

云游

伪屏蔽：Serverless 下的 Node

容器技术起源于虚拟化，从 Parallels Desktop、Vmware、VirtualBox、Virtual PC 到 Xen、KVM、Hyper-V。云计算起源于容器技术，从 cgrpups、Docker 的基础容器到 FaaS 函数容器；从最早的虚拟技术，到后来的容器化技术。在前端技术领域⾥使⽤容器技术实现 Serverless 的开发⽅式，把 Node 从⼀个包管理技术和开发调试⼯具，变成真正意义上的⽣产⼒技术，这个过程还是跨越了许多坎坷的。

⾸先，需要真正意义上实现 IaaS。对于应⽤来说，底层的基础设施服务化从 Devops 到 Nops，最⼤的转变在于 Devops 不是谁都能⽤好，所以并不具备普世价值。Devops 提供了通过编程来控制基础设施的能⼒，但是，如果不深⼊理解分布式系统架构、不了解容错容灾和⼀致性问题……并不能使⽤好 Devops。因为它不仅仅是启动服务器、挂载硬盘、安装运⾏环境、设置环境变量、启动服务、InitD 启动脚本、启动守护进程这么简单。

其次，从架构设计⻆度上看，⼀个分布式系统和⼀个⾮分布式系统有着本质的区别，并⾮把服务⽤Node 开发、借助容器技术部署到云端这么简单。无论是接⼊层的流量负载均衡、流量分发、安全，还是服务层的服务注册发现机制、任务分发、任务结果的 Reduce、事务性⽀持、⼀致性⽀持、调度、消息通信机制、服务监控，分布式系统最核⼼问题就是引⼊⽹络通信带来的不确定性，这也是为什么编程问题⾥最复杂的是⽹络编程。

最后，从研发体系上看，⽆论 C/C++ 还是 Python、Java，都针对服务开发沉淀、积累了⼤量技术⽣态，尤其是针对分布式系统、⼤规模部署的复杂系统、⼤数据量和⾼并发系统、⾼实时性系统……都有成熟的技术⽅案和研发体系⽀撑。Serverless 的出现可以作为传统服务开发的⼀个加速器和技术补充，Node 服务端开发远不如传统服务开发技术体系成熟，要想从技术⽣态上完善这个体系，还有很⻓的路要⾛。

综上所述，Node 进⼊到 Serverless 技术体系并涉⾜传统服务开发领域，看似表⾯光鲜的虚拟化技术、容器技术、容器编排技术、服务注册发现技术、服务编排技术，实则对技术细节做了伪屏蔽。技术上看，虽然带来了充分的技术保障和实施可能性，但完善 Node 服务端开发技术体系，还需要 Node FaaS 和 Node Serverless⽣态在未来很⻓⼀段时间深耕技术细节，完善配套设施做到真屏蔽。

从思想上看，⽆论这个技术体系多厉害，从⽤户侧发起请求到服务侧响应，在云技术和 Serverless 体系下依旧⾮常复杂，需要有体系化的技术思想和架构思想去理解，这也要求 Node 开发⼈员更多去了解学习：MDA 分析法、五视图分析法、领域模型……等设计思想和设计范式。

超级胶⽔：Fission 看 FAAS

Javascript 诞⽣之初，作为⼀⻔解释执⾏的语⾔，天⽣的动态性就决定了其“胶⽔”的特性。起初，Javascript 把 DOM 和 BOM 粘在⼀起实现了 DHTML；后来，Javascript 把 DHTML 和 HttpWebRequest 粘在⼀起实现了动态⻚⾯。⼗余年发展下来，Javascript 从加⼊ECMA 语⾔层⾯增加了⼗来个特性，W3C 标准却带来了成百上千的浏览器特性，这意味着胶⽔⾃身的特性是够⽤的。这让我想起“502 胶水 “，不管是啥，擦⼲净抹上 “502”⼀按就粘住了。

Node.js 的出现让 Javascript 成为了真正的 “502”，不仅在浏览器上可以粘这儿粘那儿，在服务器上也同样可以。⽐如你可以把⼀个 HTTP Request Accept 下来，把 Token 粘到鉴权 Service 判断⽤户是否合法，然后⽤AWK 粘上 Post 内容来个⽂本分析，再粘个云端存储服务的 REST API 把某个 Key 的 Value 更新⼀下，然后挂着 200 的状态返回个 Response。

在 Serverless 下的 Node 技术体系更进⼀步，聪明的程序员发明了 FaaS（Function as a Service）函数即服务。经历了基础设施即服务、平台即服务、软件即服务的收敛过程，个性化诉求因为市场激烈竞争给业务带来巨大压力，市场迫切需要在集中式的以服务为基础的云上，快速构建个性化服务。云服务商的一个方案——把不同的业务逻辑包装在函数⾥直接在云端函数容器执⾏，从众多解决⽅案中迅速脱颖⽽出。究其原因就是因为极致效率、⾼可⽤、精细化成本控制。当业务有需求的时候写个函数来⽴刻构建、测试、发布上线，函数容器背后的云技术乃⾄云原⽣可以保证⾼可⽤，弹性缩扩容可以保证成本精细化控制，完美！

这⾥⽤Fission 来演示⼀下 FaaS 的魅⼒：可以看到，只要⼀个 CLI 即可解决所有问题，本地装个 Docker 和 K8s⽴即就能跑起来。推荐这个的原因是⽅便在本地搭建实验环境，真正动⼿学习 K8s 的容器编排、了解 Docker 容器技术之强⼤，不⽤去 Amazon 花钱开 Lambda 服务就能体验 FaaS 的魅⼒。通过 Fission 实践可以掌握：

K8S 加持的云原⽣开发⽅式
了解容器池化如何应对冷启动和瞬间⾼并发问题
如何进⾏服务编排
什么是 LSTIO 服务⽹格
如何借助 Prometheus 这种云⼯具来攫取指标观察数据
测试 Javascript 和其他语⾔在函数容器中的性能表现
……其他花式玩法等你探索

由此，即可顺利跨上云计算这匹宝⻢良驹，驰骋疆场应对⻜速变化的市场环境和新技术，精确⽆误的把各种云能⼒⽤Node FaaS 这管强⼒胶黏合在⼀起。

云上开瓶器：Web IDE

作为⼀个 1990 年拥有电脑的编程⽼⻦，Delphi 是我⻅过的第⼀个集成开发环境（IDE）。在 Pascal 的改进版语⾔Object Pascal 加持下，各种 UI 控件和⾃定义控件可以实现⼏乎所有的 GUI，相较之下，SourceInsight 只能算代码编辑器。这也是很多⼈不理解微软把 VS Code 叫做代码编辑器，把 Visual Studio 称为 IDE 的根本原因。

因为 VS Code 的开放，在各种插件加持下，VS Code 的 IDE 能⼒⼀点⼉不⽐Visual Studio 弱，是不是很神奇？所以，数千⼈组成的研发团队，依旧赶不上开源社区的强⼤，这是阿⾥巴巴、Apple 等⼤公司拥抱开源⽣态的本质原因。所以，今天的开源 VS Code 成为地表最强 IDE 已极少有⼈质疑。

VSC Team 由著名⼯程师 Erich Gamma 领导，Erich 是《设计模式》作者之⼀，Eclipse 之⽗，拥有多年的 IDE 开发经验。Erich 举重若轻的利⽤Node 把 Extensibility 管理得井井有条，为开放的插件⽣态创造了⽆限可能。

年终展望：最爱折腾的前端在云时代如何备考？

多进程的架构不仅带来了优秀的性能，也能让后台进程、UI 和编辑器、I/O、插件、Debug、Search 各司其职。因此，只要⽹络带宽允许，理论上可以把任何⼀部分服务化。举个例⼦，只要你愿意，可以下载 VS Code 的源码，把 I/O 部分服务化，利⽤云存储服务来替换本地 I/O，轻松保证源代码、资源⽂件等在云端的环境⾥安全可控。⼜或者，你可以把插件部分服务化，不论你在家⾥还是在公司启动 VS Code，云端存储⼀致的插件⽴即带给你⼀致的 IDE 和⼀致的开发体验。最后，⼲脆把后台进程和 Renderer process 也放在云端，⻬活，⼀个云上的 IDE 就此诞⽣。当然，如果你不愿意⾃⼰折腾，也可以试试微软的 VS Code Online，或者 Github 上的 Gitpod，或者在本地跑⼀下： https://github.com/cdr/code-server 。

如果把本⽂前半部分所讲的云端技术⽐作⼀瓶 82 年的拉菲，那云上的 IDE⽆疑就是⼀把开瓶器，用来拔开阻挡品尝云技术美酒的瓶塞。挡住美酒的瓶塞主要是：能⼒发现、调试、部署。

能⼒发现有两个层⾯，⼀个是表⾯上的⽂档上云服务能⼒是什么？⼀个是本质上的代码上云服务能⼒是什么？对于⼀个程序员来说，⽂档写得再详细，不亲⾃进去敲个 Hello World、Echo Server，⼤抵也是不放⼼的。有了云上的 IDE，你即刻就可以“打开”云服务的能⼒，⽤代码去⼀探究竟。

年终展望：最爱折腾的前端在云时代如何备考？

调试是应⽤任何新技术、新研发模式的基础，因为你⽆法预测⾃⼰的想法是否能被那些⾃以为是的代码，在陌⽣的运⾏环境⾥被正确执⾏。要驾驭分布式系统和现代云技术体系，尤其当⾯对混合云的时候，要完整搭建整个调试环境是⼀件很痛苦的事情。云上的 IDE 因为其云原⽣的先天优势，可以⽅便地在云端利⽤云技术、容器技术、容器编排技术快速创建应⽤调试环境，甚⾄可以借助云测试和真机模拟环境来进⾏调测、拨测。

部署在云服务和云设施之上，不同的云技术对应不同的持续交付和持续集成，构建过程、构建环境、构建对象和容器技术的依赖都让部署过程变得复杂。部署过程中流量分桶、热更新、服务⼀致性保障等问题也⾯临复杂的环境。尤其在多⼈协作的场景中，如何良好进⾏发布的管控，成为亟待解决的软件⼯程问题。云上的 IDE 可以⼏乎⽆痛的解决上述问题，通过在云上维护统⼀的持续交付和持续集成环境、⾃动化管控部署过程、借助源码和编译构建卡⼝代码发布，所有部署过程都在⼀个受控和受保护的云环境中进⾏，开发⼈员可以放⼼⼤胆的⽤代码构建整个世界。

展望

未来最让我期待的前端技术趋势就是云技术和机器学习技术，机器学习有 imgcook.com 这个作品在前端研发提效这个⽅向持续探索，为前端智能化充当排头兵。云技术在前端和 Node FaaS 技术体系下，需要怎样的突破创新？

⾸先，如何吸收借鉴传统服务开发的经验、分布式系统设计实践经验，将是⾸要问题。初⽣⽜犊不怕⻁也意味着⽆知者⽆畏，即便有云技术良好的基础设施和基础能⼒，如何训练⾃⼰拥有良好的架构思想、⾯向失败的设计习惯？只有不断学习吸收传统服务开发的经典架构思想和经典设计范式，并充分进⾏实践和反思，才能将其融⼊到 Node FaaS 技术体系。

其次，学习速度和学习深度都是因⼈⽽异的，每个⼈都有不同的理解⼒、不同的技术背景，⼜分处在不同的业务场景中，因此对 Node FaaS 技术体系的理解必定各有差异。如何在⾃⼰擅⻓的⽅向上、⾃⼰熟悉的领域中持续积累，沉淀出 Node FaaS 的最佳实践，并使⽤VS Code 插件或开源项⽬的⽅式将其分享出来，共同借助社区的⼒量丰富和完善 Node FaaS 技术⽣态？这也是一大挑战。

最后，云时代为前端技术⼈员织就了⼀张全新的互联⽹，以往在 UI 交互技术孤岛上的前端技术⼈员被联上了⽹，终于可以站在 C/C++、Java、Python……等程序员⾯前⾃豪的说：你们能⼲的我们也能⼲，⽽且，⼲得更好！

作者介绍：

甄焱鲲（甄子），阿里巴巴淘宝技术部高级前端专家。腾讯 3 年半 T1.1～T3.3 前端开发通道最高职级达成后，2011 年 4 月离职创业，先后创办两家中等规模电商公司，同时自研智能家居相关软硬件。2014 年 8 月加入阿里移动事业群，先后负责国内发行、国际信息流运营研发、广告平台、国际浏览器。现在淘宝技术部，负责前端技术委员会智能化方向。在编程领域服务端、客户端和前端、机器学习等领域都积累了丰富的项目经验，尤以前端技术见长。在硬件领域从基础电路设计、部分高速电路设计、无线传输、FPGA 和 CPLD 芯片原型设计、部分简单工业设计有项目经验和一些专利。求职笃行，是一个热爱技术、愿意花时间思考的人。