javascript - 如何正确销毁 Paper.js Scope

Question

我通过为每个 Canvas 创建一个新范围来使用多个 Paper.js Canvas 。该网站是用 AJAX 驱动的，所以我必须在更改子页面时销毁不需要的实例。不幸的是，当我不再需要 paper 范围的实例时，没有像 paper.destroy() 方法这样的东西可以调用来清除内存。在我调用 view.remove() 之后，我的控制台充满了来自 paper.js 核心的错误，因为范围一直在尝试使用它。

为了向您展示我正在尝试做的事情，这里是从构造函数中提取的一段代码:

this.paper = new paper.PaperScope;
this.paper.setup(this.canvas);

这就是我试图销毁实例的方式:

this.paper.view.remove();

然后我从 DOM 中删除了 canvas。这样做之后，我不断在控制台上收到以下错误:

Cannot read property 'ownerDocument' of null

目前，我想出的唯一解决方案是重用作用域和 Canvas 而不是销毁它们(使用未使用的实例池而不是不断创建新实例)，因此我不会出现巨大的内存泄漏。虽然这不是完美的解决方案，因为我无法完全摆脱这些实例。

所以我的问题是:如何正确地完全销毁 paper.js 实例以防止内存泄漏？

Answer 1

您必须直接在 PaperScope 实例上调用 remove()。

// get a reference to the canvas element
var canvas = document.getElementById('canvas');
// init paper scope
var scope  = new paper.PaperScope;
scope.setup(canvas);

// here do what you want with the canvas

// clear scope
scope.remove();
// remove element
canvas.remove();

// clear variables so they can be garbage collected
canvas = null;
scope  = null;