加载多个CKEditors很慢 [英] Loading Multiple CKEditors is Slow

问题描述

我在一个网页上有很多ckeditors，供学生输入他们的数据。我有很多ckeditors，因为每一个是一个变量。不幸的是，输入文本字段对于请求的数据来说太小了。问题是，加载网页需要的时间太长，有时网页会挂起。

我目前正在加载大约425个编辑者。

这里是我的三个代码示例：

 < script type ='text / javascript'> //<！[CDATA [
 $（window）.load（function（）{
 CKEDITOR.on（'instanceReady'，function（ev）{
 var jqScript = document.createElement（'script'）; 
 var bsScript = document.createElement（'script'）; 
 
 jqScript.src ='http://code.jquery.com/jquery-2.0.2.js'; 
 bsScript .src ='http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js'; 
 
 var editorHead = ev.editor.document。$。head; 
 editorHead.appendChild（jqScript）; 
 editorHead.appendChild（bsScript）; 
}）; 
 
 //加载CK编辑器
 CKEDITOR.replace 'editor1'，{
 contentCss：'http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css'
}）; 
 //加载CK编辑器
 CKEDITOR.replace（'editor2'，{
 contentCss：'http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min .css'
}）; 
 //加载CK编辑器
 CKEDITOR.replace（'editor3'，{
 contentCss：'http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min .css'
}）; 
}）; //]]> 
< / script> 
  

我按照 性能指南 ，搜索Stackoverflow的答案，它仍然不工作。我甚至将ckeditor工具栏最小化为只有一行。我想有一个方法来加载ckeditors，而不必加载所有的ckeditors和contentCss当页面加载时，但是当ckeditor需要时。任何帮助将非常感激。

解决方案

但网页上的ckeditors总数将近425次。

您曾经尝试过同时打开任何应用程式425次吗？ 425标签在您的浏览器，425个WordPads，425什么？我不这么认为。

所以答案很短 - 你做错了。您不应一次性初始化所有编辑器。根据需要加载它们，并在不需要时销毁。用户不能同时编辑425个文本。

更长的答案是经典编辑器是最重的一个，因为它使用< iframe> 。所以当你初始化425你初始化425 iframe。 内联编辑轻得多。还有一个 divarea 插件，使经典编辑器使用内联可编辑元素，而不是< ; iframe> ，因此它也更轻。

但答案是 - 你做错了。 $ b

I have a lot of ckeditors on one web page for students to enter their data. I have a lot of ckeditors because each one is for one variable. Unfortunately, an input text field is too small for the data requested. The problem is that it takes too long for the web page to load and sometimes the web page hangs.

I'm currently loading almost 425 editors.

Here's an example of my code for three:

<script type='text/javascript'>//<![CDATA[
    $(window).load(function () {
        CKEDITOR.on('instanceReady', function (ev) {
            var jqScript = document.createElement('script');
            var bsScript = document.createElement('script');

            jqScript.src = 'http://code.jquery.com/jquery-2.0.2.js';
            bsScript.src = 'http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js';

            var editorHead = ev.editor.document.$.head;
            editorHead.appendChild(jqScript);
            editorHead.appendChild(bsScript);
        });

        // Load CK Editor
        CKEDITOR.replace('editor1', {
            contentsCss: 'http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css'
        });
        // Load CK Editor
        CKEDITOR.replace('editor2', {
            contentsCss: 'http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css'
        });
        // Load CK Editor
        CKEDITOR.replace('editor3', {
            contentsCss: 'http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css'
        });
    });//]]>
</script>

I followed the performance guidelines on ckeditor, searched Stackoverflow for answers and it still isn't working. I even have the ckeditor toolbar minimized to just one row. I figure there has to be a way to load the ckeditors without having to load ALL the ckeditors and the contentCss when the page loads, but when the ckeditor is needed. Any help would be greatly appreciated.

解决方案

but the total number of ckeditors on the web page is almost 425.

Have you ever tried to open any application 425 times at the same time? 425 tab in your browser, 425 Wordpads, 425 of whatever? I don't think so.

So the answer is very short - you're doing it wrong. You should not initialize all editors at once. Load them on demand when needed and destroy when not needed. User can't edit 425 text at the same time anyway.

The longer answer is that classic editor is the heaviest one because it uses <iframe>. So when you initialize 425 you initialize 425 iframes. Inline editors are much lighter. There's also a divarea plugin which makes the classic editor use inline editable element instead of <iframe>, so it's lighter too.

But the answer is still - you're doing it wrong.

这篇关于加载多个CKEditors很慢的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！