Javascript 页面打开一段时间后，使用jQueryUI方法会非常慢

所以我的网页到处都使用jquery，它是一个单页javascript应用程序，我几乎用jquery手工创建所有HTML。我有很多div，其中我使用了draggable和reshable，我还使用jqueryui效果。隐藏和。显示幻灯片动画来移动一些div

当我启动应用程序时，一切都正常工作，但在10~15分钟后，页面已经打开，使用jquery ui方法的一切都变得非常缓慢，以至于无法使用。当我尝试调整我的一个div的大小时，当我第一次在拐角处向下鼠标时，速度会大大减慢，当我放开鼠标后，页面需要几秒钟才能再次响应。拖放也是如此。在div上调用$（）.draggable和$（）.resizable也需要很多时间。奇怪的是，拖动和调整大小本身并不慢，只是开始/结束它。页面打开的时间越长，速度越慢

页面中的所有其他功能即使在页面打开一小时后也可以正常工作（我甚至有一些基本的画布绘制，其他jquery但不是jquery ui功能也可以正常工作）。没有内存泄漏，因为浏览器使用的内存从未超过150mb

有些人可能会说问题在于我的启动/停止调整大小/拖动功能。 这并不是因为我试图在不改变速度的情况下删除它们，而且这也不能解释动画的速度变慢

当设置动画时，CPU使用率达到100%（我使用的是单核系统），当不使用jQueryUI函数时，CPU使用率保持在0%。在分析动画功能时（页面打开超过30分钟后），我看到有一个名为curCSS的方法（jquery-1.8.1.js line 6672），使用了95%的CPU时间。如果在启动应用程序几秒钟后执行动画，该函数仅使用4.5%

我正在使用jquery-1.8.1和jQueryUI1.8.22

我不能发布所有的代码，因为我不知道它的哪一部分是错误的，整个代码库是巨大的。动画通过以下方式完成：

//internal code that prevents updating data on the divs that are part of the animation
var hiding= true;
    var showing= true;

    containerToHide.$div.hide("slide", {direction: "left"}, 1000, function() {
        hiding= false;
        if (!showing) { //both animations ended
            //internal code to allow update data on div after animation ends
        }
    });

    containerToShow.$div.show("slide", {direction: "right"}, 1000, function() {
        showing= false;
        if (!hiding) {//both animations ended
            //internal code to allow update data on div after animation ends
        }
    });

我不认为这是问题所在，动画是相当标准的东西

---

如果您能给我一些提示，我将不胜感激。

经过几个小时的调试，我终于找到了罪魁祸首。我正在使用dojo创建一些图形。Dojo使用SVG创建图形，我对图形有一些渐变效果

每次更新图形时，它都会从svg标记中清除旧的rect标记，但不会从defs标记中清除lineargradient标记。几分钟后，我在图形上有数千个lieargradient标记，这导致了当这些图形需要重新渲染时的速度减慢，因为我正在滑动div，因为图形在所有动画中都会减慢

---

我正在设法清除不需要的标签。最好是通过Dojo方法，但如果不是，我将自己手动删除它们。

听起来您多次初始化了一些UI组件。我不使用jquery UI小部件。我使用简单div，并且在它们上使用$div.resizeable（设置）和$div.draggable（设置）。当我想删除拖动/调整大小功能时，我使用$div.resizeable（“destroy”）和$div.draggable（“destroy”）您是否尝试过更新到jquery/jqueryui的最新版本？您是否尝试过使用jquery UI 1.8.23？为了与jQuery 1.8+兼容，对其进行了一些更新。我不知道有新版本问世，但查看更改日志，似乎没有任何东西可以修复我的代码。尽管如此，我还是会努力的。