概述
什么是 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 程序,加快页面渲染...所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复