2020，前端主流框架和主题，以及下一个十年的技术趋势

点击“开发者技术前线”，选择“星标”

在看|星标|留言,  真爱

作者 | Eric Elliott 前端之巅

译者 | 王强

如果你想找到一份理想的 JavaScript 编程工作，或者想要追上 2020 年最重要的技术潮流，抑或是要展望下一个十年的关键技术趋势，那么这篇文章一定能满足你的需求。这篇文章并不是要告诉你哪些技术栈和框架是“最好的”，或者是最受欢迎 / 最流行的，而是要设法找出哪些技术能为你在 2020 年及之后的职业生涯中带来最多的机遇。

我们将研究来自众多来源的数据：

• 谷歌搜索趋势（按主题）：https://trends.google.com/trends/

• JS 现状调查：https://2019.stateofjs.com/

• Stack Overflow 调查：https://insights.stackoverflow.com/survey/2019

• Npm 下载数据：https://npm-stat.com/charts.html?package=react&package=vue&package=%40angular%2Fcore&package=svelte&package=jquery&from=2015-12-30&to=2019-12-30

• 职位需求汇总：https://www.indeed.com/

这些指标中没有哪个是完美无缺的，但就我们的目的而言，npm 下载次数和职位需求信息是最重要的，并且当我们综合起来研究这些指标时，它们就能描绘出关于 JavaScript 技术的前景和趋势的一幅清晰而连贯的画卷。那么，应该根据这些指标来选择要学习哪个框架吗？这就取决于你自己的目标了。

由于我们有一个明确的目标——也就是为求职者测算投资回报率——这样就用不着设法告诉人们哪种技术是大众的最佳选择，任务也就简单得多了。我们无法找到在所有场合中都是最优选择的事物，相比之下，当你要实现一个特定而具体的目标时，我们就能很容易地客观定义出能为你带来最多机遇的事物。下面我们来看一些数据。

首先，学习 JavaScript

先别那么操心技术栈的问题，在那之前请好好学习 JavaScript，学习如何使用它来编写软件。如果你搞不清楚什么是函数组合、对象组合和模块，请从这里开始学习：

https://medium.com/javascript-scene/composing-software-the-book-f31c77fc3ddc

软件开发的一切工作都是组合：我们研究一个大而复杂的问题，将其分解为许多较小的问题，然后就可以用软件的许多构建块来解决这些问题：这些构建块包括函数、对象和模块等。然后我们将这些解决方案组装起来，就形成了我们的应用程序。在 2020 年，你的学习计划的第一步就应该是充分了解 JavaScript 和软件组合的知识。

React 可能继续独占鳌头

我喜欢 npm 下载指标，因为它可以很好地表明一个框架的活跃使用率。由于用户会在他们的本地计算机上运行 npm install，因此行业中常用的框架会拿到非常高的下载分数。

注意：这里不包括 jQuery，因为许多 jQuery 项目是不使用 npm 的旧项目，因此它的表现一定会被严重低估。上图中加入 Svelte 是为了提供一些关于其在市场中相对位置的信息，并给出它在其他图表中缺席的理由——Svelte 尚未积累足够的数据来在后面的图表中找到自己的位置。例如，它在谷歌搜索趋势中还不是一个可用的主题。

职位需求信息汇总

下面这张图表统计了现有职位需求信息中提到某个具体框架的频率。

按照 UI 框架分类的 2019 年 12 月职位需求统计

与去年相比，React 的领先优势进一步加强了，而 Angular 和 jQuery 都输给了 Vue。下面是一张饼图，展示了每个框架在就业市场中的相对份额：

顶级框架的就业市场份额

JavaScript 开发人员的平均工资在 2019 年又增长了一些，从每年 11.1 万美元增加到每年 11.4 万美元：

https://www.indeed.com/salaries/javascript-developer-Salaries

研究方法：职位需求数据是在 Indeed.com 上搜索统计的。为了消除假正结果，我在搜索时加上了“软件”关键字以增强相关性，然后乘以 1.5（在编程职位需求中使用了“软件”一词的职位相数量大约是没有使用这个词的职位数量的两倍。）所有 SERPS 均按日期排序，并抽查相关性。得出的数字并非 100％准确，但是对于本文中所要使用的相对近似值来说精度已经足够了。

谷歌搜索趋势

如你所料，搜索兴趣在某种程度上反映了就业市场份额，但它们之间也存在一些有趣的差异。我们可以清楚地看到，从 2017 年到今天，人们对 jQuery 的兴趣在减弱，并且 Vue.js 的搜索兴趣在强劲增长。以下是搜索份额饼图：

与职位需求数据所显示的一样，React 拥有显著的领先优势，吸引了前端框架领域 36％的搜索量，其次是 Angular（约 27％）和 jQuery（25％）。对 Vue.js 的搜索兴趣比其就业市场的份额要大得多，但这里的排名与就业市场数据中的排名是一致的。看来我们已经成功地证实了几大框架的市场地位现状。

研究方法：对于所有条目，数据都是按主题而不是搜索关键词来收集的，以便排除无关的关键字匹配导致的假正数据。

未来值得关注的框架

相比其他颇受欢迎但使用不那么广泛的框架（例如 Svelte 或 Vue，两者均有很高的满意度，但行业采用率相对较小）相比，需求 React 技能的职位需求数量更多。

学习 Svelte 或 Vue 可能很酷——但是如果你的目标是找到一份工作，那么先学习 React 就会有更好的机会。

话虽如此，Svelte 和 Vue 在《2019 年 JavaScript 现状调查》中的用户满意度得分都很高。回顾过去，React 的增长速度超越当时占主导地位的 Angular 之前，前者的用户满意度分数也很高，后者的分数却相对较低。

在 2019 年，React 的用户满意度排名最高，满意度达到了 89％。亚军包括 Svelte（88％）和 Vue.js（87％，低于去年的 91％）。Svelte 或 Vue 不太可能会抢走足够的 React 用户来开辟出一片天地，但是还有很多使用 Angular 和 jQuery 的用户可能会转向 Svelte 或 Vue，从而在 2020 年推动这两个框架进一步的强劲增长。

可以肯定的是，掌握 React 技能将会增加你在 2020 年找到并维持一份好工作的几率。

TypeScript vs JavaScript

毫无疑问，过去几年中 TypeScript 的增长非常迅速，根据 JavaScript 现状调查，有 89％的 TypeScript 用户会再次使用它，而 66％的调查受访者在使用 TypeScript，或有兴趣使用 TypeScript（比上一年份的 71％略有下降）。

但是，尽管人们对 TypeScript 的兴趣显然很强，并且其使用率似乎正在迅速增长，但是就业市场上对 TypeScript 的开发经验还没有强烈的需求。只有约 7％的 JavaScript 职位空缺在职位描述中提及了 TypeScript。这可能会稍微低估了 TypeScript，因为招聘经理希望 JavaScript 开发人员能够在使用 TypeScript 时不出什么大乱子，因此他们有可能不会在职位描述中提及 TypeScript。

我还是坚持自己之前的观点，认为 TypeScript 语言的投资回报率可能较低甚至为负：

https://medium.com/javascript-scene/the-typescript-tax-132ff4cb175b

它可能会损害而不是提升你的生产率，并且，如果你已经在使用 TDD、代码审查和设计审查等出色的漏洞预防措施，则那么用 TypeScript 编程不太可能带来明显的漏洞减少收益。

但反过来说，TypeScript 也有众多可喜之处，你当然不应该害怕它，或者因为某个职位要求使用 TypeScript 而不是 JavaScript 就拒绝它。由于 TypeScript 是 JavaScript 的超集，因此从 JavaScript 转向 TypeScript 时，并不像学习一种全新语言那样具有挑战性。

你可能不需要学习 TypeScript 语言就可以在 2020 年的就业市场竞争中脱颖而出，但是 TypeScript 引擎非常有用，即使对于标准 JavaScript 来说也是如此。

我每天都使用它，在 Visual Studio Code 中为标准 JavaScript 提供智能感知。甚至可以使用 JSDoc（可被 TypeScript 引擎理解并解释，因为它会解释类型注释）或外部 d.ts 文件来增强这种智能感知，并且 VS Code 将自动为你使用的模块获取 TypeScript 定义。

注意：使用 TernJS 和 Atom 多年来，我一直在享受类似的好处，但是这种组合缺乏 TypeScript 引擎 +VS Code 组合的维护性和社区支持。

如果你尚未尝试过 Visual Studio Code，则可能要先从那里开始入门。顺便说一句，根据 JS 现状调查的受访者回馈，VS Code 主导着 JavaScript IDE 市场，占有 57％的市场份额（其次是 WebStorm，占有 14％的市场份额）。

数据管理

Redux 在状态管理器竞赛中仍然保持着显著的领先优势，但是 GraphQL 和 Apollo 在满意度和兴趣指标上都在进步。预计 2020 年 GraphQL 会持续增长。

不过即使你在使用 GraphQL，我仍然认为 Redux 状态管理有着明显的优先级，而且我认为即使我们不使用框架，也能从 Redux 的学习中受益。

GraphQL 是近年来开始流行的查询语言。它具有简单的语法，但由于它是用在整个堆栈中的，并且学习它时需要学习如何将其连接到你的数据存储层上，因此集成它的工作可能会非常复杂——但也值得为此付出努力。

GraphQL 不会在短期内完全取代 JSON REST API，但是它在 2019 年的增长速度更快了，同时我预计其强劲的增长势头将持续到 2020 年。

   后端   

Express 是占据统治地位的 Node 框架，其满意度很高，到 2020 年也不会有像样的挑战者。但是随着无服务器的兴起，我认为在新的十年中 Express 的统治力将逐渐下滑。

Next.js 是一个全栈 React 框架，最初是在 Express 之上构建的，但此后已从 Express 切换到了 无服务器 和静态优化上，并且开始疯狂增长。

当我们将 EricElliottJS.com 从 Express 切换到无服务器的 Next.js 后，托管费用降低了 90％，并页面加载速度也提升了。我向大家全力推荐它。我们现在的所有应用都在使用 Next.js 和 Zeit 托管。

   测试   

Jest 和 Cypress 分别是最受欢迎的单元测试和功能测试技术，但是我个人特别钟意 RITEWay 和 TestCafe。RITEWay 是单元测试的禅师：这个测试框架一直在遵循"每个单元测试必须回答的 5 个问题"的理念。

TestCafe 是一种功能测试工具，和 Cypress 一样，它也不需要你纠结于 Selenium，但是前者具有更好的跨浏览器支持和一个很棒的测试记录器 / IDE。我强烈建议 QA 小组试一试 TestCafe。

实用工具

Lodash、Ramda、Immer、Redux 和 RxJS 都是我经常使用的实用工具。

Ramda 在 2019 年取得了长足发展，并提供了 Lodash 没有的一些工具，包括 lenses 和 transducers。RxJS 通过其 pipeable 运算符提供了 transducer 风格的功能。

使用 Immer 可以很容易在 JavaScript 对象上进行操作，而无需更改它们。Redux 是一种状态管理工具。

2020 年代的技术展望

在接下来的十年中，有几种新兴技术将对人类生活产生巨大影响。以下是各项前沿技术的概况介绍：

AI

人工智能可能是有史以来最具变革性的技术。众多学者和野心勃勃的亿万富翁都将 AI 描述为一个奇迹般的乌托邦，甚至是人类社会的终结。

正如我们所知，这肯定会是人类的终结，但也可能是人类与机器之间美好合作的开始。我们才才刚刚开始看到一些 AI 未来形态的可能性。其中有些很吓人（如 deep fakes，https://www.youtube.com/watch?v=cQ54GDm1eL0），有些则非常有用（如 Adobe Premiere 新的视频编辑 auto-reframe 功能，https://www.youtube.com/watch?v=4ZHRV_-yXSY）。目前为止的事实是，人工智能既非常可怕，又非常有用。人工智能技术将继续产生一些令人恐惧的事情，但是通过人工智能来改善人类生活的潜力是巨大的。潘朵拉的盒子已经打开，无法再关闭，所以我希望你能很好地使用它来解决重要问题并改善人们的生活。

在 2019 年，AI 领域有许多重大突破。近年来，研究团队一直在你追我赶，设法在多种视频游戏中取得超过人类的表现，但有些游戏类型对 AI 来说仍然是很大的挑战，其中包括《星际争霸 2》之类的长周期战略游戏。DeepMind 的 AlphaStar 计划已经用与人类玩家相同的资源，在 Battle.net 官方服务器上达到了大师级水平。《星际争霸》是一款复杂的游戏，涉及长期的战略思考，曾经被认为超出了 AI 的能力所及。战略思维是通向通用 AI 的道路上的一个重要里程碑。

如果你觉得将资源用在这些游戏上看上去很愚蠢，那么请考虑这样的事实，那就是 DeepMind 这样的项目在文本转语音领域也取得了令人难以置信的进步，这可以使 AI 代理和私人助理获得更自然的声音，同样重要的是还可以让聋哑人找回失去的发声能力。

https://youtu.be/V5aZjsWM2wo

人工智能还被用于诊断癌症、预测蛋白质折叠（可用于了解疾病和发现新药）、恢复残疾人的对肢体的控制、生成逼真的照片，等等。

https://www.stateof.ai/

无人驾驶汽车 在变革性的 AI 技术中应该有自己的一个独立类别。这一生态系统的主要参与者包括 Cruise、Uber、Waymo、Nuro、Aurora 和福特等。这项技术还处于发展初期，而过度乐观已给这一行业带来了许多严重的问题，但毫无疑问，我们将在 2020 年代看到超越人类的自动驾驶能力走向现实。在 2015 年，我曾对自动驾驶技术做出了预测：

“到 2045 年，自己开车的人看起来会像是拉着越野车的马。”

5 年时间过去了，我想我可能低估了自动驾驶汽车进入市场的速度。Waymo 的汽车在 2018 年行驶了超过 100 万英里，自动驾驶汽车已经行驶在了美国 24 个城市的公共道路上。如今，我预计到 2025 年，来自多家制造商的多种车型将实现 5 级全自主驾驶能力。请密切关注特斯拉、通用汽车、福特和宝马的动向。

在过去的十年中，AI 研究论文的出版量增长了 10 倍，如今 AI 正在将众多有用的实践工具交由主流用户使用，可以预期这种趋势将持续到新的十年。

我们已经看到 AI 开始做一些几年前大多数人都不敢相信的事情。期望 AI 在 2020 年代创造更大的奇迹。

区块链和加密货币

2019 年是区块链和加密货币世界中具有里程碑意义的一年。区块链技术开始进入主流。我预计到 2020 年这一领域会有更多的增长和主流应用。

DeFi 迎来了爆炸式增长，实现了用户友好、无许可和无银行参与的借贷。目前，DeFi 合约锁定了 6.5 亿美元（包括 4.5 亿美元的无银行贷款），而这项技术在 2019 年才刚刚实用化。随着越来越多的人投资加密货币，我预计未来会有更多由加密货币支持的 DeFi 贷款。

人们可以在不牺牲其加密投资机会成本的前提下获得流动性，或使用 DeFi 贷款杠杆投资加密货币（增加其投资的风险 / 回报）。

加密和区块链技术正在进入主流领域。比特币和以太坊的每日活跃地址在 2018 年 1 月达到顶峰，随后一年由于市场下跌而逐渐衰落（每上涨 10 倍后，加密货币的价格会大幅回落，然后在下一个周期比之前的峰值高出 10 倍）。

比特币和以太坊区块链上的每日活跃

Square 的 Cash App 拥有超过 1000 万次的 Android 下载量，用户可以通过具有出色 UX 的简单应用购买、出售、发送和接收比特币。

Coinbase 有超过一千万的 Android 下载。

Brave 推出了内置的以太坊钱包，且其月活跃用户从十月份的 870 万增加到了 11 月底的 1,040 万 MAU：

https://twitter.com/BrendanEich/status/1202703230154633216

借助 Sliver.tv 和 DLive，2000 万视频游戏粉丝正在使用 Theta 网络进行去中心化流媒体播放。

2019 年我最喜欢的一项进展是 Fortmatic 的推出。无论你是否在构建加密应用，都可以用 Fortmatic 代替用户身份验证并提高安全性，摆脱对厂商的依赖，并添加诸如端到端加密和签名交易等功能。

如果你要在 2020 年构建新应用，请考虑使用 Fortmatic 代替自己开发的用户名 / 密码身份验证（2020 年应该没人会这样做），或者将身份验证任务委派给谷歌和 Facebook 等。

我写了一篇文章，讨论如何利用加密技术来改善应用程序的身份验证功能和安全性。我很期待看到主流应用在 2020 年采用 Fortmatic 等技术。

https://medium.com/javascript-scene/improving-user-authentication-and-security-ddb60b1ef69b

以太坊在 2019 年轻松赢得了智能合约平台竞赛。我预计它将在 2020 年继续占据主导地位。

扩展现实（XR）

自 2015 年以来，我每年都在写关于 AR 的承诺，而且我从小就梦想着能看到它的实现。将来 XR 技术将取代手机。这只是时间问题。我们要等待多久仍然是一个悬而未决的问题，但看来这种转变可能会在未来十年内出现。变革甚至可能在未来 5 年内开始。

由于虚拟现实和增强现实之间的界限已经很模糊了，业界现在将整个领域称为 XR（扩展现实）。自问世以来，ARKit 和 ARCore（分别是苹果和谷歌的增强现实 SDK）已经取得了很大进展。从 2017 年到 2019 年 5 月，其每月活跃用户从 4700 万增长到了 1.5 亿。

https://mobidev.biz/blog/augmented-reality-future-trends-2018-2020

WebAR 在 2019 年站住了脚跟，并且有可能在 2020 年继续增长。如果你对此感到好奇，请查看：

• AR.js：https://github.com/jeromeetienne/AR.js/

• React 360：https://facebook.github.io/react-360/

• Viro React：https://viromedia.com/viroreact

硬件方面也有了很多进步。Hololens 的开发者版于 2016 年首次发布时，其售价约为 5,000 美元。自那以后发生了哪些变化？

Hololens 2 仍然要价 3500 美元，并且还不是为消费者准备的。裁剪、SLAM（抖动和漂移）和视野等问题仍然存在。你不会想要一整天都戴着这些东西。但现在有了每月 99 美元的定价模式，你也有可能获得一套开发者工具包了——只不过可能要在名单上等候一段时间。

https://youtu.be/KvunJrK_IjM

无人机

在美国已经售出了大约 200 万架无人机，它们已经为建筑、地理调查、制图、电影、航空摄影、农业、环境科学和娱乐等行业带来了变革。商用无人机快递很有可能在 2020 年的美国成为现实。

https://spectrum.ieee.org/aerospace/aviation/us-commercial-drone-deliveries-will-finally-be-a-thing-in-2020

FPV 无人机竞赛是我最喜爱的现场运动，此外还有无人机竞赛联盟直播比赛。如果你想了解它们的体验，他们还提供了精心设计的模拟器。

https://store.steampowered.com/app/641780/The_Drone_Racing_League_Simulator/

https://youtu.be/x1VWKgKZHQg

所有这些新的无人机用途都需要很多软件，包括图像处理、无人机地图绘制软件、快递飞行计划、遥测记录和处理、分析、行业应用程序集成等。

无人机与 AI 技术也有很多重叠之处——自动飞行的无人机需要图像处理、避免碰撞等能力。

   结论   

2010 年代为我们提供了许多变革性技术，其中许多已经被我们视为是理所当然的事物，产生了巨大的影响力：

• Instagram

• Spotify

• 优步

• 虚拟助手

• 无线耳塞

• 主流 VR

• 增强现实（用在了热门游戏"宝可梦 GO"中）

• 经济实惠的特斯拉汽车

• 共享经济（汽车、踏板车、自行车）

• 主流平板电脑

• 主流生物识别技术（触摸 ID，面部 ID）

• 众筹

我迫不及待想看看你们在新的十年中将要创造的事物。

创造一些奇迹吧。

下一步

在 EricElliottJS.com 上学习 React、Redux、Next.js 和 TDD 等技术。会员可获取一整套珍贵的视频课程和交互式代码练习。

作者介绍

Eric Elliott 是《撰写软件》和《编写 JavaScript 应用程序》这两本书的作者。他是 EricElliottJS.com 和 DevAnywhere.io 的共同创始人，并教授开发人员基本的软件开发技能。他创建并指导数字货币项目的开发团队，并为 Adobe Systems、Zumba Fitness、《华尔街日报》、ESPN、BBC，和包括 Usher、Frank Ocean、Metallica 等在内的顶级唱片艺术家贡献了自己的软件经验。

他与漂亮的妻子一起过着隐士般的生活。

延伸阅读

https://medium.com/javascript-scene/top-javascript-frameworks-and-topics-to-learn-in-2020-and-the-new-decade-ced6e9d812f9

福利：

在这里，我为大家准备了一份2020年最新最全的面试题及答案，这套电子书涵盖了诸多后端，客户端，前端技术栈的面试题和答案，相信可以帮助大家在最短的时间内复习的大多数面试题，从而拿到自己心仪的offer。

END

历史推荐

点个在看吧