5

Magento 附带了六个以上的 JavaScript 库，这些库对已经很繁琐的加载时间没有帮助。有没有人能够成功地使用像 head.js 或 labjs 这样的脚本加载器和 Magento，以便他们可以异步加载？我一直在尝试，但无法让它发挥作用。

似乎页面上的内联脚本在加载库之前正在触发。我知道 head.js 有一个类似于 head.ready 的函数来告诉脚本执行，但是有这么多的内联脚本，将它添加到整个站点中的每个事件中是不切实际的。

4

3 回答 3

4

关于内联脚本，有一个编程解决方案。

您可以编写一个绑定到core_block_abstract_to_html_after或controller_action_layout_render_before事件的观察者，该事件在输出呈现的 HTML 之前立即触发。在您的观察者中，您可以使用 a在每个标签之后立即preg_replace插入一条head.ready语句。<script>

它会增加渲染时间的一小部分，但我怀疑它会小于下载库的延迟。如果您使用的是整页缓存，那么该函数只会被调用一次。

您可以使用内置的 Magento Profiler 来测试影响。至少值得一试。

HTH,
法学博士

于 2011-04-04T00:21:23.060 回答
2

好吧，我为此使用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 :(');
    }
);
于 2011-04-03T17:24:31.660 回答
0

所有这种性质的加载器都需要对您站点上的每个脚本进行一些修改。我知道——我刚刚在一个系统上实现了 LABjs，当我 grep 时，它显示了 400 多个带有某种脚本标签的文件！

于 2011-04-02T19:31:12.153 回答