一、写在前面

本文的数据来源是 state-of-js ，是前端生态圈中比较有影响力的且规模较大的数据调查。
由于“JS 生态圈”这个话题很大，涉及到的技术很多，所以很多可以深挖的技术只能一笔带过，但能出现在 state-of-js 里的，都是有一定闪光点且有一定热度的技术，如果感兴趣的话可以深入了解。

二、调查人员统计

今年的 state-of-js 调查共回收了 11761 份调查报告，在中国区则回收了 182 份报告，占 1.2%，相比去年不论是绝对值还是占比都有所增加。

三、JS 特性

这张图根据技术分类划分，显示了各种特性的采用率。
外圈的尺寸代表了了解这个特性的用户数量, 而内圈的尺寸代表了实际使用这个特性的用户数量。

对于 JS 语言本身的特性，像可选链（Optional Chaining）、空值运算符（Nullish Coalescing）已经被大家广泛采用了；动态加载（Dynamic Import）、Promise.any、Promise.allSettled、Proxies 这些特性也有了一半左右的使用率了；而像 BigInt 这种就用的很少了。
对于浏览器的API，像 WebSocket、Shadow DOM 这些特性的使用率也很高了；但是像 WebRTC、WebGL 这种专业性比较强的 API 使用率就一直不高。
而对于其他特征，PWA 技术已经被大家广泛采用了，WASM 还有一些进步空间。

3-1、语言

空值运算符在这一年里有 20%+ 的涨幅，看得出来大家都在使用这个特性了。

可选链在这一年里也有将近 20% 的涨幅，这个特性也被大家广泛采用了。

Proxies这个特性有将近 10% 的涨幅，虽然用的人还是不多，但是看得出来还是在逐渐被开发者们接受的。

3-2、浏览器 API

浏览器 API 的使用率其实都没有太大的涨幅，只能矮子里拔将军找几个相对好一点的了。

Service Workers 有了 10% 的涨幅，还算不错，用的人越来越多了。

WebSocket 有着 8% 左右的涨幅，算是小幅度上涨吧。

3-3、其他特征

PWA 有着 15% 的涨幅，这个可以和 service workers 的涨幅结合来看，越来越多的开发者采用这种方式构建前端应用了。

WASM 有着 8% 的涨幅，不过随着 Rust 等语言，以及 FAAS 这种开发模式的流行，我相信 WASM 在未来会被更多的人使用的。

四、JS 技术

下面几张图展示了某项技术的使用人数和满意度的关系
使用人数很多且满意度较高的技术：

使用人数不是很多但满意度较高的技术：

使用人数不是很多且满意度也不是很高的技术：

4-1、前端框架

满意度：

使用率：

在前端框架方面，React 在使用率和满意度上都非常高，Vue.js、svelte 的满意度很高，但是使用率就没那么高了，而 Angular 虽然使用率还是很高的，但是满意度已经跌到 50% 以下了。

4-2、后端框架

满意度：

使用率：

在后端框架方面，Express 的使用率和满意度都很高，Next.js 紧随其后。另外值得注意的是，Koa 今年并没有在统计中出现，也许是因为 Koa 在国外真的不是很流行的缘故吧（又或许单纯只是设计问卷的同学忘记这个框架了，谁知道呢）。

4-3、测试工具

满意度：

使用率：

在测试工具方面，Jest 的使用率和满意度都还是稳居榜首（虽然 Jest 因为人力原因不维护了还是很让人感到遗憾的），Testing Library 的满意度最高，但是使用率还是偏低。

4-4、跨端技术

满意度：

使用率：

在跨端技术方面，基本上还是 Electron 和 RN 平分秋色，不过因为做混合应用的前端开发者还不是很多，所以实际上就算是使用人数最多的 Electron，使用率也没过半。

4-5、构建工具

满意度：

使用率：

构建工具这里真的是让人感叹“学不动了”，前几年我们都在吐槽“天下苦 webpack 久矣”，然后去年就跳出来了一个拥有闪电般打包速度的 esbuild，而今年又跳出来了一个使用原生 ESM 进行构建的工具 vite，不多说了兄弟们，慢慢学吧。

4-6、monorepo 工具

满意度：

使用率：

今年还额外统计了 monorepo 工具，对于这部分，pnpm workspace 的满意度最高，而 Lerna 和 yarn workspace 的使用人数最多。不过说实在的，monorepo 这种代码管理方式还不是很流行（甚至开发者们对于到底要不要用 monorepo 都还有一些争议），所以就算是使用人数最多的 Lerna，使用率也就在四分之一左右。

五、开发者对于 JS 的看法

5-1、JS 是否在向正确的方向发展

5-2、构建 JS 应用是否过于复杂

5-3、JS 生态系统变化是否太快了

5-4、使用 JS 的痛点

可以看到开发者们认为 JS 的痛点集中在依赖管理、代码架构和数据管理上。

六、总结

当下，JS 正在往一个越来越好的方向发展。现如今的 JS 生态里，既有成熟稳定、久经考验的技术存在，也有让人眼前一亮的新技术出现。
还记得前几年做 state-of-js 调查时，只有 21% 的人使用 TypeScript，而今天这一比例为 69%。虽然我们过去常常开玩笑说每天都会发布一个新的前端框架，但 React 和 Vue 现在已经连续 6 年占据主导地位。而且认为“JS 发展太快”的开发者们的比例也从 59% 下降到 38%。
当然这并不是说明 JS 语言本身已经停滞不前。可选链和空值运算符已迅速成为调查中使用最多的新特性（尽管他们实际上只有 2 年的历史）。
构建工具的生态也在快速发展，可以说 2021 年最亮眼的构建工具就是 Vite。 Vite 不仅以 98% 的满意度首次亮相，而且在调查中，第一年的使用率已经达到 30%，甚至超过了 esbuild。另外，Vite 并不是唯一一个试图改善 JS 构建生态的工具，调查中出现的 12 个构建工具中有 8 个才推出不到两年！
虽然 pnpm、Lerna 在 monorepo 工具中位居榜首，但只有 25% 的人真正使用了这些工具，这表明 monorepo 还有很长一段路要走。
随着 JS 的发展，有越来越多的开源开发者和企业为 JS 的生态添砖加瓦，相信随着他们的加入，JS 会变得越来越好。

【带你看看JS生态圈的技术趋势】state-of-js 2021 详细解读相关推荐

【带你看看开源圈的新趋势】GITHUB OCTOVERSE 2022 详细解读
一.写在前面 GITHUB OCTOVERSE 是由世界上最大的代码托管平台 GITHUB 发起的开源趋势调查,旨在探索开源的新趋势,以及对于开发者和软件公司的影响.通过分析 GITHUB OCTOV ...
博通语法纠错技术方案入选ACL2022，论文详细解读
语法纠错团队成功入选ACL 2022的中文纠错模型CRASpell和CNEG | 导语语法纠错是一项基础的NLP任务,在机器翻译.语音识别.自动问答等任务中具有重要的作用.我们针对中文语法纠错进行了 ...
2020 年大前端技术趋势解读
作者 | IMWeb 团队来源 | 腾讯 IMWeb 前端团队公众号如今的前端早已不再拘泥于满足页面展示,而是开始延展到通过全栈来闭环产品.这表明前端已经有能力透过业务深入产业,继而影响商业结果. ...
2020年大前端技术趋势解读
导 Lead 语如今的前端早已不再拘泥于满足页面展示,而是开始延展到通过全栈来闭环产品.这表明前端已经有能力透过业务深入产业,继而影响商业结果.这种表象的改变背后是本质的转变,从更为宏观的角度来说, ...
2020 年大前端技术趋势解读
来源:腾讯IMWeb前端团队时光荏苒,非比寻常的一年即将过去.在这过去的一年中,与其说前端的平稳期即将到来,不如说前端反而进入了技术深水区.换言之,在全栈和多端的影响下,前端领域里"术业有 ...
2022有哪些不容错过的后端技术趋势
本文来源:腾讯技术工程(id:Tencent_TEG) 前言最近几年注定是不平凡的时间,虽疫情肆虐,但我国互联网产业展现出巨大韧性,不仅为精准有效防控疫情发挥了关键作用,还在数字基建.数字经济等方面 ...
程序员必须关注的技术趋势，内附PDF下载链接
点击关注 InfoQ,置顶公众号接收程序员的技术早餐作者|ThoughtWorks 编辑|小智 ThoughtWorks 已于昨日发布了最新一期的技术雷达,InfoQ 第一时间拿到了先手资料,提取 ...
清华出品：最易懂的AI芯片报告！人才技术趋势都在这里
清华出品:最易懂的AI芯片报告!人才技术趋势都在这里 https://mp.weixin.qq.com/s/kDZFtvYYLLqJSED_0V1RZA 2010 年以来, 由于大数据产业的发展, 数 ...
原创 | 一文详解阿里云《人工智能红利渗透与爆发》技术趋势
在全球范围内,人工智能的应用已经非常普及.根据 Statista 预计,人工智能市场增速将保持年均50.7%的增速增长,到 2025 年,全球人工智能市场规模将高达369亿美元,随着人工智能在图像(包 ...

【带你看看JS生态圈的技术趋势】state-of-js 2021 详细解读