Как использовать загрузчик JavaScript, такой как head.js или labjs в Magento
Внезапно Magento поставляется с более чем полдюжиной библиотек JavaScript, которые не помогают с и без того громоздким временем загрузки. Кто-нибудь смог успешно использовать загрузчик скриптов, такой как head.js или labjs, с Magento, чтобы они могли загружаться асинхронно? Я пытался, но не могу заставить его работать.
Кажется, что встроенные скрипты на страницах запускаются до загрузки библиотек. Я знаю, что в head.js есть функция наподобие head.ready, которая сообщает скрипту о выполнении, но встроенных скриптов так много, что не практично добавлять это в каждое вхождение на всем сайте.
3 ответа
Что касается встроенных сценариев, существует программное решение.
Вы можете написать Обозреватель, который связывает с core_block_abstract_to_html_after
или же controller_action_layout_render_before
События, которые запускаются непосредственно перед выводом отрендеренного HTML. В вашем Обозревателе вы можете использовать preg_replace
вставить head.ready
заявление сразу после каждого <script>
тег.
Это увеличило бы время рендеринга, но я подозреваю, что это будет меньше, чем задержка загрузки библиотек. И если вы используете полное кэширование страниц, то функция будет вызываться только один раз.
Вы можете использовать встроенный Magento Profiler для проверки воздействия. Стоит попробовать хотя бы.
НТН,
JD
Ну, я использую jquery для этого. и это прекрасно работает.
Все, что вам нужно сделать, это сделать ajax-запрос, который возвращает скрипт, а затем оценить скрипт, используя eval
, Вы можете написать свою собственную функцию для этого, но jquery уже имеет несколько хороших подходов.
Для отдельных сценариев $.getScript
функция работает хорошо. Это в основном расширение $.ajax
функция, которая указывает, что вы запрашиваете скрипт. синтаксис такой:
$.getScript('my_script_url',function(){
// do whatever needs to be done after the script loads
alert('my script was asynchroniously loaded');
});
Если у вас есть больше сценариев, которые вы хотите добавить через ajax, у jquery есть отличный способ сделать это:
$.when(
$.getScript("/script_1.js"),
$.getScript("/script_2.js"),
$.getScript("/script_3.js")
// ...
//$.getScript("/script_n.js")
).then(
// on succes
function(){
alert('good to go!');
},
// on failure
function(){
alert('loading failed. one or more scripts encountered a problem :(');
}
);
Все загрузчики такого рода потребуют внесения некоторых изменений в каждый скрипт на вашем сайте. Я знаю - я только что реализовал LABjs в системе, которая, когда я показал grep, показала более 400 файлов с каким-то тегом сценария!!