从2022看2023前端发展趋势原创

时光荏苒。回望即将过去的2022年。前端领域在这一年中整体上还是保持平稳向前。但对整个it行业以及互联网行业来说，变化还是很大的。下面我将简单分享一下个人对整个行业的一些观点和思考。如有相左，仅代表个人观点。先做一个自我介绍。我的花名叫野林，现在在某央企任职前端架构师。曾就职于多家互联网企业，有多年设计及前端开发经验。个人研究方向包括工程化、可视化，以细分领域专注于大前端领域发展。是一个开源社区爱好者。以下是我的一些技术分享平台，欢迎关注。下面说一下。本次分享的目录。主要包括三大部分。

首先是前瞻性的一个总览的概述。其次，我将通过各个不同的方向进行一个详细的阐述。最后我们做一个总结，对2023年做一个展望。下面先说一下我个人认为2022年的第一个关键词。相信在过去的一年中。大家也看到了整个互联网发展的一个形式。面对如此巨大的影响和环境。作为前端工程师。我们能做的东西也很有限。但是。个人认为我们可以审慎实事。对整个前端领域的发展做到一个前瞻性的视野。如果说非要给过去的一年定一个基调的话。个人以为用专注这个词其实比较合适。所谓专注，个人理解是收聚力量，以待来者。降本增效，专注于核心，相信明年也会是同样一个主基调。

那么。专注于形式，我们可以是以用户为核心。包括云边端。党以形态与服务的形式相结合。最后，我们专注于不同的前端的方向，做一个细化和伸延。在探讨了前端应该专注的方向和方式后。那么对于整个前端领域。我们又应该去做哪些突破呢？个人认为。在前端的一个核心技术中。可以大致分为这样几层。首先是系统层。然后是容器层、基建层以及交付层，在不同的层次中也对应的有相应的一些技术难点。那么。我们对这些层次是做了一些什么样的区分呢？首先，在交付层。作为一个前端工程师。前端的交付能力是一个基础能力。

因而，对于绝大部分的前端工程师来说，这些其实都是可以做到的。因而它可以定义为浅水区。对于一些有中级开发经验或者三到五年沉淀经验的开发工程师。大家都倾向于去做一些框架库以及工程效能相关的一些基建层的建设。那么这一部分也是绝大多数前端工程师愿意去探索和探讨的地方。因而个人认为这是中水区。但是对于最下边这一部分，尤其是浏览器运行时网络标准等相关的一些协议来说。这一部分很少有前端工程师能够进行一些探索。个人认个人认为如果后续想要进一步的发展。那么深水区必将是我们需要攻克的一些。领域。最后。

对于前端来说，操作系统层是透明的。因而我们很少去涉及到操作系统的一些内核或者建设。那么我们应该怎么样来保证这样一个突破能力呢？个人认为，我们要保证交付能力，拓展基建能力、涉猎容器能力，这样在纵深层次上也能得到一定的突破。在复盘了整个二二年的关键词后。下面我将按照不同的方向。逐一看一看。去年。前端的领域具体发展，以及对二、三年能够得到的哪些启示与发展？首先我们来看一下工程化方向。工程化方向是去年整体更新最多的一个领域。除了前端本身发展的历史背景外，个人认为工程化作为it领域的一个重要方向，同时也作为与整个技术、管理等相互关联的重要领域。

各位大佬绝对不会放过这样一个热门方向。下面。我将选几个个人认为比较重要的更新，进行一些回顾。首先是构建。在之前wipe为主流的时代。帮的构建是一个主流方式。那么随着weight。E build roll等相关构建工具的产生。一更新。Boundless的一些形式也成为了一些主流。那么在二三年。Bundle with bundleless。这样一种构建方案会是一个争议的焦点。其次。作为前端。最有争议的模块化问题。一直是前端领域的。阿基里斯之种。那么。

对于。ES model coms AMD umd等模块化的纷争，个人认为最终将收敛到em和CGS的之争。那么。对于ESM和CGS，个人更看好ESM。因为ES6模块是浏览器的标准模块。所有的模块，包括库框架，后续都会相应的支持。因而模块化在明年还会是一个相互纷争的时代。但随着时间的发展。我个人感觉，在三到五年之后，ES模块会取代CGS成为一个标准的模块。除了模块问题。那么去年。也对相应的gate的仓库构建进行了一些工程化的探索。从早期的monolis到motor，到现在比较流行的monor。

个人认为。Motor目前还处于一定的初级阶段。对于共享和隔离的问题，还不能够完全很好地解决。虽然有诸如tle ripple以及对应的tpi相关的一些构建方式。整个大闭环的一个构建思路，但是目前来看，怎么能更好的平衡共享与隔离的问题仍然是一个需要解决的焦点。那么最后。对前端的包管理同样也是有着众多的方案。除了NPM自身带来的之前的NPM地域问题。各个的包的管理，其实从底层来说，还是不能像其他语言那样有一个更好的包管理体系。相信各位大佬在后续的发展中也会对这一。

领域进行相关的更新和迭代，让前端的发展更加美好。综上。整个工程化领域在二二年发展还是很迅猛的。但还是希望能够让各位大佬针对核心问题进行突破创新。可以预计，二、三年仍会是工程化的一年。毕竟，来自其他领域的开发者共建共享前端才能更有话语权。那么接下来。我们来看一下note GS方向。Dota GS方向。重要的。改革，个人认为仍然是落脚于so。那么关于sola的一些构建新方案。个人认为可以参考阿里开源的。No slate。以及业界常规的通用型的web interval。Runtime的一个方式。那么。

这些方式的背后，其实都是结合云原生相关的一些建立。包括。云原生的一些调度存储。以及运行的机制。那么综上。整个note几S领域的发展，相对来说还是在细分领域的建树。这其实也是notes一个比较好的运用方向。毕竟真正使用note GS来作为传统后端开发还是有一定局限性的。相信二三年仍然会有和云原生领域更深入的结合。接下来。我们来看一下跨端方向。夸单方向。自web诞生以来。主要分为几个阶段。首先是纯native构建阶段。其次是结合以web为主的hybrid构建。

接着，随着p wa以及web container相关的一些技术发展。出现了p wa相关的一些主流方案。在借鉴了p wa一些主流方案的基础之后。国内出现了以小程序以及类小程序相关的一些跨端方案构建。最后随着拉特的到到来。那么整个跨端方向。逐渐进行了一些突破。近些年来。由于弗特自身的一些构建。出现了对业务领域支持稍微欠缺的这样一个弊端。那么各大主流厂商。也都基于自己的容器。进行了相关的探索。那么我们来逐一看一下。纯native阶段时，主流方案包括iOS、安卓、QT以及u wp等相关的开发。

那么。随着we view。构建方式的一些融入。有些简单的业务。呈现给了前端开发。但是前端对于整个应用的涉猎。野心很大。随着谷歌提出的p wa方案的。建设。那么。试图与行为分离这样一个思路逐渐被国内的一些主流方案所采所采纳。进而引发了诸如微信小程序。支付宝小程序、百度小程序以及后续的各大硬件厂商的快应用以及类快应用、类小程序的形式出现。那么。国内大部分对的研究都是基于flatterk渲染层的。二次建设。

那么。相信在。二三年的整个的跨端方向中，容器化方案仍然会是一个主流方案。整个跨单方向的核心其实是信息共享。那么。综上所述。整个跨端领域相对来说还是专注于right ones run everywhere这样一个理念。但其实这是很难做到的。个人认为。跨端方向可以专注于某几种场景的通用。而真正的全部通用是没有意义的。因为兼容越多，意味着的poli也就越多，有时候是得不偿失的。再来。我们来看一下前端智能化方向的一些突破。智能化方向。最突出的进展。莫过于低代码领域的相关发展。本身将低代码领域划入到智能化领域，稍微有些牵强。

但低代码的自动化。确实是可以辅助AI的功能进行相关的实现。因而将其划入智能化方向。也不失为一种方案。除了本身design to code的发展。最近也新出了一些g BT Chad g BT等相关的发展。那么。这或许也能拓展整个前端智能化的一些发展方向。从开发。到设计。再从设计。的开发。那么。从design to code。主要涉猎的是一些AI、人工智能相关的一些模型算法。那么。从code to design。这个赞主要涉及的是。图片、图像以及和设计相关、非开发相关的一些发展。

那么个人将其划入了有低代码。Sketch插件。Photoshop插件以及产品所用插件相关的开发。这些其实也属于前端开发的相关范畴。从。Design to code，再从code to design。整个智能化领域。可以考虑更多的发展、创新与落地。接下来。让我们看一下。前端最为神秘的一个方向，互动方向。个人认为。互动方向，最主要的在于对新交互方式的探索和场景应用。那么。和前端相关的。目前热门的领域。如。WEB3。以及元宇宙等相关的开发。

前端能做些什么呢？我们来看图上所示的其实是以区块链为主的一个核心的能力。个人认为，WEB3时代的核心能力在于区块链技术的相关发展。对于数据层。网络层。共识层、激励层、合约层以及应用层相关的开发建设。那么前端能设计的主要在于？应用层以及部分合约层的相关开发。有意识的领域。大家可以专注去做一下相关的建设。那么针对元宇宙。个人认为主要是对于叉R相关的一些相关的探索。包括MR。RR。那么这些在外部领域也同样有相关的一些发展和建树。

那么Facebook去年也改名为matter。那么这也意味着元宇宙可能会是。下一个时代的前端发展的一个主流发展方向。那么互动方向应该是二三年变化最快的一个领域。应该也是最有可能产生新突破的方向。目前还充满很多机会和挑战。有想法的同学可以提前布局。再接下来。我们来看一下中后台方向相关的发展。随着单页应用的瓶颈出现。中后台方向又出现了分久必合、合久必分的态势。不论是微前端还是islands框架。这其实都是一种新瓶装旧酒的感觉。那么我们来看一下islands框架和整个微前端架构能够怎样进行一个融合。

如图所示。左侧是一个Alan架构。那么，孤岛架构的整个核心，其实又是回归了传统的三驾马车时代。HTMLCSJS。这是由于单页应用近年来产生的巨石。应用所造成的一些影响。那么。主流的渲染方案，如SSR。CSNSR，甚至esr等等。都是为了解决这一问题。那么我们如果将网页进行逐一的拆分，我们可以看到有hier APP。Sideba APP以及等等相关的一些资源建设。而这些似乎也对应了。微前端时代。所拥有的一些构建能力。如基座。

各个分子应用的建设。那么。真正的对于微前端的建设，个人认为目前还没有一个统一的。标准出现。真正的想要产生类似于后端微服务形式的那种微应用产生，还需要能够提供一个容器化的方案。这里个人认为这个容器可以。实现类似于K8S相关的容器调度。或者也可以实现类似于side car相关的边车模型。那么对于不同的容器应用进行相关的调度。包括各个生态的相关的全家桶的建设。也是可以真正的实现。所有全应用的发展。综上。中后台方向基本还是基于模板的选择构建。技术的选择并不一味的向前突进，有时走下复古风格也是另一种思考和体验。

最后。让我们来看一下可视化方向的一些件数。对于可视化方向，个人认为。除了通用的一些库的建设。我们可以对于。特定场景进行相关的底层构建。从而产生更加适合特定领域的。腾讯可视。如图所示。如果我们将可视化方向进行分层建设拆分，我们会发现大致可以拆成这样六层。从绘图技术到渲染引擎，到原子模块。到可视化语法，再到上层的可视化类库。甚至于高阶的封装。而绝大多数的前端同学。都停留在以可视化类库的使用为主。

如一叉子的使用。那么。对于特定领域。如一些特定的工业场景。工业模式的一些建设。我们直接通过底层的渲染引擎或者绘图技术进行一个相关类库的实现。或许。真的能进行相关的一些突破。最后我们来看这样整个一层的分层模型。其实是从。底层到高层的直接应用。那么除了2D技术。个人认为，3D技术目前其实还是有很大的开发场景。不能完全局限于以web gl等相关的一些底层的建设。那么综上。可视化方向可以关注特定领域的底层建设，以及对应于三维图形库的突破与开发。

最后。我们来做一个总结和展望。回顾一下整个前端领域的发展。大致可以总结如下。工程体系蓬勃发展。容器跨端各相静竹。智能领域多维演化互动体验机会丛生。架构方案和而不同。可是图形专精特新。前端聚焦，择善而从，深入突破。玉如与成。最后。有关本次展示的文字稿。欢迎关注个人微信公众号以及。相关的一些博客。感谢大家的聆听。