我有一个简单的流星应用程序与两个模板使用flowrouter在它们之间导航。每个模板都有一个单独的HTML canvas元素，都有一个指定的fabricjs canvas和一个绘制的方框。

当我在两个模板之间导航，同时进行内存性能分析时，我发现每次在模板之间导航时，内存都会不断增加。

我期望垃圾收集器清理画布变量，但事实并非如此。所以有一些东西让他们保持在上下文中。我看不出我错过了什么。

模板HTML

<template name="one">
        Template One 
        <a href="/two"> two</a>
                <canvas id="canvasONE" width="2000" height="1601"></canvas>
</template>
<template name="two">
    Template Two
    <a href="/one"> one</a>
        <canvas id="canvasTWO" width="2000" height="1601"></canvas>
</template>

// JavaScript

import { Template } from 'meteor/templating';
import { ReactiveVar } from 'meteor/reactive-var';
import './main.html';
//////////////////////////////////////////////   
// Template One  
Template.one.onRendered( function(){
  var canvas = new fabric.Canvas('canvasONE',{selection:true});
  var rec = new fabric.Rect({
    left: 0,
    top: 0,
    width: 120,
    height: 50,
    rx: 4,
    ry: 4,
    fill: '#64b5f6',
    stroke: '#6Ebfff',
    strokeWidth: 2,
    originX: 'left',
    originY: 'top',
    lockScalingX: true,
    lockScalingY: true 
canvas.add(rec)
/////////////////////////////////////////////////////
// Template Two
Template.two.onRendered( function(){
    var canvas = new fabric.Canvas('canvasTWO',{selection:true});
    var rec = new fabric.Rect({
      left: 0,
      top: 0,
      width: 120,
      height: 50,
      rx: 4,
      ry: 4,
      fill: '#223344',
      stroke: '#6Ebfff',
      strokeWidth: 2,
      originX: 'left',
      originY: 'top',
      lockScalingX: true,
      lockScalingY: true
      canvas.add(rec)