性能与插件生成的javascrip

时间:2019-01-27 作者:George Eco

首先让我解释一下我的意思。我在一家公司工作,该公司有一个安装了主题的WP页面和大量插件,如YOAST、WooCommerce、更多woo commerce插件等。这些插件和主题本身为我们的主网页生成javascript代码。显然,这远远没有得到优化,这一点得到了以下方面的证实:https://gtmetrix.com/ 和google insights。

问题来了。有没有办法通过在页脚中创建另一个js代码“版本”来覆盖某些js代码?实际上,我计划让footer加载一个js文件,包括覆盖,但由于我几乎不知道它会如何运行,我想我应该问问我是否认为这是正确的。

这样可能会增加纯文本的下载量。它并不优雅,因为它让事情变得有点像意大利面条,但我计划在将来进行任何js调用,调用js文件,因此不需要页脚覆盖,也不需要下载任何双重代码,我只是需要一个快速的解决方案。我估计如果我增加下载明文的数量,我仍然可能得到并行加载脚本的补偿,因此加载时间将得到改善。

图片是小JPG,它们对加载时间的贡献不大。

PageSpeed得分为74%,因此还有很大的改进空间。CSS和JS是主要因素。

我认为这对吗?任何指导都将不胜感激。

2 个回复
最合适的回答,由SO网友:CK MacLeod 整理而成

将自定义脚本排队时,可以将其写入页脚中以加载-在</body> 标记-使它们在大多数情况下都是非呈现阻塞的,但它们在测试工具上仍然可能是呈现阻塞,因为它们实际上必须在页面HTML被视为完全加载之前执行。相反,您需要“延迟”大多数脚本,但不是所有脚本。

延迟意味着将“延迟”属性添加到脚本标记中,为了通过主题或插件加载的脚本实现所需的效果,WordPress提供了script_loader_tag 筛选,但您需要谨慎操作,因为如果加载太晚,某些脚本将中断或导致其他脚本中断。(您可以尝试使用“async”,如果在页面加载过程中有一些执行时间损失,那么对于希望或需要更早加载的脚本,这可能更可取。)

这篇文章详细解释了如何“手动”处理大量潜在脚本:https://wpshout.com/make-site-faster-async-deferred-javascript-introducing-script_loader_tag/ 还有几个插件可用于此任务-我使用Async Javascript 在许多站点

SO网友:Xavier C.

查看以下内容:https://developer.wordpress.org/reference/functions/wp_enqueue_script/

最后一个参数:bool$in\\u footer=false,将其设置为“true”,脚本将加载到footer中。

此外,为了不被覆盖,您可以将插件脚本出列,并使用不同的参数“重新设置”它们:

function deregister_my_scripts{
wp_deregister_script(\'jquery\');
wp_register_script(\'jquery\', ("https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"), false, \'1.9.1\', true);
}
add_action (\'wp_enqueue_scripts\', \'deregister_my_scripts\');
查看页面的源代码并检查脚本的ID(此处:jquery)

但老实说,当您使用预构建的插件时,优化确实是一项困难的任务,您拥有的插件越多,遇到的麻烦就越多,您是否尝试过像wp\\U rocket这样的高级插件?它不仅可以让您延迟想要的内容,还可以缩小大多数插件脚本和css。此外,像imagify这样的图像优化服务可以真正提高页面加载时间。手动操作不值得费心,除非你想学习。。。