【报Bug】canvas 组件调用drawImage 内存未释放，导致浏览器OOM

分类：uni-app

bug反馈

产品分类： uniapp/H5

PC开发环境操作系统： Windows

PC开发环境操作系统版本号： Windows 11 21H2（22000.856）

HBuilderX类型：正式

HBuilderX版本号： 3.4.14

浏览器平台： Chrome

浏览器版本： 104.0.5112.81

项目创建方式： HBuilderX

示例代码：

let canvasCtx = uni.createCanvasContext(this.canvasId, this);
canvasCtx.drawImage(img,sx,sy,swidth,sheight,dx,dy,dwidth,dheight);

操作步骤：

页面长时间运行，浏览器OOM

预期结果：

页面长时间运行，浏览器不要OOM

实际结果：

页面长时间运行，浏览器OOM

bug描述：

页面使用Websocket连接后台，后台会连续发送大量图片到前端页面，前端需要将图片进行展示，时长长后浏览器OOM

使用chrome调试工具，查看内存，有大量的string类型变量，且指向_images变量，经排查，发现是与uni-app/src/core/view/components/canvas/index.vue 有关。如果页面由一个canvas组件实例并且没有销毁的情况下，_images变量一直往里边插入新的对象，而没有释放，造成大量内存占用且无法释放。

2022-08-17 22:07 负责人:无分享

0 个回复

该问题目前已经被锁定, 无法添加新回复

【报Bug】canvas 组件调用drawImage 内存未释放，导致浏览器OOM

示例代码：

let canvasCtx = uni.createCanvasContext(this.canvasId, this);
canvasCtx.drawImage(img,sx,sy,swidth,sheight,dx,dy,dwidth,dheight);

操作步骤：

页面长时间运行，浏览器OOM

预期结果：

页面长时间运行，浏览器不要OOM

实际结果：

页面长时间运行，浏览器OOM

bug描述：

0 个回复

公告

相关问题

【报Bug】canvas 组件调用drawImage 内存未释放，导致浏览器OOM

示例代码： let canvasCtx = uni.createCanvasContext(this.canvasId, this); canvasCtx.drawImage(img,sx,sy,swidth,sheight,dx,dy,dwidth,dheight);

操作步骤： 页面长时间运行，浏览器OOM

预期结果： 页面长时间运行，浏览器不要OOM

实际结果： 页面长时间运行，浏览器OOM

bug描述：

与内容相关的链接

0 个回复

公告

相关问题

示例代码：

let canvasCtx = uni.createCanvasContext(this.canvasId, this);
canvasCtx.drawImage(img,sx,sy,swidth,sheight,dx,dy,dwidth,dheight);

操作步骤：

页面长时间运行，浏览器OOM

预期结果：

页面长时间运行，浏览器不要OOM

实际结果：

页面长时间运行，浏览器OOM