RichTalk 快报第 7 期

天下难事，必作于易；天下大事，必作于细。——《道德经》

这里是Tech 快报，每两周为你带来新鲜的技术资讯，如果想第一时间收到更新请关注我们。本期快报速览：

第 92 次 TC39 会议
MemLab：一个用于查找JavaScript内存泄漏的开源框架
创建现代 npm 包的最佳实践
技术动态

头条

第 92 次 TC39 会议

stage0（strawman）：任何TC39的成员都可以提交。

stage1（proposal）：进入此阶段就意味着这一提案被认为是正式的了，需要对此提案的场景与API进行详尽的描述。

stage2（draft）：演进到这一阶段的提案如果能最终进入到标准，那么在之后的阶段都不会有太大的变化，因为理论上只接受增量修改。

stage3（candidate）：这一阶段的提案只有在遇到了重大问题才会修改，规范文档需要被全面的完成。

stage4（finished）：这一阶段的提案将会被纳入到ES每年发布的规范之中。

此次会议进展如下：

Stage3：Array.fromAsync

function * genPromises (n) {
  for (let i = 0; i < n; i++)
    yield Promise.resolve(i * 2);
}

// `arr` will be `[ 0, 2, 4, 6 ]`.
const arr = [];
for await (const v of genPromises(4)) {
  arr.push(v);
}

// This is equivalent.
const arr = await Array.fromAsync(genPromises(4));

Stage2：Well-Formed Unicode Strings

ECMAScript 字符串都是 UTF-16 编码的字符串。在 Web API 中，我们可以发现有些 API （如 URL、URLSearchParams 等等系列 API）都声明了需要 USVString 作为参数。USV 代表 Unicode Scalar Value，即 Unicode 标量值。Unicode 的码位（Code Point）可以分成几个类别，分别是图形码（Graphic），格式码（Format），控制码（Control），私有码（Private-Use），代理码（Surrogate），非字符码（Noncharacter），与保留码（Reserved）。而其中的代理码又分成了高位代理码与低位代码码，只有当一个高位代码码与一个低位代理码组合成一个代理码对，才是一个合法的 Unicode 字符。目前，JavaScript 字符串并不限制这个字符串的值是否是合法的 Unicode 值，比如我们可以编码一个字符串只有高位代理码，而没有低位代理码等等。

String.prototype.isWellFormed()：用于判断字符串格式是否正确。
String.prototype.toWellFormed()：用于将字符串转换为正确格式。

'\ud800'.isWellFormed(); // => false
'\ud800\udc00'.isWellFormed(); // => true

Stage1：Extractors

const [first: firstTemp, second: secondTemp] = arr;
const {name: nameTemp, age: ageTemp} = obj;

// With Customer Function
const first = someLogic(firstTemp);
const second = someLogic(secondTemp);
const name = someLogic(nameTemp);
const age = someLogic(ageTemp);

// With Extractors BindingPattern
// 解构数组
const SomeLogic(first, second) = arr;
// 解构对象
const SomeLogic{name, age} = obj;

// With Extractors AssignmentPattern
// 解构数组
SomeLogic(first, second) = arr;
// 解构对象
SomeLogic{name, age} = obj;

精选

MemLab：一个用于查找JavaScript内存泄漏的开源框架

MemLab 是一个自动检测内存泄漏的 JavaScript 内存测试工具。**工作原理是通过在预定义的测试场景中运行无头浏览器并对 JavaScript 堆快照进行差异分析来发现内存泄漏。**此过程分六个步骤进行：

浏览器交互

区分 heap
细化内存泄漏列表
生成 retainer traces
聚类 retainer traces
报告泄漏

MemLab 提供内存泄漏检测功能。对于浏览器内存泄漏检测，MemLab 需要开发人员提供的唯一输入是一个测试场景文件，该文件定义了如何通过 overriding Puppeteer API 和 CSS 选择器的三个回调来与网页进行交互。MemLab 会自动对 JavaScript heap 进行差异化处理，完善内存泄漏，并对结果进行汇总。

通过使用 MemLab 检测和诊断内存泄漏，Meta 方面称，其在 2021 年上半年将 Facebook.com 上的 OOM 崩溃减少了 50%。

拓展阅读：

创建现代 npm 包的最佳实践

原文：snyk.io/blog/best-p…

中文翻译：juejin.cn/post/715230…

Snyk 团队的一篇博文，包括如下方面：

初始化项目
创建 npm 账户
发布 npm 包
支持 TypeScript
CJS 和 ESM 的打包配置
单元测试及 Pipeline 配置
本地调试
使用 GitHub Actions 和 Snyk 进行安全检查
自动化版本管理和发布
使用 Snyk 进行持续安全监控

动态

React Router 6.4.2：随着 React Router 6.4 正式发布，React Router 也加入到了远程状态管理的阵营，开发团队将 Remix 中的功能带入到了 React Router 中。
Preact v10.11.0 新增 useId Hook，对标 React 18。
Bun v0.1.12
TypeScript 4.9 Beta
Monorepo Handbook 新鲜出炉
Umi x Valtio
再见！useEvent！

RichTalk 快报 第 7 期

头条

第 92 次 TC39 会议

精选

MemLab：一个用于查找JavaScript内存泄漏的开源框架

创建现代 npm 包的最佳实践

动态

RichTalk 快报第 7 期