真的需要 Magento 加载的所有默认脚本吗？答案

【问题标题】：Are all of the default scripts loaded by Magento really needed?真的需要 Magento 加载的所有默认脚本吗？
【发布时间】：2011-03-01 00:46:22
【问题描述】：

这是 Magento 默认加载的所有脚本的列表：

../js/prototype/prototype.js    //prototype library
../js/prototype/validation.js   //don't know what this does
../js/scriptaculous/builder.js  //don't know what this does
../js/scriptaculous/effects.js  //base scriptaculous effects library?
../js/scriptaculous/dragdrop.js //component of scriptaculous effects
../js/scriptaculous/controls.js //not sure?
../js/scriptaculous/slider.js   //more scriptaculous effects
../js/varien/js.js          //don't know what this is
../js/varien/form.js        //form validation scripts?
../js/varien/menu.js        //menu/drop down menu scripts
../js/mage/translate.js     //don't know what this does
../js/mage/cookies.js       //don't know what this does

这些脚本总共有 316.8K 的 javascript...都处于各种被缩小的状态（例如，prototype.js 没有被缩小）。

所以我的第一个问题：

1) 除了prototype.js，其他的真的都需要吗？

和

2) 删除这些脚本的“正确”方法是什么？布局更新？还是在模板中硬编码？

我想让我的 magento 网站的加载尽可能轻。

谢谢！

【问题讨论】：

Magento：专业、优雅和轻量级的扩展！由 JoomlArt.com 带给您。你想让它更轻量级吗？ :)
作为一个简单的优化，缩小prototype.js :)
我也想知道，我正在努力加快我的网站速度。我刚刚启用了 gzip，我的 javascript 文件大小减少了 70%。
@Joseph Mastey。我认为你在开玩笑，但是是的......原型不喜欢被缩小。

标签： magento prototypejs javascript

【解决方案1】：

回答第 1 部分 - 并非所有这些都是必需的，但大多数都是必需的，这取决于您的主题。默认的 magento 主题全部使用它们，但自定义主题几乎可以肯定不需要所有的脚本。

几乎总是需要变量、法师和原型，创建一个消除所有这些的主题非常、非常、困难，因为一些依赖于它们的页面内 javascript 实际上不是来自主题，而是来自核心 php 文件。

在简单的主题上，由于我不使用产品缩放显示，我在删除拖放和滑块方面取得了很好的效果。如果您不使用 Magento 菜单，则可以删除菜单，但前提是您准备制作虚拟 js 函数以捕获对其留下的任何调用 - 菜单导航对象直接从需要的 php 层注入 javascript 函数被抓住（或者更好的是，您可以滚动自己的类别导航对象，但不会这样做！）。

第 2 部分 - 编辑您的主题 page.xml 布局以将它们从 <block type="page/html_head" name="head" as="head"> 标签。我建议将它们注释掉，并在你去的时候测试每一个。

您可以通过将 javascript 标记添加到相应布局文件的头部部分来将所需的 javascript 文件注入到确实需要它们的页面类型中。作为如何完成此操作的示例，请查看默认的 sendfriend.xml 布局文件，该文件仅将 product.js 文件添加到需要它的页面的头部。

如果您开始根据页面类型积极添加/删除 javascript，您还需要考虑 Magento 如何合并 javascript 文件。配置界面的开发者区域有一个设置可以合并javascript文件，打开这个是非常好的事情。这会合并头部区域内使用“addJs”或“addItem”注入的所有javascript文件，项目类型为“js”或“skin_js”。

但是正因为如此，如果您开始逐页包含/排除脚本，您会发现您在不同页面上生成了不同的合并 js 文件 - 破坏了缓存单个大型 js 文件的大部分好处！

为了两全其美，您应该能够使用但不指定项目类型将 js 注入头部，从而防止该文件被合并 - 但我还没有尝试过。如果这可行，您会发现合并的核心库和单独包含的每页自定义文件，这意味着您缓存了大文件，而他们只下载更改的部分。

【讨论】：

【解决方案2】：

我不能说它们都是为了什么，但我知道它们中的大多数都是烦人的，因为 Magento 确实使用了 JS 的分配。

这并不能回答您的问题，但您可以通过进入系统 -> 配置 -> 高级 -> 开发人员 -> JavaScript 设置然后合并它们来最小化 Magento 1.4.01（可能也在 1.4.0 中）的影响所以你只有一个 HTTP 请求（CSS 也可以）。

我猜想删除它们的“最正确”方法是创建一个不需要它们的新主题，并且不包含它们，因为它们不需要，所以在回答问题 2 时我会说模板绝对是前进的方向。我不记得控制它的确切模板，但我确定我见过一个包含大量 JS/CSS 的模板

【讨论】：

JS 通常在 page.xml（或其他 layout.xml）文件中定义。 +1 对那些通常是操作网站所必需的文件，尽管并非每个页面都使用每个脚本。
@Joseph Mastey - 是的，虽然不是每个页面都需要它们，但我发现包含 3 个不同的 UI 库只是为了做一个下拉菜单是一种巨大的浪费。
合并 JS 文件掩盖了这个问题，但我有兴趣解决这个问题。我很喜欢使用原型，所以这不是“我如何将 jquery 与 magento 一起使用”的帖子。而且我可以为每页创建布局更新以仅包含所需的 js。我只是不喜欢包含很少使用的资源。
好吧，如果您完成安装并将所有 css/js 包含到一个头文件中，然后使用基于页面主体类的开关（另一种类根据其 id 或类似内容应用于每个页面）然后您只会在每个页面上获得所需的文件...做 - 合并 JS 文件将加速页面加载，因为它会减少 http 请求的数量.. 虽然我怀疑这是否适用于上述解决方案。
@克里斯霍普金斯。您的建议正是我想要做的，我只想知道不同的脚本是什么，以及它们的目的......这样我就可以确保在删除脚本时我不会破坏 magento 需要的任何东西。是的，合并所有 JS 文件将通过消除 http 请求和下载来更快地加载页面......但是浏览器仍然需要处理 js。这就是我想要减少的，浏览器在每个页面上运行这些脚本时必须投入的工作量。