2022年前端技术趋势分析

448 阅读6分钟

一. 前言

21年前端领域发烧诸多变化,在21年末明显感觉rust 的存在感变强了,云原生概念兴起掀起一股一切都要上云的风潮,包括我们的IDE 。低代码的需求在逐步增大,不管大厂小厂都想要。bundless的库会越来越多,也会越来越流行。Serverless崛起注定将在前端掀起一股浪潮。Monorepo会满满变成标准的方案,TypeScript会持续流行等等。

那么在此分别从构建,工程化,框架,编辑器,低代码这些方面,来聊一聊22年前端的一些新的趋势和发展。

二. 工程平台

字节今年开源了modernjs , 号称现代Web 工程体系,方向是没错,目前开源的只是一套CLI工具。背后的工程平台才是真正的价值和核心。所以做前端工程平台,前后端一体化,治理整个研发链路,避免割裂,整合所有前端资源(配置化,微前端,研发工具,低代码,WebIDE, 工程平台)才是未来大的趋势。

本段内容,信息量较大,不进行细讲。感兴趣的同学可以单聊。

三. 一体化框架

早期阶段,前端充斥着大量的工具,打包工具webpack ,gulp , 框架脚手架, babel ,less ,ts等等。 后来出现nextjs, umi 等这些工具,来将这些零碎的前端工具整合在一起,形成一套构建打包方案。包括后来出现modernjs , BlitzJS等后期之秀,在此之上甚将GraphQL ,Serverless, Prisma(ORM) 都集成进来,形成前后端一体化框架也称为全栈框架,这将会是22年,乃至今后很多年都面临的趋势。

三. 包管理-Monorepo是标准

npm的包管理一直让人头痛,持续浪费磁盘空间,扁平化的依赖,复杂的算法逻辑,不够高效也不简洁。所以我们需要一种monorepo管理包的方式。22年我认为pnpm 或 rush 会让一大批仓库从 lerna,npm ,yarn workspace 等其他的方案迁移过来。Monorepo 将成为前端标配。ESM将持续推进,老的标准慢慢废弃。ESM的推进,将对微前端带来一波利好。微前端后面单独再讲。

四. 构建工具-RUST要起飞

随着vite,snowpack持续发力,vite等为代表的bundless工具,有望成为最好和最快的前端构建工具。目前Webpack只能通过增加一些小特性来巩固自己的地位,比如webpack5增加了filesystem cache,但是webpack慢的名声已经在外了,不过本质上这事儿跟慢不慢也没必然关系。大家都在为esm和bundless做准备。所以bundless才是大势所趋。

image.png rust给前端构建又带来一针强心剂。 SWC用于替代传统的babel (SWC is 20x faster than Babel on a single thread and 70x faster on four cores.),下半年很多前端构建工具都有人在用 rust 重写,比如parcel 作者发布了用 rust 写的 parcel-css,速度约是 cssnano 的 120 倍。facebook的rome也正在用rust重新,它的野心更大,在甚至想替代BabelESLintwebpackPrettierJest 等工具,并且提供一套完整的 js toolchain,包括 compiler,linter 等 。而且WebAssembly是与rust搭配的最佳组合。而且rust语言极高的性能和安全性,会越来越受青睐。好了,大家私下去了解Rust语言。

五. 编辑器-WebIDE

虽然在localhost 上前端VSCode编辑器几乎可以一统天下。 但在WebIDE上,VSCode的优势就不那么明显了。VSCode并不是针对对web的产品。 对于云上的需求,VSCode提供了remote插件集,但并不开源,使用能力局限。远不及像Eclipse团队推出的Theia这种编辑器框架 ,专门针对Web和Cloud而生的框架,同时又兼容VSCode插件生态。对于云原生大行其道的今天,IDE上云是必然的趋势。从公司层面考虑,统一开发工具和环境,统一研发体验,构建提效,代码安全上等等诸多考虑,上云是必然的趋势。

而且IDE也会越来越卷,都在抓住Cloud Native的机会,JetBrains 推出了Fleet 也是号称一下代IDE,也有基于Cloud版本, 22年会有越来越多公司开始采用CloudIDE。结合我前面提到的工程平台,可以重塑前端的研发体验。

六. 低代码-LowCode

在今年的几次技术大会上(阿里云栖大会,前端早早聊,掘金大会,架构师峰会)等很多大会上都聊到了低代码和无代码技术。

image.png

整个低代码以及无代码都是呈现上升趋势,这个赛道会持续火热。

LowCode 其实是很早就提出来的概念,为什么在最近这几年突然爆火。其实我们可以分析一下这其中的原因。

这个问题其实要从很多很多方面来看,首先我们从技术层面上来看:早期阶段,技术相对比较落后,浏览器,框架,工具,语言都不成熟,随着响应式Web,Html5 ,mvvm 框架,Cloud Native等等新兴技术的新起。深度学习大热,也影响了LowCode发展,包括阿里的P2C(图片到编码),CV视觉加上数据标注生成DSL。最后加上企业线上数字化的渴求,这一切来说,低代码的发展也就顺水推舟。

然后从企业层面来看: 中小企业为了节省成本, 大公司为了提效,降低研发门槛 。都是需要发展LowCode的,并且大中型企业的数字化服务市场经过几十年发展进入增长瓶颈期,不能从平台角度满足软件服务企业的业务增长需求,需要开辟新的赛道。中小企业自己研发成本过高,数字化转型又将迫在眉睫,想开发款软件内部流程环节复杂,试错成本很高。据此在内因、外因的共同作用下,低代码成为被风口选中的行业,加上资本的涌入无疑就火爆起来。22年还会持续火爆。

七. 其他/总结

在桌面端,github.com/tauri-apps/… 将比 electron 成为更流行的桌面开发方案。采用rust ,更小的包体, webview2的支持(微软对webview2支持力度较大,webview2 runtime体积小。大概1.8MB),新版本edge采用的chromium,有常青模式。甚至可以做到比electronjs的chromium更新更快。不同应用可以共享webview2。electronjs想实现的共享运行时被webview2实现了,微软内部桌面应用逐渐从electron切换到webview2 , 宗上所属,tauri将会有更好的前景。

随着Severless新起,包括rust ,go 等这些语言给前端基建添砖加瓦,我认为前端3.0很快就到来,前端3.0是希望前端和后端统一变为应用工程师,即前端能够通过Serverless解决基建运维问题,让前端开发者进一步了解业务,编写业务结构,而非简单的BFF中的api proxy或SSR层面。

好了,就先聊到这里吧,祝大家新年快乐,心想事成。