本文参与SegmentFaultthink-no-no随笔《2021年总结》，正在阅读的朋友欢迎加入。前言又是年末了。2021年回顾整个前端历史，前端总体上趋于达到一个相对稳定的发展阶段。虽然还是有不少库和轮子陆续涌现，但总体来说，今年最突出的前端开发其实还是可以做到的。可以归纳为以下几个关键词，即：工程基础设施、低代码、多语言、云+边缘+端。从不同大厂对整个前端的划分来看，整体可以分为两类，一类是专注的，比如区分各个方向，把每个方向做到极致；另一种是整体规划，将整个上下游打通，扩大前端边界。我个人认为很难确定这两个部门哪个更好。从宏观到微观，再从微观到宏观，只是思路不同而已。在这里我会从垂直和水平方向改变几个不同的视角。下面我来谈谈我今年整体的前端发展情况以及2022年可能出现的一些趋势和机会，以提供给大家一些不同的观察和思考角度。垂直如果把现在的前端按垂直层次划分的话，我个人认为大致可以分为三个层次：“基础层、平台层、业务层”。下面将从这三个层面的不同维度做一些思考和探索。毋庸置疑，今年最大的亮点无疑是多语言在前端视野中的广泛体现。下面我就说说我个人的一些看法和看法：Node.前端最熟悉的语言，基于车联网等物联网领域现有传统硬件厂商的C++库，更便于上层实现；节点。.js最初的作用是作为纯后端使用。无论是语言本身的限制，还是Node.js的运行时性能，都很难与传统后端语言有更多的竞争空间。Node.js作为前端侧基础层反而更合适。Rustust的核心竞争力在于内存安全。我个人认为Rustrust在边缘端与wasm的合作其实有很大的市场。个人认为前端侧做基础设施很难体现其核心价值。不过在边缘端可能真的可以和wasm合作。撼动Docker的地位；Rust作为前端基础设施可能有一定的市场，但还不足以成为其核心竞争的真正存量。作为前端基础设施工具是否比go更好还不清楚，但边缘方面我认为它的市场是巨大的，对于有意向发展的同学来说可以作为一个深入的研究领域边缘的一面。Deno在与云的合作上可能会有一定的突破点。它的网络模块设计的比较好，可能抢了node.js的一部分空间；整体的发展我并不看好，个人认为没有理由也没有冲动用一个core来替代node.js，但仍然是一个很好的解决方案，对于网络模块的处理有一定的参考意义。Wasm的核心是与Rust合作构建边缘端基础设施，打开边缘端市场，长期看好；作为其他各种语言的“胶水”，可以在浏览器和其他带有js的runtime中使用，比如：Node.js等（ps：Deno的感受还是要考虑一下），还有一定的余地想象，但我更看好它在边际的发展。Go的核心在于goroutine。个人认为，作为前端基础设施端，很难和rust区分开来，但是go相对来说比较好学；作为cloudsidego的最佳选择，那一定是go。它的生态非常完整。我想在云领域更深入地挖掘。我的同学建议你一定要学围棋。C++前端的老熟人，作为v8和chromium的最初开发语言，cpp一直是各大高级语言的基础老大哥，发展稳定。我个人认为Rust很难撼动自己的地位，但两者并存其实也不是没有可能；传统老牌硬件厂商将cpp暴露在前端侧，比如：v8或者其他引擎，可以极大的拓展开发市场。毕竟js还是比cpp简单。综上所述，总结如下：在终端侧，Nodejs为主，适当考虑Deno，优化cpp；在边缘端，rust+was前景广阔；在云端，go是首选。多语言开发作为前端开发的延伸，确实应该是未来发展的基调，尤其是在工程领域，市场前景还是非常广阔的。平台层在平台层，依托于基础层的一些基础承载能力。前端一般呈现以下平台视角，即：Serverless、构建、场景、框架。下面我就一些个人的理解进行说明：ServerlessServerless目前还没有明确的定义，但是从实际案例来看，整体可以定义为“Baas+Faas”，在Baas层分离计算和存储，提供Faas层的“云+端”WebFunctions；基于Rust+Wasm的沙盒化轻量级vm，microvm应用于Serverless的沙盒隔离；多模态协作、基于服务编排代替基于资源扩展、全栈可观察性、服务治理和流量管理。构建工具很多，webpack仍然是应用打包的主流，rollup多用于库，gulp更适合节点端构建；多语言侵入前端搭建领域，如：esbuild、vite、swc等。在构建端，语言层面的碾压是不可逆的，将成为平台层的主流构建方案。毕竟不是每一个打包工具的业务开发都需要从头开始手写，所以一个高性能的打包方案肯定有一个巨大的前端开发市场，剩下的就是语言达人和写手的合作创造无限的可能性。场景不同的业务场景选择不同的渲染方案，如SSG、ISR、CSR、SSR、ESR、SPR等；所有场景的选择本质上就是render的选择。软件工程中没有灵丹妙药。选择适合业务场景的效果图计划是上策。FrameMetaFramework，框架的框架，不同的端有不同的框架，前端有前端框架，服务端有服务端框架；框架演变：纯前端+纯后端，即：前端侧Vue、React、Angular等后端侧Express、Koa等；业务前端+业务后端，即：业务前端Umi、Ice等，业务后端Midway、Egg、Nest等；front-end后端或者后端前端，比如：Next，Nuxt，Remix等等。综上所述，总结如下：Serverless释放大前端能力，多语言构建，多场景选择，框架化。从这个角度来看，基本上是从面向服务的开发到面向能力的开发，从终端工程师到应用工程师。业务层在业务层。去年大致讲解了基础前端技术的深化方向。今年主要讲几个方向交叉领域的一些亮点和感受：可视化+工程。位置1，如上图所示，是low-code，尤其是逻辑。编排等，在LCDP中，数据逻辑编排或决策编排的可视化呈现；状态可视化、逻辑可视化等，所有工程领域的可视化呈现，从机器偏向人偏向的所有环节都可以可视化进行工程。可视化+智能上图位置2海量数据布局展示，结合AI推理构建可视化地图；链路诊断路径与图形模式匹配；D2C领域的深化，基于开发者思维习惯的模型优化。工程+中后台Position3工程链路闭环如上图所示，开发=>测试=>构建=>部署=>监控；专注每个阶段，输出工程量化产品，提供中后台等工程模板解决方案，如：开发阶段包括：脚手架、公共库、包管理器、编辑器、构建工具、调试套件等；测试阶段包括：单元测试框架、静态扫描工具、自动化测试工具、性能测试工具等；构建阶段包括：打包脚本、构建服务等；部署阶段包括：发布平台、迭代管理平台等；监控阶段包括：嵌入平台、监控平台等。中后台+跨端上图位置4呈现为多端框架，多以类似Flutter的结构呈现，包括统一的小程序底层引擎等；适用于多种操作系统，如鸿蒙操作系统的适配。综上所述，总结如下：工程化为主，可视化提供人性化展示，智能化提供建模能力，中后台+跨端提供针对不同用户的开发方案。各个细分领域都从自身的深度相互交织，迸发出各种可能的发展，久分必合，久合必分。横向从横向的角度，我想从面向用户和面向开发两个维度，从技术出发，谈谈作为前端工程师可能涉及到的一些业务或产品形态的拓展。UX方面越多，用户方面就越多。它更面向业务；越是向DX侧，越是向开发侧，越是向技术侧。接下来，我将以前端技术为锚点，向产品端拓展，谈谈我对一些领域的看法和思考：Product矩阵左上角的文档协同编辑，B端或简单的文档编辑；海量数据处理，如财务表计算等设计工具设计图转代码；设计工具插件，如：sketch、photoshop插件等；协同修改、裁剪等组件库通用组件库、主题、DesignToken等；业务组件库，业务域边界确定；设计语言+交互语言，材料市场。星矩阵右上角的低代码通用能力引擎：UI可视化开发、逻辑可视化开发、代码语言、生产运营、质量保障；以受众为导向，以发展为导向，以用户为导向；Tech矩阵右下角IDE与云一体化建设，云端IDE与终端IDE；发布和构建功能建立，IDE外围和系统建设。Devopsci环节，包括需求关联、触发机制、通知、脚本、故事板等；cd链接，包括调度、监控、产品库、发布机制等。工具链框架运行时，编写框架插件等；脚手架搭建，包括搭建工具选择等；编译调试工具，包括自定义调试工具包等；Material矩阵左下角监控系统日志监控，包括日志分析、过滤等；跟踪链路，包括链路分析等；metric监控，包括质量分析，健康状态等。总结不要止步于浏览器，不要止步于js，有web运行时的地方，属于前端领域。回顾2021年，展望2022年，总结如下：三个时代尚未到来，元宇宙仍需拭目以待；云边终端的未来已来，端工程应用必将成功；大前端可无限扩展，运行时无处不在；浏览器不能限制，多语言是大势所趋。好了，2022年来了，祝大家在这个寒冷的冬天坚强起来，“路漫漫其修远兮，行将至；继续前行，未来可期”，让我们互相鼓励！
