我有一个发送二进制图像的websocket。我的脚本获取这些图像,转换为base64并显示在一个标记中。
大概是这样的
websocket.onmessage = function(evt) {
var msg = evt.data;
var image = $('.my-image')
image.attr('src', "data:image/jpeg;base64,"+ toBase64(msg))
}
这似乎导致了Chrome的内存泄漏,几分钟后它就会轻松使用超过1GB的RAM,几个小时后我就得到了"Aw,Snap"的错误。
查看资源选项卡,我看到所有收到的图片都显示出来了。看起来它们在任何时候都不会被删除,即使它们不再显示。
有没有解决这个问题的办法?也许有一种方法可以强制从内存中删除旧图像。
2条答案
按热度按时间gcuhipw91#
我也曾被同样的问题困扰过,浏览器内存使用量不断上升,结果发现这不是内存泄漏,而是浏览器缓存图像的副作用。
@metal03326在https://stackoverflow.com/a/38788279/1510289上提供了一个解决方案,其思想是,
1.将图像字节写入JavaScript Blob,
1.从该二进制大对象创建唯一对象URL,
1.在
src
属性中使用唯一的对象URL,最后1.在完成释放内存时撤销对象URL。
下面是代码:
khbbv19g2#
将图像base64保存在临时变量中,并将info替换为null。