在 Magento 中为 PageSpeed 异步加载 javascript

Async loading of javascript in Magento for PageSpeed

我正在尝试优化我的 Magento 1.9.3 网站,遵循 Google PageSpeed 提示,说我有 js 和 css 同步加载并阻止页面呈现。

为了解决这个问题,我按照 answer.

中的建议对所有 javascript 文件进行异步加载

所以我所有加载的脚本都是这样的:

<action method="addItem"><type>skin_js</type><name>js/jquery.fancybox.2.1.5.min.js</name><params>defer</params></action>
<action method="addItem"><type>skin_js</type><name>js/jquery.fancybox.2.1.5.min.js</name><params>async</params></action>

这样,运行 PageSpeed 再次提供更好的结果。

问题是我收到大量 javascript 异常,因为模板文件 (.phtml) 中的脚本可能在脚本加载之前加载。如果我清除浏览器缓存并重新加载页面,情况会更糟。

那么,有没有更好的方法来解决这个"problem"? 我应该移动页面末尾的所有文件吗?或者忽略 GooglePageSpeed 提示?

提前致谢。

您也可以使用 "defer" 让它们在最后加载,可以使用或不使用异步。

因此,如果您按照需要的顺序使用 "defer" 加载它们,它们不应抛出异常,除非您在加载它们之前使用了任何需要的东西。

最后,js 的解决方案附带了一个扩展,将所有 js 移动到 dom 的末尾,并且似乎不会造成加载页面的问题。

扩展名为 pagespeed,来自 mediarox。 我将把 link 留在这里,仅供参考,只要它能继续工作。

Magento Google PageSpeed Optimization Extension

无论如何,我被迫以在 dom 开头加载我的自定义样式表的方式配置扩展,因为其他方式可以看到 DOM 已加载并且在样式表之前就准备好了,并且产生了可怕的效果。

apache mod_pagespeedmod_expires and mod_headers 配置良好也带来了非常好的结果和改进。

通过这些小改动,我们取得了不错的效果,但最重要的是主要来自图像压缩和资产缩小。