欢迎收看第六期JavaScript新星，我们对Javascript领域的年度总结。2021年Javascript年度盘点希望大家不要错过，我们来聊聊元框架和前端潮流技术。但首先，今年我们有一个没有人预料到的新“冠军”，它是一个命令行工具！下图比较了过去12个月在GitHub上增加的星数。分析的数据源是BestofJS网站，它是与Web平台相关的最佳项目的精选列表。今年Top20中最受欢迎的项目是zx[1]，这是谷歌推出的一个新工具，可以用JavaScript或TypeScript编写简单的命令行脚本。googlezxstars：+24.3k基本上，它允许您通过使用带有JavaScript模板字符串的await运算符来嵌入任何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月发布了Beta版。SpecialSelection虽然没有进入前10，但Astro[11]是今年最值得关注的项目之一。Astro是一种用于构建加载速度更快的Web的工具，因为它提供的JavaScript更少。这个概念与静态网站生成(SSG)很接近，但主要区别在于Astro允许您在页面中引入称为“岛”的动态交互片段。在客户端呈现动态组件可以采取不同的策略：当页面加载时当页面空闲时，如果它是低优先级组件（考虑跟踪）。当使用浏览器的IntersectionObserverAPI[12]可见组件时，关于组件的最好的事情是Astro页面可以使用HTML和在任何框架中编写的组件的组合来构建：React、Vue.js或Svelte...端框架React自从我们运行JavaScript以来第一次RisingStars以来，React是最流行的UI框架，但是如果我们考虑到Vue.js被拆分成两个库（版本2和版本3），Vue.js实际上是领导者。Svelte最大的变化是Svelte的崛起，它排在Angular之前排名第三。越来越多的工具或组件将Svelte包含在目标框架中（例如，我们提到的Vite）。今年的头条新闻之一是Svelte的创造者RichHarris在Vercel加入了Next.js[13]背后的团队。与Next.js一样，Svelte也有自己的用于构建高性能应用程序的元框架：SvelteKit[14]。Solid第五，Solid是React的有趣替代品。组件是用JSX编写的，但它不像React那样依赖虚拟DOM。它启发了Mitosis[15]，一种可以为任何框架编写和编译组件的工具：React、Vue。一个可扩展的、可扩展的应用程序，提供路由、服务器端呈现、静态页面生成、生产优化构建等功能。React的Next.js是这个类别的赢家，可以被认为是这个领域的先驱Vue.js有Nuxt[15]，现在分为Vue.jsv2和v3版本Svelte也有SvelteKitRemixRemix[16]是一个构建React应用程序其全栈框架是该领域的新秀。这是今年最大的故事之一。它是由ReactRouter[17]的作者创建的，直到10月才对付费支持者开放。自该项目公开以来，它获得了很多关注（以及300万美元的种子资金，这也有帮助！）。它的座右铭很明确：“Web基础，现代用户体验”，因为它的API尽可能好地遵循Web标准（HTTP响应、表单提交......）。这里有两个让我大吃一惊的例子：要处理表单提交，你只需要做……正常的表单提交。这看起来很明显，但开发人员习惯于编写event.preventDefault()来避免表单提交。最好的部分是，它允许表单工作，即使禁用了JavaScript！Remix挑战我们习以为常的行为，将旧原则与注重用户和开发人员体验的新方法“重新混合”，它确实如此有趣。此外，它以非常智能的方式处理嵌套路由，能够以高效的方式加载给定页面上所有组件所需的数据，而不是生成通常会导致出现许多旋转指示器的HTTP调用瀑布屏幕上。除了这些元框架之外，Nest其次是不绑定任何UI库的更传统的服务器端Node.js框架的领导者。Strapi最后，Strapi[18]是“无头CMS”的领导者，这些应用程序提供丰富的仪表板，让用户管理数据，并利用允许开发人员从数据构建任何东西的现代API。最新版本(4)提供了一个构建在React组件库之上的设计系统。构建工具客座作者：SébastienLorberSébastien是一位早期的React布道者，在Docusaurus[19]上通过Facebook开源。他经营一份关于React和ReactNative的每周时事通讯-ThisWeekinReactIn2021，一个已经存在的趋势更进一步。原生ES模块的采用仍在继续。Vite已被广泛采用（比snowpack更快），导致了一个新的工具生态系统（例如Vitest，一个基于ES的现代测试框架）。ES模块也在Node.js生态系统中获得认可，但这并不容易。TypeScript甚至延迟了对Node.js中ES模块的支持。出于性能原因，越来越多的前端工具是用其他语言构建的（参见awesome-js-tooling-not-in-js）。Rust是JavaScript基础设施的未来，LeeRobinson写道。Rust特别有趣，因为它结合了出色的性能和与JavaScript的互操作性。NAPI-RS允许JavaScript和Rust相互通信而无需任何序列化成本。Next.js押注于SWC，这是一种可扩展的Rust编译器，允许他们将最流行的Babel插件移植到Rust。Parcel2发布了一个新的Rust编译器。Rome工具链也在用Rust重写，但其创始人之一JamieKyle刚刚悄悄离开了公司。Rust显然是领先的非JS语言，但它并不是唯一提供出色性能的语言。Bun是用Zig写的。Turborepo和esbuild是用Go编写的。值得注意的是，EvanWallace离开了Figma：这可能让他有更多时间从事esbuild工作。在monorepo世界中，Lerna仍然被广泛使用，但维护得不是很好。Nx是一种有助于大幅缩短构建时间的单引擎工具，一直在快速发展。它的新竞争对手Turborepo在被Vercel收购后受益于巨大的营销推动力。Vue生态特邀作者：AnthonyFuVue.js，Vite和Nuxt团队核心成员，VueUse和Slidev作者。在Vue3正式发布一年后，我们看到生态系统迅速发展并带来了许多伟大的创新。新语法，如Vue3核心中的设置，将组件创作体验提升到一个新的水平。新的VSCode扩展Volar为Vue带来一流的TypeScript支持；建立在CompositionAPI之上的新状态管理器Pinia成为Vuex的继任者。随着Vite成为Vue的新默认工具，Nuxt3、Quasar和VitePress等元框架现在使用Vite作为它们的默认引擎。它极大地改善了开发者体验，并为后续的创新打开了许多新的大门。社区也付出了很多努力来调整从Vue2到Vue3的开发人员体验，以使迁移过程更加顺畅。对于Vue开发人员来说，今年是伟大的一年，他们的应用程序在开发人员体验和性能方面有了巨大的改进。迫不及待地想看看2022年会发生什么！React生态系统客座作者：ManuelVilaManuel是一位独立的JS/TS工程师和开源贡献者。他创建了Layr和CodebaseShow。React18即将发布，RC现已可用，并受益于一些开箱即用的改进，例如减少渲染的自动批处理或对Suspense的SSR支持。React18添加了期待已久的并发渲染器和对Suspense的更新，但没有任何重大的重大变化。startTransition等一些并发特性将在18.0的初始版本中提供，但我们还需要再等待一段时间才能获得上一版JavaScript新星中提到的服务端组件。React在浏览器和服务器中继续蓬勃发展，并且在ReactNative的多平台愿景中，它变得无处不在。CSS-in-JS测试相关移动桌面静态站点状态管理GraphQL总结对于构建现代网站和应用程序，我们似乎已经进入了元框架时代：接下来。-混音。JavaScript社区的杰出成员加入了科技公司来研究这些解决方案：KentC.Dodds加入了Remix团队，并高度评价了它如何让他“构建令人惊叹的用户体验，同时仍然对代码感到满意”。Vercel似乎雇佣了其他所有人：Svelte的创建者RichHarris、React核心团队的SebastianMarkb?ge、JaredPalmer和他目前管理monorepos(Turborepo)的开源解决方案……看起来像一个梦之队！关于工具，对速度的需求导致转向Rust和Go等语言，而不是JavaScript。LeeRobinson强势表态：Rust是JavaScript基础设施的未来，我们多次提到Rust语言的兴起：TauriisRustbuilt-in。Rome项目实现了从JavaScript到RustNext.js的过渡最新版本（12）介绍用Rust编写的swc编译器SWC也被Deno使用，服务器端运行时是2020年的赢家。而且我们想说Deno仍然是一个新事物！它不断增强并暴露了Denobu'shu：它是边缘计算和无服务器的解决方案之一。说到“无服务器功能”，就不得不提到2021年的另一个重要主题——边缘计算。我们有VercelEdgeFunctions、CloudFlareWorkers或NetlifyEdge等解决方案来在靠近用户的地方运行后端代码。Next.js或Remix等元框架利用边缘计算的优势，让后端代码与React集成变得如此简单~2022年我们会进入JavaScript全栈应用的黄金时代吗？
