最新前端技术趋势——菜鸟必看

前端的车轮滚滚向前，轮子造的越来越圆，速度造的越来越快，每个人都在适应这个轮子的节奏，稍微不注意就会被甩出车轮之外。狼狈不堪之外还会发自心底的大喊一声：别卷了！！

话虽这么说，但现实就是这样，无论是客观还是主观因素都不得不让你继续的往前走。既然是往前走， 那么能知道一些前面有啥东西岂不是更好，也许能少走弯路。

自己对前端 23 年大概的技术做了一些展望，想到什么写什么。毕竟谁都不知道会不会突然间又出了个 frontEndGPT 打翻了所有人的饭碗。

1 AI

最先说的肯定是 AI，22 年末，23 年初的 chatgpt 让 AI 话题火的一塌糊涂，同时也被认为是一次重大的技术革新，技术革新带来的就是重塑，一切都要被重塑，你的职业，你的工作。 视觉层面的 stable diffusion 和 midjourney 已经对设计师产生了重大影响，而涉及到视觉 ui 层面的话，前端肯定是绕不开的部分。虽然目前没有直接的对前端产生影响，但下面的就一个就不只是对前端了，而是对整个程序员都产生了影响。

copilot

Your AI pair programmer. Trained on billions of lines of code, GitHub Copilot turns natural language prompts into coding suggestions across dozens of languages.

看看醒目的文字就知道，程序员或多或少都会被影响了。

还有什么 CodeWhisperer, Cursor 等也都是 AI 辅助编程。

更有 Fronty，Locofy 等将图片 AI 分析为 HTML 文档，无代码快速建站，figma 快速解析成代码等，虽然是提效不少，但谁能说这些不是对前端的一种重塑呢。

​2 主流框架

随着 React，Vue 等框架进一步的普及，现在前端想要脱离它们的场景越来越少了。那么它们的下一步规划，也会对我们产生一些不小的影响。

react

react 18 以后，react 似乎是对 create-react-app 这种项目启动方式也不怎么主推了，毕竟速度摆在那里，没有任何优势。而使用直接竞争对手的产品似乎又不太合适，而直接说又不用又显得跟开源精神不吻合(当然竞争对手的一些基本特性也确实和现有的构建思想不太吻合)。

他们似乎采取一种围魏救赵的方式，着重宣传 next 的方式。next 不仅仅是一个 ssr 的框架，同时它也支持 csr,ssg 等不同的方式(next13 开始，对于客户端组件和服务端组件可以有了比较好的区分)。同时 next 与 react 有着千丝万缕的联系，而 next 正在进行一个新的构建工具的替换。 next 采用了 turbopack,也是 Webpack 作者 TobiasKoppers 的作品，官方说它更新速度比 Vite 也要快 10 倍、比 Webpack 快 700 倍

而 react 也应该大概率会引入 turbopack(当然它如果继续搞前端脚手架的话)。当然也可能会直接使用 next 环境。

至于快多少，以及评价基准等我们可以看下turbopack真比Vite快10倍吗？

next

next 最新版本也加入了很多的特性，比如 server component 理念，约定式路由的更改，流式渲染，客户端组件与服务端组件分离更简单，更好的构建速度等等功能。可以让开发体验，用户体验更好，性能也会有响应的提升。

vite

这个不用说了，优秀的构建速度以及越来越丰富的社区，让其在 22 年有了很大提升。随着浏览器的逐步升级，23 年 vite 肯定也会是重大的一年。

webpack

虽然 5 有了好多的功能提升，不过速度似乎一直是一个绕不过去的坎。就连作者也已经开始搞 turbopack 了，虽然加入 swc 能让编译有很大提升，但是目前从我身边的人的了解看，越来越多的人开始转向 vite 等其它方式了

turbopack

是 webpack 作者去的新公司开发的一款基于 rust 的打包工具。官方明确说明就是为了替换 webpack。 同时强调 webpack 是这十年最火的工具，那 turbopack 就定位成未来几年的工具。由于作者和 webpack, Vercel, next, React 这些之间千丝万缕的联系，很难不说未来 React 也许会和这个打包工具绑定上。下面是官方提供的速度参考

而除了 turbopack 外，同一团队还在做 Turborepo。

这是一款项目管理的工具，最主要的面向场景是 Monorepo 这种复杂的多项目管理

Monorepo 有很多优势，但是在多个项目中会有很多复杂的构建过程和相对闭塞的构建步骤，每一次上线都是耗时严重。所以 Turborepo 是为了解决这个问题出现的，让一些构建重复的构建步骤提炼出来，基于整个 Monorepo 项目的维度来管理多个子项目。

同时对于单个 CI 的构建步骤，解决每台机器，每个人都要单独构建的问题，还提炼了类似 store 的方案，脱离了构建环境，只跟项目绑定，当然这个方案是否使用要看你自己，毕竟原理是把构建产物放到第三方储存，而第三方又不是一个类似 npm 的开源机构。

3 轻量级的低代码开发平台

前端技术在不断更新和迭代，新的技术和框架层出不穷。大佬们都说要追求高复用、高内聚、低耦合、易拓展，大家开始忙不停蹄的学习这些概念和应用实践，讨论到低代码，大家好像都蛮兴奋的。

在低代码领域，JNPF 开发平台还不错，很多人都用过它，是功能的集大成者，任何信息化系统都可以基于它开发出来。

依托自身的技术生态，不仅可以在一个平台内搭建 OA、ERP、MES、EHR 等各种传统管理系统，也可以通过 API 接口，对接企业原有的管理系统和数据，企业微信、钉钉、公众号等平台，JNPF 支持搭建聚合已有系统、平台和设备，承载 20 万+用户体系的并发和数据处理能力，支持大规模复合式业务场景使用。

应用地址：https://www.jnpfsoft.com/?csdn ，找个有空的时间自己试试。

4 服务端

node 从 7，8 年前的爆火，到现在的不温不火，前端语言介入服务端这个命题似乎现在是越来越清晰了。那就是定位，可以做网关，可以做转发，可以做一些数据代理合并，定位清晰 node 依然有自己的使用场景。 node 也马上到了 20 版本，迎来了一些特性

• esm 的更好支持，

• 测试功能更加丰富

• V8 引擎更新至 11.3，与 Chromium113 版本大部分相同

• 支持以虚拟机的方式，动态运行 js 代码

• WebAssembly 的支持(实验性的)

于此同时，node 曾经的作者 Ryan Dahl 几年前搞的 Deno 似乎没有太多的消息，似乎在向商业化方向前进。打造出 Deno Deploy 及其即时边缘渲染 SSR 框架 Deno Fresh

5 其它

WebAssembly, 元框架，ts，微前端？