记一次node内存泄漏排查与修复

前言

之前开发了一个node接口,该接口使用canvas绘制产品图提供给java端使用,在运行了一段时间后发现了内存泄漏问题

本文浅记下修复过程(ps:主要是记录下启动命令和访问地址,记不住😂)

正文

内存泄漏指的是未被js引擎自动回收的内存,它多出现在定时器、dom事件和闭包

而笔者恰好就犯了定时器的问题,如下图框红的位置即是修复过后的代码

但这似乎并不是主因,内存仍然在随着时间的推移而不断增加

故,需要借助工具来排查....

首先想到的肯定是node自身提供的inspect选项了

js 复制代码
node --inspect --heapsnapshot-signal=SIGUSR2 ./xxx.js

重新启动后,在chrome浏览器访问chrome://inspect/#devices,正常会出现如下页面

点击框红的位置,进入调试控制台切换到内存选项卡并生成初始快照,方便对比分析

然后访问接口,尝试复现问题

在新的快照中对比,发现canvas生成的图片uri会随着调用次数增加,这正是内存不断增加的罪魁祸首

最后,在代码中找到生成该data uri的地方

它被挂载到了上下文,根据该ctx的传入路径,它来自变量helpers对象的toWebAttrs方法,该对象被笔者定义到了页面顶部,即接口回调的外部,也就是说沿着闭包路径被留存了

因此,只需要在用完后delete掉即可

相关推荐
在西安放羊的牛油果9 小时前
浅谈 import.meta.env 和 process.env 的区别
前端·vue.js·node.js
鹏北海9 小时前
从弹窗变胖到 npm 依赖管理:一次完整的问题排查记录
前端·npm·node.js
cute_ming10 小时前
从 Node.js + TypeScript 无缝切换到 Python 的最佳实践
python·typescript·node.js
冴羽12 小时前
2025 年最火的前端项目出炉,No.1 易主!
前端·javascript·node.js
jayaccc13 小时前
Webpack配置详解与实战指南
前端·webpack·node.js
阿珊和她的猫13 小时前
CommonJS:Node.js 的模块化基石
node.js·状态模式
阿珊和她的猫14 小时前
Webpack中import的原理剖析
前端·webpack·node.js
寧笙(Lycode)16 小时前
前端包管理工具——npm、yarn、pnpm详解
前端·npm·node.js
遗憾随她而去.16 小时前
Webpack5 基础篇(二)
前端·webpack·node.js
Misnice17 小时前
Webpack、Vite 、Rsbuild 区别
前端·webpack·node.js