最近，一年一度的The State of JavaScript发布了最新的调查报告，这份报告收集了来自超过20000名工程师的反馈问卷，所以这份报告对于了解过去一年的JavaScript生态圈的情况非常有参考意义，可以帮助到你了解到哪些技术是未来的趋势，哪些技术是明显的坑。
在这篇文章，我会总结这份报告的精华部分和未来趋势，同时提供大量参考资料，帮你形成系统性知识体系。
总览
这次报告给出了一个非常酷炫的概览图表，可以一览众多技术并且了解各个技术的趋势以及技术同学对其的喜好。
这是一张各类前端技术在过去三年的趋势图，从两个维度来分析：使用情况和推荐情况
这是一张根据技术同学调查满意度汇总出来的图表，分为四个区间： 采纳（Adopt）：高使用，高满意度，可以无脑安全使用 评估（ASSESS）：低使用，高满意度，可以持续关注 分析（ANALYZE）：高使用，低满意度，如果已经采用需要重新评估 避免（AVOID）：低使用，低满意度，当前的坑应该避免采用
编程语言
从编程语言来看，TypeScript持续受到关注，在2019年，TypeScript已经成为第三方热门代码库的官方语言，例如Vue 3.0、Mobx、Ant Design等等都使用TypeScript进行了代码重构。可以预见在2020年，TypeScript与ES之间依旧会争夺第一前端编程语言的宝座，从势头和语言特性而言，TypeScript相对于ES优势明显，在大型前端项目中使用率会越来越高。
相关资料
前端框架
React和Vue保持强劲的趋势，使用率和满意度都持续提升，Angular虽然使用率还是持续提升，但是满意度却一年不如一年。在国内React和Vue基本是两分天下，甚至Vue从普及率上而言会更高。尤雨溪有一次分享关于前端框架设计的取舍中提到三大框架的对比，React的定位是前端Library，其他部分通过社区共建，Angular是一个大而全的Framework包罗万象，Vue的定位是一个渐进式前端框架，除去核心框架部分，还是提供了多样的标准化的能力。
React今年陆续发布16.x系列版本，提供了一系列诸如React Hooks、Fiber、Lazy、Suspense、Memo等等特性，预计会逐步改变当前Class为主的组件研发方式而转为Function为主的研发方式。
Vue在跳票了一整年后终于发布了Vue 3.0的Pre Alpha版本，与Hooks类似的函数式组件研发方式的Composition API，两者真的是越来越像了。
值得注意的是Svelte这个框架，一出道就获得许多的好评，它的一个核心诉求就是小和快，的确解决了当前前端框架过于臃肿的问题，值得大家多多关注。
相关资料
这可能是最通俗的 React Fiber(时间分片) 打开方式
数据管理
在数据管理这个层面，Redux当之无愧的一哥，但是满意度却不断下降，主要是因为Redux上手还是相当复杂，其中的概念以及模板代码非常多，要做异步操作还需要引入额外的中间件导致代码极度复杂，因此大家都是又爱又恨的状态在坚持使用Redux吧。
GraphQL+Apollo成为一对强劲的黑马，的确在Facebook的加持之下，GraphQL越来越受到重视，同时欧美互联网公司纷纷尝试，例如Airbnb就在今年的GraphQL Summit大会上分享过今年年底接近10%的线上流量将采用GraphQL的技术。
GraphQL技术在国内一直不温不火，似乎最大的作用就是作为原有Node BFF的替代方案，去整合、裁剪现有的REST API。的确，GraphQL需要前后端共同合作推进，划分清楚前后端的职责后，才能真正发挥作用。
相关资料
Airbnb：大规模代码迁移至Apollo+GraphQL的实践
后端技术
Express、Next、Koa、Nuxt、Gatsby依旧都还是后端JS技术的主流框架，Express长期一直占据第一的名次非常稳定。在国内，感觉Koa似乎受欢迎程度远比图中感受高很多。
相关资料
测试
测试对于代码质量提升起到非常重要的作用，应该引起大家的重视。虽然在初期研发效率上会有损失，但对于整个工程质量包括后续迭代改造都能够带来非常大的信心。因此，对于活跃的大型前端系统，测试应该作为其中重要的一环。
测试的体系包含单元测试、UI测试、端到端测试，每个方向又有众多的选择，可以下面的相关资料，选型为Jest（单元测试） + React Testing Library（UI测试） + Puppeteer（端到端测试）。
相关资料 万字长文总结前端测试体系建设与最佳实践
移动与桌面应用
在移动与桌面应用上，React Native和Electron还是占据了使用率优势，但从数据而言远远没有到非常流行的阶段。在RN的采用上，国内外又存在较大分歧，年中Airbnb放弃RN闹的沸沸扬扬，同时RN团队大规模重构也给大家对使用该框架的持续性引起质疑。相反，国内大厂还是积极拥抱RN技术，RN毕竟在当前的情况下，在用户体验和研发效率上取得了非常好的平衡。
不过，2019年Flutter抢走了不少RN的风头，其底层采用通用的C++渲染引擎，解决了多端渲染不一致的问题，同时也解决了原有JS和Native之间通信效率的问题，其宏大的跨Web、iOS、Android、Embeded等多端的愿景让众多开发同学激动不已。
相关资料
Airbnb弃用RN：Sunsetting React Native - 需梯子
Electron构建跨平台应用Mac/Windows/Linux
2020年的趋势判断
在2019年前端大事件回顾：流年笑掷，未来可期这篇文章中，已经提到了关于2020年的展望，摘抄如下。
- 随着代码拆分和PWA的进一步利用，性能仍然是Web上最重要的一部分。
- WebAssembly变得越来越普遍，得到了实际采用，并被用于产品中。
- GraphQL在新的创业公司和新项目上超过了REST，而老牌公司则向其迁移。
- TypeScript成为创业公司和新项目的默认选择。
- CSS-in-JS可能会成为默认的样式设置方法，而不是普通的CSS。
- “无代码”应用变得越来越流行。随着 AI 的改进和应用程序抽象层的增加，构建应用变得越来越容意
- Flutter可能会取代React Native成为构建跨平台移动应用的最佳方式。
- Svelte将会有更多实际项目使用。
- Deno（由Node创建者构建的TypeScript项目）可以实际使用。
- AR / VR使用诸如A-Frame，React VR和Google VR等库以及对浏览器中本机AR / - VR工具的改进，而取得了长足的进步。
- 容器化（例如Docker，Kubernetes）的影响在前端中变得越来越普遍。
写在最后
前端技术经过过去几年的飞速发展，在2019年其实并没有太多突破性的发展，大多都是延续原有技术的路径。其实每项技术都是需要经过漫长的技术成熟曲线才能得到大规模采纳的，因此，每个团队都有面临不同的业务阶段和技术阶段，立足自我，保持对新技术的敏感度，在合适时机选择合适自己的技术才是最好的。
推荐阅读
