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