我是靠谱客的博主 背后夕阳,最近开发中收集的这篇文章主要介绍wordpress加快php渲染,WordPress 技巧:使用 defer 延迟加载 JavaScript 程序,加快页面渲染...,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

什么是 JavaScript 的 Defer 属性

这种情况大家都可能遇到过:就是 head 中有 N 个脚本,当加载这些脚本的时候就会阻塞页面的渲染,也就是常说的空白,当然我们可以把源代码中的脚本放到 footer 来解决,但是一些复杂的开发环境让这个简单的工作变得异常复杂。

这个时候我们可以使用 Defer 属性,它是 JavaScript 中比较少用的一个属性,可能你从来都不会使用它,但是相信看完这里的介绍,相信你就不会离开它,它的主要功能就是让脚本在整个页面加载完之后再解析,而非边加载边解析,这对于只包含事件触发的 JavaScript 的脚本来说,可以提供整个页面的加载速度。

是的,如果一个 Script 标签加了 defer 属性,即使放在 head 里面,它也会在 HTML 页面解析完毕之后再去执行,也就是类似于把这个 script 放在了页面的底部。

当然 defer 使用也有局限性,一般要注意两点:

不要在 defer 型的脚本程序段中调用 document.write 命令,因为 document.write 将产生直接输出效果。

不要在 defer 型脚本程序段中包括任何立即执行脚本要使用的全局变量或者函数。

给 WordPress 中使用的脚本加上 Defer 属性

那么在 WordPress 中,我们怎么给 WordPress 使用的脚本自动加上 Defer 属性呢?我们可以在当前主题的 functions.php 文件中加入下面的代码:

add_filter( 'clean_url', 'wpjam_defer_script',11,1);

function wpjam_defer_script( $url ){

if(strpos($url, '.js') === false){

return $url;

}

return "$url' defer='defer";

};

该功能已经整合到 WPJAM Basic 中。最后大家可以看我的博客是不是页面可以很快渲染出来。 ????

©我爱水煮鱼,本站推荐使用的主机:

本站长期承接 WordPress 优化和建站业务,请联系微信:「chenduopapa」。

最后

以上就是背后夕阳为你收集整理的wordpress加快php渲染,WordPress 技巧:使用 defer 延迟加载 JavaScript 程序,加快页面渲染...的全部内容,希望文章能够帮你解决wordpress加快php渲染,WordPress 技巧:使用 defer 延迟加载 JavaScript 程序,加快页面渲染...所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(38)

评论列表共有 0 条评论

立即
投稿
返回
顶部