2022 年 JavaScript 明星项目

年度总冠军: Bun 🏆

今年最流行的项目是 Bun：一个专注性能与开发者体验的全新 JavaScript 运行时。它的流行程度伴随着在今年夏天发布的第一个 Beta 版而爆炸性增长：仅一个月内，就在 GitHub 上获得了超过两万颗星星。自从我们在 Best of JS 开始统计项目以来，我们还从未见过这样的爆炸。

那么，是什么让 Bun 与众不同呢？与两年前的总冠军 Deno 一样，它也为 TypeScript 提供了一流的支持。

但 Bun 不仅仅是一个运行时。它也是：

• 一个包管理器 (类似 Yarn、 NPM、 PNPM)
• 一个构建工具 (类似 Webpack、 ESBuild、 Parcel)
• 一个测试运行器
• ... 以及很多其他东西！

所以 Bun 可以通过读取你的 package.json 来安装依赖项。Bun 还可以运行你的脚本。不管它做什么都比其他工具更快。

Bun 在 JavaScript 生态系统的许多方面都有新的尝试，其中的重点是性能。

它优先支持标准的 Web API，如 Fetch。它也支持许多 Node.js APIs，使其能与大多数 NPM 包兼容。

它可能还没到 “能用于生产” 的阶段（缺乏 Windows 支持），但它依旧是一个非常有前途的工具。与 Deno 相比，它的生态系统相当新，但它已经有一个名为 Elysia 的网络框架，其声称是最快的 HTTP 框架。

Bun 最不可思议的是，它的创造者 Jarred Sumner 用的是一种名为 Zig 的低级语言从零开始实现了所有这些功能。

更多细节，请阅读《彻底整顿 JavaScript 生态系统》一文。

Tauri

2021 年排名第五的 Tauri 在 2022 年更受欢迎了，新增了 3 万颗星星。 这是一个由 Rust 编写的项目，利用 Web 技术创建跨平台的桌面应用程序。

它在 6 月份发布了 1.0 版。

它创建之初就考虑到了安全和性能问题。与 Electron 相比，它占用的空间很小，因为开发者必须指定应用程序所需的 API 和能力。

React 与 Next.js

在第三的 React 和第四的 Next.js 得到了类似的成绩，新增近两万颗星星。

10月发布的 Next.js 13，利用了 2020 年 React 17 推出的 React Server 组件。

React 的维护者之一 Andrew Clark 在这篇推文中对它们在未来的发展做了大胆的陈述。

Server 组件是 React 的未来，我们的目标是将这一架构推广到整个 React 生态系统，不管是什么框架。

Vite

第五名的 Vite 是最流行的构建工具，用于构建基于 Web 技术的应用程序，同时提供令人惊喜的开发者体验。

它在今年有两个主要版本（ 7 月的 v3 和 12 月的 v4）。

它为越来越多的项目提供支持，包括框架 SvelteKit 和 Qwik 以及测试运行器 Vitest。

在 2022 年，React 仍然是冠军，但如果考虑到 Vue.js 的星星在 v2 和 v3 版本的仓库中被分割，那么 Vue.js 的受欢迎程度也很接近了。

主要的变化是 Qwik 跃升至第 2 位。Qwik 与 React 类似，它也使用 JSX 编写模板组件，但主要的区别是专注于在浏览器中执行最少的 JavaScript。

它是 “零基线 JavaScript” 框架趋势的一部分。网站和应用程序经常被繁重的 JavaScript 资产所臃肿，影响了浏览器的性能：即使页面在服务端渲染，用户也必须等待 JavaScript 被加载、解析和执行，才能与页面互动。

Qwik 没有依靠 hydration 为服务端生成的页面增加互动性，而是使用一种叫做 resumability 的技术来提供即时互动的 HTML。它的原理在 HTML 中序列化应用程序的状态。

该项目由 Miško Hevery 领导，他是 AngularJS 的创建者，AngularJS 的口号是 “为 Web 应用增强 HTML”，而Qwik是 "HTML 优先框架"...不知为何，它们在良好的古老 HTML 之上构建应用的意图是一样的。

2022 年，React 变得更加有主见。

React 仍然是一个可以用在任何网页上的库，但它也演变成了一个框架可以遵循的架构，以创建可互动、有弹性和高性能的前端模式。

React 18 版本（3 月）包括了并发的功能和 API，主要是为框架提供架构模式。考虑到 React Server 组件，旨在与这些新的架构模式一起实现。一些约定现在已经在 React 框架之间实现了标准化（例如，使用客户端），而其他的约定正在测试期中孵化（例如，Server 组件中的 async/await）。

在 2023 年，我们将继续看到使用 React 新基元的创新，但也会看到在更大的 React 生态系统中的创新。用于改进类型安全的库以及 UI 组件的增长将继续上升。

使得向 Vue 3 的过渡更加顺畅。<script setup> 变得稳定并普遍可用，处于实验阶段的全新 "Reactivity Transform" 即将到来，它将进一步增强开发者体验。团队还在研究一个新的渲染策略，叫做 "Vapor mode"，灵感来自 Solid.js，它可以使 Vue 在关键部分的性能更强。

Nuxt 3 和 Vuetify 3 的稳定发布表明，Vue 的生态系统已经足够成熟。Vite 在这一年里成倍增长，我们看到了 Vue 用户的大量采用，从 create-vue、Nuxt、Quasar、Astro 和许多新框架。借助 Vite 的力量，Vue 用户还通过 Vitest 和 Histoire 获得了更好的测试/开发体验。我们也看到了 Vue 的创造性用法，比如用 vue-termui 渲染一个命令行界面。

对于开发者体验的改进来说，这是多么好的一年啊! 希望社区能够发现这些能够改善他们的工作流程的工具，并期待着接下来的发展!

前端和后端框架之间的界限有点模糊，因为与 SPA 方式相比，现在有一种明显的趋势是在服务端做更多的事情（包括渲染和路由），而后端只负责API。所以本节包括全栈框架、元框架和后端框架。

Next.js

与去年一样，Next.js 在排名中领先，其第 13 版带来了较大的功能，包括 React Server 组件以及新文件系统结构，使用 app 文件夹让开发者将与他们的功能相关的代码都放在一起，并以强大的方式处理嵌套路由。

tRPC

最大的变化是 tRPC 的崛起，位居第二。 抛开 REST 与 GraphQL 不谈：还有为 tRPC 提供动力的 JSON RPC 2.0协议。 它的特点是可以从客户端导入服务器中定义的类型，以提供 “端到端类型安全”。

值得一提的是 t3-stack 项目，它将 tRPC、Next.js 和 Tailwind CSS 结合在了一个流行的模板中（位于总排名第16）。

Astro

在第三的 Astro 在2021年作为一个静态网站生成器崛起，并使部分 hydration 的概念流行起来。

Astro 团队对创造流畅的开发者体验的一丝不苟，在 Astro 1.0 的发布中得到强调。

新的 SSR 支持与任何前端工具（如 React 和 SCSS）的“烘烤”整合，使 web 应用开发感觉太干脆了

Remix

第四，Remix 保持快速增长。它于 2021 年开源，仅仅一年后就被 Shopify 收购。

在博文 The Web Next Transition 中，Kent C. Dodds 很好地解释了 Remix 与众不同的模式。

Remix 不依赖于静态生成的页面，而是利用分布式计算和本地浏览器功能，在浏览器中提供出色的性能和惊人的开发者体验。

今年，Vite 继续保持其发展势头，成为最流行的前端工具之一。其先驱 Snowpack 已不再维护，并推荐使用 Vite。它的发展并不限于 Vue 生态系统：Vite 也被用于SvelteKit、Storybook、Vitest，甚至作为Create-React-App的现代替代品。

我们也看到了 Nx 和 Turborepo 等支持 monorepo 的构建工具的崛起。Nwrl（Nx 背后的公司）已经接管了 Lerna 的维护，并发布了 Lerna 6，它默认启用了 Nx 的优化。

尽管 Babel 仍然很流行，但 swc 和 esbuild 已被许多项目和元框架广泛采用。这些新的工具可以大大提升构建和转译的性能。swc 是一个更加模块化的选择，因为它提供了一个插件系统。

Vercel 发布了 Turbopack(alpha)，这是一个由 Rust 驱动的非常快的全新构建工具，Tobias Koppers（Webpack 的原始创造者）正在研究它。

Rome 工具链已经发布了它的第一个稳定版本，包含一个 linter 和一个具有有趣属性的 formatter。不过开发者采用率很低，但今年可能会增加。

Rust 中的许多前端工具在今年应该都造就了不少新闻：

• Lightning CSS（以前是 Parcel CSS）：一个更快的 CSS 工具链
• Speedy TypeScript 类型检查器：一个比 tsc 更快的替代品
• mdxjs-rs: 一个更快的 MDX 实现