近日，risingstars 出爐了“2021 JavaScript Rising Stars”報告。該報告結合過去 12 個月裡 GitHub 上新增的 star 數而對 2021 年 JavaScript 領域的優秀專案做了總結。
本次“2021 JavaScript Rising Stars”報告裡共包括以下部分：最受歡迎專案、前端框架、Node.js 框架、構建工具、Vue 生態圈、React 生態圈、CSS in JavaScript、測試框架、移動開發、桌面開發、靜態網站生成器、狀態管理
GraphQL。
本次總結報告裡，有不少有意思的結果，比如在“最受歡迎專案”裡，此次的新 “冠軍”居然是一個命令列工具。下面就是此次報告的主要部分，快一起來看看吧！
最受歡迎專案
Top10
本次年度流行專案 Top10 裡最受歡迎的是 zx —— 一款由谷歌推出的全新的工具，可用於以 JavaScript 或 TypeScript 編寫簡單的命令列指令碼。基本上它可以讓你在程式碼中嵌入任何 bash 表示式（ls, cat, git...等任何命令），並 await 使用 JavaScript 模板字串的結果。
它引入了由幾個流行的軟體包提供的實用工具：
- node-fetch 與瀏覽器中 fetch 有著相同的 API， 可建立 HTTP 請求。
- fs-extra 可處理檔案系統操作。
- globby 以使用者友好模式來匹配給定的檔名。
排在第二位的 Vite 是一款採用 esbuild 編譯器的效能優秀的構建工具。最初建立時，它僅與 Vue.js 社群相連，但現在它已經為 React、Svelte、Lit 這些主流的 UI 框架都提供了支援。
排在第三位的 Next.js 依舊保持了其在 React 世界中 “元框架” 的領先地位。
除了前三位，前十位裡的第五名 Tauri 是一款使用 Web 技術構建桌面應用程式的解決方案。與 Electron 相比，Tauri 是用 Rust 編寫的，且它不在每一個應用程式中搭載 Node.js runtime（Tauri 的 1.0 測試版剛於 5 月釋出）。
除了前十位，也有一些特選專案值得討論。比如 Astro 儘管沒有進入前十名，但卻是今年最值得注意的專案之一。由於採用較少的 JavaScript， Astro 也因此成為了一款載入速度更快的建站工具。
它的概念接近於靜態網站生成（SSG），但關鍵的區別在於，Astro 可以讓你在網頁中引入被稱為 “島嶼” 的動態互動部分。
在客戶端渲染動態元件時可應用不同的策略：
- 當頁面載入時
- 當頁面空閒時，如果它是一個低優先順序的元件（考慮跟蹤。）
- 當元件可見時，使用遊覽器 Intersection Observer API
最厲害的部分之一是 Astro 頁面可以用任何框架（React、Vue.js 或 Svelte...）編寫的 HTML 和元件來進行組合構建。
前端框架
此次報告結果中，“前端框架”一欄裡的排名前五分別是：React，Vue.js，Svelte，Angular，Solid。
其中，排名第一的 React ，是“JavaScript Rising Stars "活動評選以來首次被評為頭號 UI 框架的專案，但考慮到 Vue.js 被分成了兩個倉庫（第二和第三版本），所以實際上 Vue.js 才是第一名。
本次”前段框架“一欄排名最大的變化是 Svelte 的崛起，它超越 Angular 佔據第三位。如今，已有越來越多的工具或元件將 Svelte 納入目標框架中（如 Vite）。
此前關於“Svelte 的創造者 Rich Harris 正在加入 Next.js 背後的 Vercel 團隊”的重磅新聞相信大家都有所耳聞。與 Next.js 一樣，Svelte 也有自己的元框架來構建高效能的應用程式：SvelteKit。
排在第五名的 Solid —— 一款 React 有趣的替代品，其元件是用 JSX 編寫的，但它不像 React 那樣依賴虛擬 DOM。
值得注意的是，Solid 的出現也啟發了 Mitosis，後者一個針對任何框架（React, Vue.js, Angular, Svelte...）編寫和編譯元件的工具。
Node.js 框架
本次榜單的“Node.js 框架”一欄裡，排名前五的專案分別是 Next.js，Nest，Strapi，Remix，Nuxt。
一般而言，主要的 UI 框架都有自己的 “元框架” 來構建現代和可擴充套件的應用程式，提供諸如路由、伺服器端渲染、提前靜態生成頁面、為生產優化構建...等功能。
- React 的 Next.js，是這個類別的冠軍，也可以說是這個領域的先驅者
- Vue.js 的 Nuxt，現在分為 Vue.js v2 和 v3 兩個版本
- Svelte 也有 SvelteKit
如排在第四的 Remix 就是一款構建 React 應用的全棧框架。作為該類別中的新秀，Remix 也是今年最“有故事”的專案之一，因為它是由 React Router 的作者建立的，在 10 月之前，它只對付費支持者開放。
Remix 專案自公開以來得到了很多助力，其座右銘很明確：“Web 基礎，現代使用者體驗”，因為它的 API 儘可能遵循 web 標準（HTTP響應，表單提交...）。
除了這些元框架，在第二位的 Nest 是更傳統的伺服器端 Node.js 框架的領導者，不與任何 UI 庫相聯絡。
而排在第三位的 Strapi 像是個 “無頭 CMS” 的領導者，就是那些提供豐富的儀表盤讓使用者管理資料和現代 API 讓開發者從資料中建立任何東西的應用程式（最新版本提供了一個建立在 React 元件庫之上的設計系統）。
構建工具
在“構建工具”一項裡，排名前五的分別為：Vite，esbuild，swc，Turborepo，Nx。
剛剛過去的 2021 年裡，一些顯現的趨勢更進一步在發展。比如對原生 ES 模組的接納仍在持續，而 Vite 也已被廣泛採用（比 snowpack 更快），引領了一個新的工具生態系統（如 Vitest —— 一款基於 ES 的現代測試框架）。ES 模組也在 Node.js 生態系統中逐漸被接納，TypeScript 甚至在 Node.js 中推遲了對 ES 模組的支援。
知名開發者 Lee Robinson 曾稱“Rust 是 JavaScript 基礎設施的未來”。Rust 特別有趣，因為它既有很好的效能，又與 JavaScript 有互操作性。NAPI-RS允許 JavaScript 和 Rust 在沒有任何序列化成本的情況下相互通訊。而 Next.js 正押注 SWC（一款可擴充套件的 Rust 編譯器，允許他們將最流行的 Babel 外掛移植到 Rust）。
Parcel2 已經發布了一個新的 Rust 編譯器。Rome 工具鏈也正在用 Rust 重寫，但其創始人之一Jamie Kyle 剛悄無聲息地離開了公司。
Rust 顯然是一款領先的非 JS 語言，但它並不是唯一提供出色效能的語言。Bun 是用 Zig 語言寫的，該項裡排名第四的 Turborepo 和排名第二的 esbuild 是用 Go 語言寫的。值得注意的是，Evan Wallace 離開了 Figma：這可能讓他有更多的時間來研究 esbuild。
在 monorepo 領域，Lerna 仍然被廣泛使用，但維護得不是很好。而 Nx 則是一個有助於大幅減少構建時間的單引擎工具，一直在快速增長。其較新的競爭者Turborepo 在被 Vercel 收購後受益於巨大的營銷。
Vue 生態圈
在 Vue 生態圈“一項裡，排名前五的分別是：Slidev，Vue Element Admin，
Headless UI，Naive UI，vue-next。
在 Vue 3 正式釋出一年後，我們看到這個生態系統正伴隨著許多偉大的創新迅速發展。如 Vue 3 核心中的 <script setup>，將元件創作的體驗提升到一個新的水平；新的 VS Code 擴充套件 Volar 為 Vue 帶來了一流的 TypeScript 支援；以 Composition API 為基礎建立的新狀態管理器 Pinia 成為 Vuex 的繼承者。
隨著 Vite 成為 Vue 新的預設工具，Nuxt 3、Quasar 和 VitePress 等元框架現在都使用 Vite 作為其預設引擎，讓開發者體驗有了巨大的改進的同時，也為創新開啟了許多新的大門。
同時，社群也在調整 Vue2 到 Vue3 的開發者體驗上付出了許多努力，使遷移過程更加順利。對於 Vue 開發者來說，這是偉大的一年，他們的應用在開發者體驗和效能方面都得到了巨大的改善，期待看到 2022 年的更進一步發展。
React 生態圈
在”React 生態圈“一項裡，我們看到排名前五的分別為：Next.js，Ant Design，MUI (Material UI)，Remix，react-use。
隨著 React 18 即將釋出，現在已經可以使用 RC 版，並從一些開箱即用的改進中獲益，比如自動批處理以減少渲染或 SSR 對 Suspense 的支援。
React 18 增加了期待已久的併發渲染器和對 Suspense 的更新，但沒有任何重大的突破性變化。
React 繼續發力於瀏覽器和服務端，而且在 React Native 的多平臺願景下，它正變得無處不在。
最後，我們也將後續幾個類如 CSS in JavaScript、測試框架、移動開發、桌面開發、靜態網站生成器、狀態管理，GraphQL 裡的明星專案榜單一一列出：
CSS in JavaScript：
排名前五分別是 vanilla-extract，Styled，Components，Stitches，Twin，Emotion。
測試框架：
排名前五分別是 Playwright，Storybook，Cypress，Puppeteer，Jest。
移動開發：
排名前五分別是 React Native，Ionic，Expo，Quasar，Flipper。
桌面開發：
排名前五分別是 Tauri，Electron，Svelte NodeGUI，NodeGUI
，Neutralino。
靜態網站生成器：
排名前五分別是 Next.js，Astro，Docusaurus，Nuxt，Nuxt 3。
狀態管理：
排名前五分別是 Zustand，XState，Jotai，Recoil，Pinia。
GraphQL：
排名前五分別是 Prisma，Hasura GraphQL Engine，Redwood，Gatsby，GraphQL Code Generator。
綜述：
為了構建現代網站和應用程式，我們似乎已經進入了元框架的時代：Next.js、Nuxt、SvelteKit......以及前景廣闊的新秀 Remix。
如今，更有許多 JavaScript 社群的知名成員加入了科技公司，如 Kent C. Dodds 加入了 Remix 團隊，Svelte 建立者的 Rich Harris 及 Turborepo 創始人 Jared Palmer 均加入了 Vercel......越來越多的優秀的創作者共同從事這些解決方案的工作。
正如 Lee Robinson 放出豪言：Rust 是 JavaScript 基礎設施的未來。關於工具，對速度的需求導致了對 Rust 和 Go 等語言的轉變，而非 JavaScript。
作為 2021 年的一個重要主題，無伺服器功能及邊緣計算被人們常常談起，這裡就有 Vercel Edge Functions、CloudFlare Workers 或 Netlify Edge 等解決方案，在靠近使用者的地方執行後端程式碼。如 Next.js 或 Remix 這樣的元框架恰好就利用了邊緣計算的優勢，使 React 應用程式中後端程式碼的整合變得輕而易舉。
讓我們大膽預測一下，2022 年會不會是一個進入 JavaScript 全棧應用的鼎盛年份呢？如果您有相關看法，也歡迎在評論區交流互動。
點選檢視完整報告：https://risingstars.js.org/20...