前端技术观察第12期 – 2020 年 Node.js 将会有哪些新功能

• 2020 年 1 月 2 日
• 筆記

《前端技术观察》是由字节跳动 IES 前端团队收集、整理、推荐的业界高品质前端资源合集，主要分为以下几个板块：

• Highlights – 业界最新的技术、热点文章 – 业界对（新）技术的深度地、优秀地实践
  • 《前端技术观察》的目的是让大家：
  • 好的教程、深度解读已有技术的文章
  • Tutorial
  • Tools And Codes – 优秀的工具、库
• 更及时的了解到业界最新的技术
  • 受益于高质量的教程、文章
  • 了解业界更优秀的代码、工具
  • 更多地、氛围更浓厚地讨论、研究、落地技术

highlights

前端领域在 2019 都发生了什么[1]

回顾这一年的重大事件、新闻和当前前端开发领域最流行的那些事物~

https://levelup.gitconnected.com/a-recap-of-frontend-development-in-2019-1e7d07966d6c

2020 年 Node.js 将会有哪些新功能[2]

2019 年是 Node.js 诞生的第 10 个年头，npm 上可用的包数量超过了 100 万。Node.js 社区仍在蓬勃发展，即便是到了 2020 年仍然没有放缓的迹象。

https://juejin.im/post/5df7007b518825122c4ca882

如何提升低端设备的 Web 性能？试试自适应加载模式[3]

任何用户都可能有过运行缓慢的体验。这个世界的设备千差万别，“一种规格”走天下的体验可能并不是哪里都行得通。一些网站满足了使用高端设备的用户，但在低端设备上却可能卡得没法用。特别是在普通的移动设备和桌面硬件，以及新兴市场的主流设备上尤为明显。

https://www.infoq.cn/article/cIQV4pJkHL3xsK0r7VtP

深入浅出 Serverless：优势、意义与应用

Serverless 是炙手可热的技术，被认为是云计算发展的未来方向。尤其是在前端研发领域，使用 Node 开发云函数，可以让前端工程师更加专注于业务逻辑，实现全栈工程师的角色转变。

https://mp.weixin.qq.com/s/geT7x5RG4xhD-Ro1eZvrdg

你真的了解 React 生命周期吗[4]

对比了新旧的生命周期，梳理了一些常见问题

https://juejin.im/post/5df648836fb9a016526eba01

看不见的 CSS-in-JS 性能消耗[5]

CSS-in-JS 在现代的前端页面开发中越来越受欢迎，因为它提供了类 JS 方案去书写样式。这篇文章讨论了相关书写导致的性能问题，我们可以在日常开发中，酌情适当使用 CSS-in-JS。

The unseen performance costs of modern CSS-in-JS libraries in React apps

11 个开发者应该了解的命令行指令[6]

相比于点击 GUI 操作计算机，命令行使我们的开发更为简单便捷。本篇文章介绍了 11 个日常开发中会经常使用的指令，大家可以立马学习上手用在实际工作中~

https://medium.com/better-programming/here-are-11-console-commands-every-developer-should-know-54e348ef22fa

WICG 引入了展现锁定，实现更快的 Web 渲染[8]

Web 孵化社区群组（Web Incubator Community Group，WICG）最近引入了展现锁定（Display Locking）提案，该提案可以轻松提高浏览器页面内容量并对渲染进行控制。

https://www.infoq.cn/article/C3X8UFi7pXM5Ss9WXyy1

新创立的字节码联盟宣布 WebAssembly 微进程提案，旨在安全使用非信任模块[9]

来自 Mozilla 的 Lin Clark 最近宣布创立字节码联盟（Bytecode Alliance）。字节码联盟提出了微进程（nanoprocess），为运行第三方 Wasm 包提供了隔离和安全性。

https://www.infoq.cn/article/LODHgj9UIdEPTspevYov

tutorial

Node.js 在携程的落地和最佳实践[10]

本文主要介绍在携程，Node.js 技术栈是如何从 0 到 1 进行技术落地的，以及在不断磨合的过程中，总结出来的最佳实践。

https://www.infoq.cn/article/3sDgGFdAGQFH2vPgMKUd

Airbnb：我们如何将大部分 API 迁移到 GraphQL[11]

Airbnb 已经成功地将其大部分 API 迁移到了 GraphQL ，从而缩短了页面加载时间并提供了更直观的用户体验。

https://www.infoq.cn/article/WaZ5OMwZ16o86uGv7p2z

高质量前端快照方案：来自页面的「自拍」[12]

将网页保存为图片（以下简称为快照），是用户记录和分享页面信息的有效手段，在各种兴趣测试和营销推广等形式的活动页面中尤为常见。

https://juejin.im/post/5df2e8ab6fb9a0163770816d

20 个帮你成为更好的 NodeJS 开发者的方法[13]

作者经过细心挑选，整理收集了 20 个 NodeJS 小技能。

https://medium.com/@me_37286/20-ways-to-become-a-better-node-js-developer-in-2020-d6bd73fcf424

提升 JS 测试能力的葵花宝典[14]

这篇文章从 A 到 Z 给出了 JavaScript & Node.js 的稳定性指南。它为你整理总结了市面上大量的最佳博客文章、书籍以及工具。

https://github.com/goldbergyoni/javascript-testing-best-practices/blob/master/readme-zh-CN.md

tools And codes

Javascript Algorithms 最全指南[15]

此篇包含了多种基于 JavaScript 的算法与数据结构。每种算法和数据结构都有自己的 README，包含相关说明和链接

https://github.com/trekhleb/javascript-algorithms/blob/master/README.zh-CN.md

如何在 JavaScript 中处理 null 和 undefined？[16]

在 JavaScript 的开发工作中，许多开发人员都头疼的一个问题就是处理可选值。怎样才能最大程度减少由 null、undefined，或在运行时未初始化的值所引发的错误，有哪些最佳策略呢？

https://www.infoq.cn/article/tsfJmMq4sPa9kmsBKypY

npm-run-all 命令来啦[17]

一个可以让你执行更多 npm-scripts 的命令行

https://github.com/mysticatea/npm-run-all

使用 useAuth 快捷接入鉴权你的 React APP[18]

useAuth 是目前最简单的 React 鉴权方案，包括用户管理、Cookies、组件内状态分享、登录逻辑等等，开箱即用。有兴趣可以看看源码是怎么实现的。

https://swizec.com/blog/useauth-the-simplest-way-to-add-authentication-to-your-react-app/swizec/9179

如何使你的 JSX 更清晰[19]

相信大家都经历过组件在不断堆叠逻辑后，JSX 语法是如何地难以理解。这时候，你需要几个方法论梳理整合 JSX 代码，写出更优雅的组件，使其更整洁易懂且便于维护。

https://verekia.com/react/logic-less-jsx/