我缩小了js和css并优化了图像。在js中使用了async=“async”。如何修复“在折叠内容中消除渲染阻塞JavaScript和CSS”有什么想法吗？
yeotifhr1#
渲染意味着加载，所以如果有什么东西阻止了渲染，那就意味着它阻止了页面尽快加载。1)在页眉中加载css，但在页脚中加载Js2)使用子画面图像3)您可以添加htaccess代码以获得更好的性能
4)仅在页面上加载所需的css/js选择最佳方法一旦你确定了哪些脚本需要被移动，就到了决定“如何”修复它们的时候了。有两种主要的方法可供选择。第一种是使脚本内联;在这种方法中，脚本的内容直接添加到页面的HTML中，并且只在需要时才加载。2如果脚本很小并且只应用于一个页面，这是最好的选择。另一种选择是延迟脚本。当您延迟JavaScript时，您将延迟加载任何不重要的脚本，直到第一次渲染之后或加载了更重要的部分之后。当脚本不是关键的并且可以等待加载时，此方法是最佳的。PS：-在某些情况下，我们无法完全解决这个问题。希望对你有帮助
nxowjjhe2#
如果你使用了async属性，你的JavaScript就不会阻止DOM元素的加载。但是我们只完成了一半。关于CSS，缩小它是一个很好的开始，但是它仍然会阻止解析器呈现元素，直到它完成加载。下面是我更喜欢的解决方案，它调整样式表链接的media属性，直到它被加载：
async
media
<link rel="stylesheet" href="css/styles.css" media="wait" onload="if(media!='all')media='all'"> <noscript><link rel="stylesheet" href="css/styles.css"></noscript>
dohp0rv53#
我想问一下我是否替换了原始代码：与：它将在我的网站上工作，这是在prestashop平台。谢谢！
3条答案
按热度按时间yeotifhr1#
渲染意味着加载，所以如果有什么东西阻止了渲染，那就意味着它阻止了页面尽快加载。
1)在页眉中加载css，但在页脚中加载Js
2)使用子画面图像
3)您可以添加htaccess代码以获得更好的性能
4)仅在页面上加载所需的css/js
选择最佳方法一旦你确定了哪些脚本需要被移动，就到了决定“如何”修复它们的时候了。有两种主要的方法可供选择。第一种是使脚本内联;在这种方法中，脚本的内容直接添加到页面的HTML中，并且只在需要时才加载。2如果脚本很小并且只应用于一个页面，这是最好的选择。
另一种选择是延迟脚本。当您延迟JavaScript时，您将延迟加载任何不重要的脚本，直到第一次渲染之后或加载了更重要的部分之后。当脚本不是关键的并且可以等待加载时，此方法是最佳的。
PS：-在某些情况下，我们无法完全解决这个问题。
希望对你有帮助
nxowjjhe2#
如果你使用了
async属性，你的JavaScript就不会阻止DOM元素的加载。但是我们只完成了一半。关于CSS，缩小它是一个很好的开始，但是它仍然会阻止解析器呈现元素，直到它完成加载。下面是我更喜欢的解决方案，它调整样式表链接的media属性，直到它被加载：dohp0rv53#
我想问一下我是否替换了原始代码：
与：它将在我的网站上工作，这是在prestashop平台。谢谢！