缓存的jquery文件和缓存的CSS会使页面变慢

问题描述 投票:0回答:3

[尝试优化我的Wordpress网站,我对如何改进有一些疑问。在本文的下半部分,您可以看到Google PageSpeed建议我删除未使用的CSS以及渲染阻止内容,我的问题是:

  1. jQuery文件在我看来似乎很大,为什么要为缓存的jQuery文件使用780ms?
  2. 并且缓存的CSS减慢我的页面速度是否合乎逻辑?

让我知道是否需要更多信息。非常感谢!

页面网址:https://utanuc.nu

主题

  • Hello Elementor

Plugin

  • WP Rocket Pro

已删除未使用的CSS:

  • / wp-content / 缓存/分钟/ 1 / aad770152f8bd8d0197b0ef0ecc3052b。css(143 kb)

渲染阻止内容:

  • / wp-content / 缓存/清除/ 1 / wp-includes / js / jquery / jquery-1.12.4-wp。js(要加载780毫秒)
wordpress pagespeed google-pagespeed pagespeed-insights
3个回答
1
投票

[Google Page Speed告诉您,缓存文件减慢了您的页面速度,不是因为缓存文件比非缓存文件慢。

这是因为(例如)文件:/wp-content/cache/min/1/aad770152f8bd8d0197b0ef0ecc3052b.css是所有CSS文件的组合,并且是唯一的文件,因此它包含您的所有主题,插件和WP CSS代码。

[不缓存文件时,Page Speed会检查它们,并列出每个文件(例如),例如:20个文件* 50ms。现在,当它是一个缓存文件时,Google Checker会告诉您类似1个文件* 1200毫秒-一个文件的速度更快,但它看起来像是一个大的网站正在缓慢的文件。

顺便说一句,您必须知道,当前的页面速度结果对于基于重主题(如Hello Elementor的网站)的网站确实非常好,因此如果不更改列出的主题,将很难加快速度。

关于jQuery-Page Speed告诉我它正在加载136ms,所以也许您已经更改了某些内容,或者Page Speed在特定情况下给出了不同的结果。


0
投票

您可以安装此插件来删除缓存。https://en-gb.wordpress.org/plugins/wp-fastest-cache/


0
投票

实际上到目前为止,由于误解了每个比特的含义,所以所说的是不正确的。

渲染阻止内容:

呈现阻止内容是页面必须加载以呈现“首屏”内容的内容(第一页包含了无需滚动即可看到的全部内容)。

因为它是JavaScript阻止页面,所以您可以在所有JavaScript文件上使用defer属性(我不使用Rocket,但请看看是否可以找到允许设置所有JavaScript的设置至defer)。

这意味着页面将仅在所有HTML均已加载并解析后才开始加载JS,因此不会“阻止”渲染。

重要-您可能会看到使用async的选项。我从未见过的主题可以设置为处理async,因为它可以以任何顺序加载所有JS并尽可能快地执行它,因此有时它可能会无序执行并导致错误(因为jQuery可能在某些情况下加载)需要jQuery)。 defer保持JS文件在HTML中的显示顺序。

已删除未使用的CSS:

所以这就是听起来的样子。

[大多数主题文件具有数百个CSS类等,只是根本不需要呈现页面(因为页面设计,颜色等有很多变体。]

要解决此问题,您必须找到主题实际使用的所有样式(在每个页面上,整个网站上,在每种状态下(悬停,访问等)。

然后您将删除网站中任何地方不需要的任何内容。

[您可能会想象这是一项艰巨的任务,我可能会完全忽略这一点,因为这是一个很难解决的主题,需要您从头开始设计。

© www.soinside.com 2019 - 2024. All rights reserved.