CKEditor Memory Leak on setData()

2019-04-11 10:53发布

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() );
    }
}

1条回答
三岁会撩人
2楼-- · 2019-04-11 11:21

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.

查看更多
登录 后发表回答