盘点2021年非常受关注的Javascript项目

新闻 前端 开发
这是我们对Javascript领域的年度总结。希望你不要错过2021年有关于Javascript的年度盘点。我们将会谈论到元框架以及时尚流行的前端技术。

欢迎来到 JavaScript Rising Stars 第6版,这是我们对Javascript领域的年度总结。希望你不要错过2021年有关于Javascript的年度盘点。我们将会谈论到元框架以及时尚流行的前端技术。

但是首先,今年我们有了一个新的“冠军”,这是没有人预料到的,它是一个命令行工具! 下面的图表比较了过去12个月在GitHub上新增的star数。分析的数据来源为Best of JS网站,这是一份精心策划的与web平台相关的最佳项目列表。

Top20

前三甲

今年最流行的项目是 zx [1] ,这是谷歌推出的一个全新工具,可以用JavaScript或TypeScript编写简单的命令行脚本。

google zx

stars: +24.3k

基本上,通过 使用 a wait 操作符与 JavaScript 模板字符串 ,它可以让你嵌入任何bash表达式(ls, cat, git…任何!)。它包括由几个流行的包提供的实用程序:

  • node-fetch [2] 在浏览器中使用相同的API进行HTTP请求
  • Fs-extra [3] 用于处理文件系统操作
  • globby [4] 匹配给定用户友好模式的文件名

其次, Vite [5] 是一个构建工具,它使用 esbuild [6] 编译器来提供卓越的性能。一开始它链接到Vue.js社区,但现在它已经可以支持前端业内主流的UI框架如:React, Svelte [7]  Lit [8] 

再次, Next.js [9] 保持了它在React世界中“元框架”的领先地位。

Tauri

第五名, Tauri [10] 是一个使用web技术构建桌面应用程序的解决方案。与Electron相比,它是用Rust编写的,而且它不会在每个应用程序中都搭载Node.js运行时。1.0版在5月发布了测试版。

特选

虽然没有进入前10名,但 Astro [11] 是今年最值得关注的项目之一。Astro是一个构建Web加载速度更快的工具,因为它提供了更少的JavaScript。

这个概念接近于静态网站生成(SSG),但关键的区别是Astro允许你在页面中引入被 称为“孤岛” 的动态交互性片段。

在客户端渲染动态组件可以采用不同的策略:

  • 当页面加载时
  • 当页面空闲时,如果它是一个低优先级组件(考虑跟踪)。
  • 当组件使用浏览器的 Intersection Observer API [12] 可见时

最好的一点是Astro页面可以用HTML和任何框架编写的组件的组合来构建:React, Vue.js或Svelte…

前端框架

React

自从我们运行JavaScript Rising Stars以来,React第一次成为最受欢迎的UI框架,但如果我们考虑到Vue.js被分成两个库(版本2和版本3),Vue.js实际上是领先者。

Svelte

最大的变化是Svelte的崛起,它排在了Angular之前,位居第三。

越来越多的工具或组件都将 Svelte 纳入在目标框架中(例如,我们提到了Vite)。

今年的头条新闻之一是,Svelte的创造者Rich Harris加入了 Next.js [13] 背后的Vercel的团队。

像Next.js一样,Svelte也有自己的元框架来构建高性能应用: SvelteKit [14] 

Solid

第五,Solid是React的有趣替代品。组件是用JSX编写的,但它不像React那样依赖于Virtual DOM。

它启发了 Mitosis [15] ,一个可以针对任何框架编写和编译组件的工具:React、Vue.js、Angular、Svelte……

node.js 框架

主要的UI框架都有自己的“元框架”来构建现代的、可伸缩的应用程序,提供了诸如路由、服务器端渲染、页面的静态生成、为生产优化构建等功能。

  • React的Next.js是这个类别的赢家,可以被认为是这个领域的先驱
  • Vue.js有 Nuxt [15] ,现在分裂为Vue.js v2和v3版本
  • Svelte也有SvelteKit

Remix

Remix [16] 是一个构建React应用程序的全栈框架,是这一领域的新秀。这是今年最大的新闻之一。它是由 React Router [17] 的作者创建的,直到10月份才对付费的支持者开放。

自从这个项目被公开以来,它获得了很多关注(以及300万美元的种子资金,这也很有帮助!)它的座右铭很明确:“Web基础,现代用户体验”,因为它的api尽可能地遵循Web标准(HTTP响应,表单提交……)。

下面是两个让我大吃一惊的例子:

要处理表单提交,你只需要做…正常的表单提交。这似乎是显而易见的,但开发人员已经习惯于编写event.preventDefault()来避免表单提交。最好的部分是,它允许表单工作,即使JavaScript被禁用,表单也能正常工作!Remix挑战了我们认为理所当然的行为,用注重用户和开发者体验的新方法去'remixing'旧原则,这真的太有趣了。

此外,它还以一种非常智能的方式处理嵌套路由,能够以一种高效的方式加载给定页面上所有组件所需的数据,而不是生成一个瀑布式的HTTP调用,而这通常会导致屏幕上出现许多旋转指示器。

Nest

除了这些元框架,其次, Nest 是更传统的服务器端Node.js框架的领导者,它不与任何UI库产生联系。

Strapi

最后, Strapi [18] 是“无头CMS”的领导者,这些应用程序提供丰富的仪表盘,让用户管理数据,以及利用现代API,让开发人员可以从数据构建任何东西。最新版本(4)提供了一个建立在React组件库之上的设计系统。

构建工具

特邀作者:Sébastien Lorber

Sébastien 是 React 的早期布道者,在 Docusaurus [19] 上与 Facebook 开源合作。

他运营着一份关于 React 和 React Native 的周报--This Week in React

在 2021 年,早已存在的趋势更进一步。

对原生 ES 模块的接纳仍在继续。Vite 已经被广泛采用(比 snowpack 更快),引领了一个新的工具生态系统(如 Vitest,一个基于 ES 的现代测试框架)。ES 模块也在 Node.js 生态系统中逐渐被接纳,但这并不容易。TypeScript 甚至在Node.js中推迟了对ES模块的支持。

出于对性能的考虑,越来越多的前端工具开始用其他语言构建的(见awesome-js-tooling-not-in-js)。

Lee Robinson 写道,Rust 是 JavaScript 基础设施的未来。Rust 特别有趣,因为它既有很好的性能,又与 JavaScript 有互操作性。NAPI-RS 允许 JavaScript 和 Rust 在没有任何序列化成本的情况下相互通信。Next.js 正押注 SWC,这是一个可扩展的 Rust 编译器,允许他们将最流行的 Babel 插件移植到 Rust。

Parcel 2 已经发布了一个 新的 Rust 编译器  Rome  工具链也 正在用 Rust 重写 ,但其创始人之一  Jamie Kyle 刚悄无声息地离开了公司 

Rust 显然是领先的非 JS 语言,但它并不是唯一提供出色性能的语言。Bun 是用 Zig 写的。Turborepo 和 esbuild 是用 Go 写的。值得注意的是,Evan Wallace 离开了Figma:这可能让他有更多的时间来研究 esbuild。

在 monorepo 领域,Lerna 仍然被广泛使用,但维护得不是很好。Nx,一个有助于大幅减少构建时间的单引擎工具,一直在快速增长。其较新的竞争者 Turborepo 在被 Vercel 收购后受益于巨大的营销。

Vue 生态

特邀作者:Anthony Fu

Vue.js、Vite 以及 Nuxt 团队核心成员,VueUse 与 Slidev作者。

在 Vue 3 正式发布一年后,我们看到这个生态系统正伴随着许多伟大的创新迅速发展。

新的语法,如 Vue 3 核心中的setup,将组件创作的体验提升到一个新的水平。新的 VS Code 扩展 Volar 为 Vue 带来了一流的 TypeScript 支持;以 Composition API 为基础建立的新状态管理器 Pinia 成为 Vuex 的继承者。

随着 Vite 成为 Vue 新的默认工具,Nuxt 3、Quasar 和 VitePress 等元框架现在都使用 Vite 作为其默认引擎。让开发者在体验上有了巨大的改进,并为后续的创新打开了许多新的大门。

社区还在调整 Vue2 到 Vue3 的开发者体验上付出了许多努力,使迁移过程更加顺利。对于 Vue 开发者来说,这是伟大的一年,他们的应用在开发者体验和性能方面都得到了巨大的改善。迫不及待想看到 2022 年即将发生什么!

React 生态

特邀作者:Manuel Vila

Manuel 是一位独立的 JS/TS 工程师和开源贡献者。他创建了 Layr 和 CodebaseShow。

React 18 很快就会发布,现在已经可以使用 RC 版,并从一些开箱即用的改进中获益,比如自动批处理以减少渲染或 SSR 对 Suspense 的支持。

React 18 增加了期待已久的并发渲染器和对 Suspense 的更新,但没有任何重大的突破性变化。一些并发功能如 startTransition 将在 18.0 的初始版本中提供,但我们还得再等等,才能得到 JavaScript Rising Stars 的前一版中提到的服务端组件。

React 继续发力于浏览器和服务端,而且在 React Native 的多平台愿景下,它正变得无处不在。

CSS-in-JS

测试相关

移动端

桌面端

静态站点

状态管理

GraphQL

总结

为了构建现代网站和应用程序,我们似乎已经进入了元框架时代:Next.js、Nuxt、SvelteKit……还有前途无量的新秀--Remix。

JavaScript社区的知名成员加入了技术公司,致力于这些解决方案:

Kent C. Dodds加入了Remix团队,并高度评价了它是如何让他“建立令人惊叹的用户体验,同时仍然对代码感到满意”。

Vercel似乎雇佣了其他所有人:Rich Harris, Svelte的创造者,来自React核心团队的Sebastian Markbåge, Jared Palmer和他现在的开源解决方案来管理monorepos (Turborepo)……看起来像一支梦之队!

关于工具,对速度的需求导致了转向Rust和Go等语言,而不是JavaScript。

Lee Robinson发表了一个强有力的声明:Rust是JavaScript基础设施的未来,我们多次提到Rust语言的崛起:

Tauri是内置Rust的.

Rome项目实现了从JavaScript转变到Rust

Next.js最新版本(12)引入了用Rust编写的 swc编译 

SWC也被Deno使用,该服务器端运行时是2020年的获胜者。并且我们想说的是,Deno 仍然是一个新事物!它不断得到增强,并且公开了Deno bu'shu:它是边缘计算以及serveless的解决方案之一。

谈到“无服务器架构”(Serverless functions),就不得不提到2021年的另外一个重要主题--边缘计算。我们有解决方案,如Vercel Edge Functions, CloudFlare Workers或Netlify Edge等在靠近用户的地方 运行后端代码 

像Next.js或Remix这样的元框架利用了边缘计算,使得后端代码与React 集成变得 so easy~

我们会在2022年进入JavaScript全栈应用的黄金时代吗?

责任编辑:张燕妮 来源: 奇舞精选
相关推荐

2023-01-31 16:35:34

JavaScript测试框架

2020-12-18 11:22:08

云计算开源Kubernetes

2020-08-05 16:10:11

Java开发代码

2021-12-26 23:02:16

加密货币金融区块链

2013-04-11 10:00:44

云计算项目开源Puppet

2021-02-04 10:13:08

大数据趋势大数据Gartner

2021-01-08 08:00:00

首席信息官IT超自动化

2022-01-04 06:54:31

通信行业产业链

2022-12-27 15:09:30

2021-03-21 22:16:47

JavaScript开发代码

2021-06-21 06:16:50

React React PDF 库前端

2021-03-14 07:31:27

云计算DevOps云应用

2021-12-06 09:36:38

网络攻击黑客网络安全

2022-01-26 09:41:25

边缘计算开源项目

2022-01-05 19:11:03

网络攻击黑客网络安全

2020-12-03 15:00:47

区块链互联网

2018-01-03 13:06:13

JavaScript成本开发

2010-12-06 09:17:50

电信云网络虚拟化

2021-06-15 11:10:00

JavaScript框架语言

2021-06-08 13:28:57

JavaScript开发代码
点赞
收藏

51CTO技术栈公众号