4

我试图了解使用 TweenLite/TweenMax 的最佳方式是什么。

  • 用相同的变量引用我所有的补间是否有用?
  • 使用相对公共方法杀死补间后,我是否必须将引用设置为null以改进垃圾收集处理?

下面有一个评论很好的例子:

$(document).ready(function () {
    var elementOne = $('#elementOne');
    var elementTwo = $('#elementTwo');
    var myTween;

    // is it useful to overwrite the variable?
    myTween = TweenMax.to(elementOne, 1, {
        opacity: 0
    });
    myTween = TweenMax.to(elementTwo, 1, {
        left: 0,
        onComplete: destroy
    });

    function destroy () {
        // suggested on tweenmax docs
        // the console.log still returns me the object
        myTween.kill();
        console.log(myTween);

        // is it required for garbage collecting?
        // now the console.log returns me null
        myTween = null;
        console.log(myTween);

        // and then...jQuery GC friendly remove
        elementOne.remove();
        elementTwo.remove();
    }
});
4

1 回答 1

12

除了您通常对任何 JS 对象执行的操作之外,您无需执行任何特殊操作即可为 gc 提供补间(或时间线)。换句话说,如果您在自己的代码中维护对实例的引用,它会一直存在(否则您的代码可能会中断)。但是您不需要专门 kill() 补间。GSAP 已经付出了很多努力,以确保事情得到优化并且不会让人头疼。引擎将在必要时自动释放已完成的补间以进行垃圾收集。但是,例如,如果您维护一个引用并重新启动它,补间仍然可以工作。

仅仅因为您在补间实例上调用 kill(),这不会强制浏览器运行其垃圾收集例程。它也不会使您的变量为空。这就是 JavaScript 的工作原理(这是一件好事)。它与 TweenLite/Max 无关。

另请记住,您不需要将任何补间实例存储在变量中。唯一有用的是您以后需要控制补间(或将其插入时间轴或类似的东西)。通常只调用 TweenMax.to(...) 而不将结果存储在变量中就可以了。

这能把事情弄清楚吗?

于 2013-10-03T06:37:17.777 回答