作者 | 闫园园
上周，Facebook 母公司 Meta 宣布了开源 MemLab，一个用于在基于 Chromium 的浏览器上的 JavaScript 应用程序中查找内存泄漏的工具。Facebook 技术团队指出：“应用程序的性能和功能正确性问题通常会被用户立即留意到。然而内存泄漏却不一样，它不容易被立即察觉，但它每次都会吃掉一大块内存，使得整个网络会话的响应变得非常慢。”
为了帮助开发人员解决这个问题，Meta 构建了 MemLab，它可以自动进行内存泄漏检测并更容易找到泄漏的根本原因。据公告称，Meta 内部使用它成功地控制了不可持续的内存增长，并识别了产品和基础设施中的内存泄漏和内存优化机会。目前，Meta 已经在 GitHub 上开源了 MemLab，“我们希望它能为 JavaScript 社区做出贡献”。
为什么开发 MemLab
2020 年，Facebook 技术团队将 Facebook.com 重新设计为单页应用程序（SPA），该应用程序的大部分渲染和导航使用客户端 JavaScript。除此之外，Meta 其他大流行网络应用程序也都使用了类似的架构来构建，包括 Instagram 和 Workplace。
公告表示，虽然这种架构使其能够提供更快的用户交互、更好的开发人员体验，但内存泄漏的后果在单页应用程序（SPA）中更为严重，因为用户可能会在较长时间内持续与页面交互，而 MemLab 就是专为这种场景设计的。
在许多情况下，JavaScript 可能会泄漏内存。比如，Facebook 工程师 Liang Gong 和 Glenn Conner 就在公告中谈到，当你向 Chrome 控制台发送一个对象时，Chrome 会对其进行隐藏引用，以防止它被收集。另外，auth0 工程师 Sebastian Peyrott 也曾谈到，其他可能出现泄漏或未绑定内存增长的情况则与意外使用全局变量、忘记计时器或回调以及 DOM 外引用有关。
虽然 Chrome 开发者工具提供了检查 JavaScript 代码的内存行为的基本手段，比如时间线视图和配置文件视图，但这并不直接，也不能自动化。相反，MemLab 则可以很容易地集成到 CI/CD 管道中，Gong 和 Conner 介绍道。
MemLab 工作原理
MemLab 的工作原理是通过预定义的测试场景运行 headless 浏览器并对 JavaScript heap snapshots 进行差异分析来发现内存泄漏。此过程工作过程如下：
  • 导航到页面并返回；
  • 查找未释放的对象；
  • 显示泄露追踪结果。
据悉，MemLab 使用了一个名为“Puppeteer”的 Node.js 库。它可以控制 Google Chrome 或其它基于 Chromium 内核打造的浏览器，且默认情况下以 headless 模式运行（方便命令行交互）。
MemLab 的另一特性，就是提供了 JavaScript 堆的图形视图、启用了用于检查堆快照的 API 。这意味着开发者能够编写开展内存断言的测试，例如声明某个对象将不再存在于内存中。
此外还有一个用于查找重复字符串实例的工具，在某个案例中，团队发现字符串占用了 70% 的堆、且其中半数至少有一个重复的实例。包括 Chrome、Edge、Firefox 在内的浏览器，都有附带内存检查工具。但正如以为开发者在 Hacker News 上吐槽的那样，这些开发工具难以在调试过程中揪出内存泄露的问题。
安装方面，MemLab 不仅可以通过 npm 包管理器、还可从 git 存储库进行构建。不过 Windows 平台必须使用 Git Bash，否则会在构建时遭遇失败。然后开发者可以运行 MemLab，将其传递给 JavaScript 文件中定义的场景。
最后，MemLab 的另一项强大功能，就是可以在测试期间作为命令过程的一部分而运行。这意味着如果代码中引入了严重的泄露，开发者们也能够在投入生产环境前加以捕获。
目前，Facebook  应用 MemLab 已经几年的时间了。公告也提到，在 2021 年上半年应用 MemLab 也将 Facebook.com 上的 OOM 崩溃减少了 50%。
参考链接：
https://engineering.fb.com/2022/09/12/open-source/memlab/
https://www.infoq.com/news/2022/09/memlab-javascript-memory-leaks/
https://www.cnbeta.com/articles/tech/1316541.htm
本周荐文
Adobe收购Figma；易联购预售iPhone卷款跑路；脉脉以旷工为由辞退员工，被判赔24万；Meta开源MemLab
用于VS Code的Edge开发工具扩展太强了，因此我放弃了Chrome
从零开始的新跨平台浏览器：Ladybird 正式起飞
继续阅读
阅读原文