解决折叠上方内容中JavaScript和CSS的选项

Options to solve JavaScript and CSS in above-the-fold content

本文关键字：CSS 选项 JavaScript 折叠 方内容 解决      更新时间：2023-09-26

我使用谷歌的页面速度验证了一个网站，得到了以下错误：

Eliminate render-blocking JavaScript and CSS in above-the-fold content
Your page has 1 blocking script resources and 1 blocking CSS resources. This causes a delay in rendering your page.

JAVASCRIPT

我的页面底部有两个javascript文件：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="/scripts/main?v=5jyyqQNx45M0Mbw-ZD6J9SVac8LfWyZZLh_wq6HtfQI1" type="text/javascript" async></script>

我从Google CDN获得JQuery，从本地服务器获得Main.js。

我在Main.js上应用了async，但这并不能解决问题。。。

唯一能解决这个问题的是从谷歌的CDN向JQuery添加异步。

但随后Main.js中使用JQuery的代码停止工作。。。不知道为什么。

CSS

我不知道该怎么解决。有什么建议吗？

有人能帮帮我吗？

谢谢，Miguel

但随后Main.js中使用JQuery的代码停止工作。。。不知道为什么。

这段代码中断了，因为jQuery是在执行Main.js之后加载的，而Main.js依赖于它。。好吧，它会失败的。

你不会到处加载CSS和JS，因此除了使用纯HTML之外，你真的什么都做不了。

链接的谷歌帮助页面上写着：

  • 如果你的CSS/JS文件很小，那么使用内联标签加载它
  • 你可以尝试将重要的CSS/JS放在一个文件中，而不那么重要的放在另一个异步加载的文件中
相关文章：