2

javascriptファイルの解析を延期する方法を知っています。簡単だ。

それほど簡単ではないのは、最初のjavascriptファイルの後にtinyMCEが呼び出すさまざまな他のファイルを処理することです。主な理由は、tinyMCEが黙って失敗するからだと思います。

通常のhtmlスクリプトタグを介してファイルをロードすると、正常に機能します。しかし、私がこのようなことをしようとすると:

var my_local_tinymce_js_file = "http://domain.com/inc/tinymce/jscripts/tiny_mce/tiny_mce.js";

$.when($.getScript(var my_local_tinymce_js_file)).
done(function(script, textStatus) {

    alert("download of tiny_mce succeeded!");
    setTimeout("setup_tinymce();", 7500);

})
.fail() {

    alert("download of tiny_mce failed!");

});

「tiny_mceのダウンロードに成功しました!」というテキストアラートが常に表示されます。また、アラートボックスにスクリプト変数を出力して、スクリプトが実際にダウンロードされたことを証明することもできます。

私は、他のすべてのjavascriptファイルとcssファイルをロードできるようにするために、将来的にsetup_tinymceを7.5秒呼び出すことさえしました(ロードしているとは思わない)。

setup_tinymce関数は次のようになります。

function setup_tinymce() {

            tinyMCE.baseURL = 'http://domain.com/inc/tinymce/jscripts/tiny_mce/';
            tinyMCE.init({
                mode : "textareas", 
                theme : "advanced", 
                schema: "html5", 
                plugins : "emotions,spellchecker,advhr,insertdatetime,preview", 
                theme_advanced_buttons1 : "bold,italic,underline,|,forecolor,backcolor,|,justifyleft,justifycenter,justifyright,|,fontselect,fontsizeselect", 
                theme_advanced_buttons2 : "bullist,numlist,|,outdent,indent,|,undo,redo,|,link,unlink,|,image,|,advhr,|,removeformat", 
                theme_advanced_buttons3 : "", 
                theme_advanced_toolbar_location : "top", 
                theme_advanced_toolbar_align : "left", 
                theme_advanced_resizing : true
            });
            tinyMCE.execCommand('mceAddControl', false, 'comment_text');

}

これが、ファイルを動的にロードしようとしている理由です... https://developers.google.com/speed/pagespeed/insights#url=http_3A_2F_2Fwww.tinymce.com_2Ftryit_2Ffull.php&mobile=false&rule=DeferParsingJavaScript

かなり大きいので、動的にロードできれば、ページのレンダリング速度が大幅に向上します。

編集:私はこのようないくつかのjQueryコードを試しました:

$.when(
        $.getScript("http://domain.com/inc/tinymce/jscripts/tiny_mce/tiny_mce.js"),
        $.getScript("http://domain.com/inc/tinymce/jscripts/tiny_mce/langs/en.js"),
        $.getScript("http://domain.com/inc/tinymce/jscripts/tiny_mce/plugins/emotions/editor_plugin.js"),
        $.getScript("http://domain.com/inc/tinymce/jscripts/tiny_mce/themes/advanced/editor_template.js"),
        $.getScript("http://domain.com/inc/tinymce/jscripts/tiny_mce/plugins/spellchecker/editor_plugin.js"),
        $.getScript("http://domain.com/inc/tinymce/jscripts/tiny_mce/plugins/advhr/editor_plugin.js"),
        $.getScript("http://domain.com/inc/tinymce/jscripts/tiny_mce/plugins/insertdatetime/editor_plugin.js"),
        $.getScript("http://domain.com/inc/tinymce/jscripts/tiny_mce/plugins/preview/editor_plugin.js"),
        $.getScript("http://domain.com/inc/tinymce/jscripts/tiny_mce/themes/advanced/langs/en.js")
    ).then(


        $(function() {

            //initialize tinyMCE here

        })

    );

運がない。そのスクリプトは、適切なJavaScriptファイル(headタグからスクリプトをロードするときにロードされる)をすべてロードしてから、tinymceを初期化しますが、機能しません。エラーはスローされません。

これは、tinymceフォーラムでの動的ロードに言及している古いフォーラムスレッドです...すべてに古いコードの断片が含まれていますが、完全な例はありません:S

http://www.tinymce.com/forum/viewtopic.php?id=23286

http://www.tinymce.com/forum/viewtopic.php?id=2290

http://www.tinymce.com/forum/viewtopic.php?id=17467

4

1 に答える 1

1

ブラウザが他のすべての必要なtinymceファイルを取得する方法を知らないため、このようなtinymceをロードすることは不可能かもしれません(解決策を見つけた場合(私はあなたがそうするとは思わない)私に知らせてください-これは私にとって興味深いです) 。

あなたの目的がtinymceであなたのページをスピードアップすることであるならば、あなたはまた、tinymceコンプレッサーを使うかもしれません(開発者のダウンロードを見てください)。これにより、最初は最大1〜2秒節約できます。

于 2012-06-29T06:01:18.970 に答える