setData（）上的CKEditor内存泄漏 [英] CKEditor Memory Leak on setData()

问题描述

我认为我有一些与CKeditor setData（）函数相关的大内存泄漏。我有一个网络应用程序，用户可以使用Javascript设计自己的内容。 CKEditor用作WYSIWYG编辑器，供用户编写设计的每个部分的内容。

每次用户点击其设计中的可编辑文本元素时，调用editor.setData，它将CKEditor数据设置为被点击的用户设计的文本元素内的任何内容。

这样可以正常工作几次，但每次用户单击一个新的文本元素，并调用.setData（）时，应用程序会变慢，变慢和变慢，直到网站崩溃。我已经尝试在我的Javascript中禁用setData（）函数，当我这样做时，我没有内存泄漏或性能问题。

任何人都有类似的问题？任何人都有任何关于如何避免内存泄漏和性能损失的建议吗？

正在调用的函数以及造成性能损失的函数是：

  function clickTextElement（）{
 var location = $（this）; 
 $（'。selected'）。removeClass（'selected'）; 
 location.addClass（'selected'）; 
 $（'＃main-tools'）。hide（）; 
 
 if（location.hasClass（'textarea'））{
 $（'＃imageeditor'）。hide（）; 
 $（'＃texteditor'）。show（）; 
 editor.setData（$（'。selected'）。html（））; 
} 
} 
  

解决方案

我通过首先添加以下代码，能够改善此功能的性能：

  editor.document.clearCustomData（）; 
 editor.document.removeAllListeners（）; 
 editor.window.getFrame（）。clearCustomData（）; 
 editor.window.getFrame（）。removeAllListeners（）; 
  

在函数的开头clickTextElement（）;我们的想法是在将新数据加载到编辑器之前清除与编辑器相关的所有数据。我不确定哪些调用能够最大程度地改善性能，我试图逐一取消注释以查看性能损失/改进，并且很难区分它们。

<我还从CKEditor配置中删除了很多字体。以前我把很多谷歌字体加载到CKEditor中，我想说可能有50多个。现在我将其减少到大约15个。

这两个添加项共同提高了性能。在内存耗尽之前，我可以点击（调用clickTextElement（））约10-20次。我现在尝试点击/调用该函数数百次而没有任何显着的性能损失。

如果有人想要添加有关此修复的信息以及有关clearCustomData（）和removeAllListeners（）函数调用的信息，请执行此操作。

I think I'm having some big memory leaks related to the CKeditor setData() function. I have a web app where users can design their own content with Javascript. CKEditor is used as the WYSIWYG editor for the users to write content of each part of the design.

Each time a user click on a editable text-element in their design, editor.setData is called, and it sets the CKEditor data to whatever is within the text element of the users design that is being clicked.

This works fine for a few times, but each time a user click a new text element, and .setData() is called, the app gets slower, slower and slower, until the website crashes. I've tried disabling setData() function in my Javascript and I have no memory leaks or performance issues when I do so.

Anyone had similar issues? Anyone have any advice of how I can avoid this memory leak and performance loss?

The function that is being called, and that create the performance loss is:

function clickTextElement() {
    var location = $(this);
    $('.selected').removeClass('selected');
    location.addClass('selected');
    $('#main-tools').hide();

    if(location.hasClass('textarea')){
        $('#imageeditor').hide();
        $('#texteditor').show();
        editor.setData( $('.selected').html() );
    }
}

解决方案

I was able to improve the performance of this function by first adding the following code:

editor.document.clearCustomData();
editor.document.removeAllListeners();
editor.window.getFrame().clearCustomData();
editor.window.getFrame().removeAllListeners();

At the beginning of the function clickTextElement(); the idea is to clear all data related to the editor before it loads new data into it. I'm unsure exactly which of these calls that improves the performance the most, I tried uncommenting one by one to see the performance loss/improvement and it was difficult to differ them.

I also removed a lot of fonts from CKEditor Config. Previously I was loading a lot of Google Fonts into CKEditor, I would say maybe 50+. Now I reduced this to about 15.

Together both of these additions improved the performance a lot. Before I could click (call clickTextElement() ) about 10-20 times before the memory ran out. I have now tried clicking/calling the function hundreds of times without any noticable performance loss.

If someone would like to add information regarding this fix and regarding the clearCustomData() and removeAllListeners() function calls, please do.

这篇关于setData（）上的CKEditor内存泄漏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！