写文章
shirley20
2018-01-24 21:08

如何 清除首屏内容中阻止呈现的 JavaScript 和 CSS来加快网站速度

网站打开很慢用PageSpeed Tools测试后说要  清除首屏内容中阻止呈现的 JavaScript 和 CSS。百度了下说要这么操作的:但在wordpress 里要怎么进行这些操作啊?

浏览器必须先解析网页,然后才能将其呈现给用户。如果浏览器在解析过程中遇到系统阻止的外部脚本,必须停止解析并且下载该JavaScript。每次遇到这种情况时,浏览器都会增加一个网络往返过程,这样就会导致首次呈现网页的时间延迟。

建议

建议您以内嵌方式处理呈现首屏区域所需的JavaScript,并让为网页添加其他功能所需的JavaScript延迟加载,直到首屏内容发送完毕为止。请注意,要通过这种方式缩短加载时间,您还必须优化CSS发送过程。

内嵌较小的JavaScript

如果外部脚本较小,您可以直接将它们添加到HTML文档。通过这种方式内嵌较小文件可让浏览器继续呈现网页。例如,如果HTML文档如下所示:

<html>  <head>    <scripttype="text/javascript"src="small.js"></script>  </head>  <body>    <div>      Hello, world!    </div>  </body></html>

资源small.js如下所示:

  /* contents of a small JavaScript file */

那么,您即可按如下这样内嵌脚本:

<html>  <head>    <scripttype="text/javascript">      /* contents of a small JavaScript file */    </script>  </head>  <body>    <div>      Hello, world!    </div>  </body></html>

这样,您就可以将small.js内嵌在HTML文档中,从而消除对它的外部请求。

延迟加载JavaScript

为防止JavaScript阻止网页加载,建议您在加载JavaScript时使用HTML异步属性。例如:

<script async src="my.js">

如果您的JavaScript资源使用的是document.write,则使用异步加载就会不安全。我们建议您重写使用document.write的脚本,以改用其他技术。

此外,异步加载JavaScript时,如果您的网页加载互相依赖的脚本,请务必谨慎,以确保您的应用以合适的依赖顺序加载脚本

点赞
举报
收藏
转发
0/500
添加表情
评论
3天2夜学会建站
置顶时间 :

设置帖子类型

普通
新闻
活动
修改

圈内转发

0/104

分享至微信

复制链接

举报

请选择举报理由

留联系方式
垃圾广告
人身攻击
侵权抄袭
违法信息
举报

确认要删除自己的评论吗?

取消 确定

确认要删除自己的文章吗?

取消 确定
提问
设置提问积分
当前可用积分:
-
+
20
50
100
200
偷看

积分偷看

10积分
我的积分(可用积分)
确认偷看

问题已关注

答主回复后,系统将通知你

不再提示