跳至主要内容
6分钟阅读时间 (1143字)

如何在WordPress中分组和压缩资源

文件分组和压缩

拥有最佳性能是每个管理网站的人的梦想,在WordPress上分组和压缩资源是我们能做的最好的事情之一,但这可能真的很难。分组所有资源(主要是css和js文件)可能会使您的网站暴露,如果您不是开发人员,因为它可能会产生冲突。.

WP Speed of Light 是使您的WordPress网站运行最佳的解决方案,因为它有很多选项可以使您的网站加载速度快,仪表盘非常友好,是的,其中一个选项是分组和压缩资源。单个文件的包含/排除在分组和压缩过程中是自定义优化的关键,不会产生冲突。

我们将使用一个示例WordPress网站来撰写这篇博客文章,我们将学习如何做到这一点,以便配置所有内容的过程将更加容易。.

 

如何进行WordPress JS和CSS压缩

让我们学习如何进行wordpress js和CSS压缩,但首先,我们需要了解压缩是什么意思“压缩是指在不影响浏览器处理资源的情况下删除不必要或冗余数据的过程 - 例如代码注释和格式,删除未使用的代码,使用更短的变量和函数名等”。.

现在我们要做的是对我们的页面进行速度测试,以便查看更改,在这个例子中,我们使用的是一个带有woocommerce和一些产品的网站,所以第一次加载会比较慢。.

 

测试前

 

是的,加载页面需要2.79秒,不错但仍有改进空间,只需压缩js和CSS文件并查看差异,前往WP Speed of light > 加速 > 组合和压缩,您将看到包含所有压缩选项的菜单。插件免费版本包含组合和压缩选项,但可视文件排除仅在PRO插件版本中可用。

 

group-and-minify-dashboard

 

PRO 附加组件选项包括: 排除内联脚本(从压缩中排除内联脚本),将脚本移到页脚(通过将所有压缩脚本移到页脚来加速您的网站),组合字体和 Google Fonts(将本地字体和 Google 字体组合到一个文件中以更快地提供服务)以及高级文件排除。
 
如您所见,您可以选择压缩 JS、CSS 以及 HTML。现在只需激活这些选项,点击保存,所有资源将立即被压缩。虽然这是一个高级配置,但可能会出现问题,不过通过排除某些代码和文件(使用专业附加组件)可以解决一切问题。

 

压缩资源

 

 

现在,所有原本需要开发人员花费数小时的工作都可以在几秒钟内完成。.

 

下一步,优化WordPress的CSS和JS

通过这个插件,我们只需在仪表板上启用组选项,就可以让WordPress优化CSS和JS。转到WP Speed of Light > 加速 > 组合和压缩,您将能够看到一个带有组合CSS和JS选项的仪表板。

这些选项允许您:

  • 组合JS:将多个JavaScript文件合并为一个文件,可以减少HTTP请求的数量
  • 组合CSS:将多个CSS文件合并为一个文件,可以减少HTTP请求的数量。.

HTTP 请求:每次我们在同一站点中选择某项或转到另一页面时,都会向服务器发出请求,因此如果我们能够减少这些请求,加载时间就会缩短。.

要检查您可以在网站上分组多少文件和脚本,只需打开浏览器控制台(右键单击 > 检查或 F12),然后打开 网络面板

 

列表脚本 Chrome

然后,您可以按类型列出所有加载的文件,在此示例中,我仅单击了 JS 文件列表。.

现在我们正在进行此设置,只需启用组选项(组CSS和组JS)并点击保存,请注意,这些选项必须谨慎使用,您必须测试您的页面,因为它可能会导致冲突。.

 

让我们认真起来并优化字体粗细

什么?其他优化?是的!您将能够优化字体粗细,而且就像在设置中启用该选项一样简单,只需转到WP Speed of Light > 加速 > 分组与压缩 > 分组字体和谷歌字体选项。
分组字体和谷歌字体选项将允许您将它们分组到一个文件中,以便更快地提供服务,这非常方便,因为大多数WordPress主题和布局默认带有2种或多种字体,并包含所有变体(常规,粗体,斜体...)

只需启用该选项,点击保存,所有字体将被分组。.

 

分组字体

 


现在我们已经激活了所有选项以压缩和分组资源,我们应该会看到网站加载时间的差异,让我们来检查一下速度。.

 

测试后

 

多么大的差异,从2.8秒到0.56秒!正如我们在这篇文章开头告诉你的那样,我们可以使加载时间更好;)

 

如何使用文件压缩排除

压缩可能会在您的站点中引起问题,它主要发生在您将包含语法错误或类似变量、类名的错误的文件分组时。这就是为什么使用“文件压缩排除”选项,您将能够从压缩和分组过程中排除文件,转到WP Speed of Light > 加速 > 分组和压缩,您将能够看到高级文件排除选项。

为了使用高级文件排除,您需要先运行扫描,启用选项并点击运行扫描。.

 

group-resource-conflict-alert


  To be able to list the script loaded on your website, WP Speed of Light needs to scan your folder to list them. They are usually all contained in your /wp-content folder that group all your plugins and theme. Select that folder (at least) and click on “Scan Now”

 

选择要扫描的文件夹

 

它将运行扫描,最后,在扫描完成后点击查看结果。.

 

已扫描

 

按类型(全部、JS、CSS、字体)分类的文件列表应显示在下面。如果您已经确定了一个导致问题的文件,在激活文件组和压缩时,您可以通过使用简单的 开关将其排除在外。

 

排除文件

 

这将帮助您排除文件,并以这种方式轻松解决压缩资源时可能存在的任何问题…… 组合和压缩过程仍然需要一些工作,特别是在测试方面,但它绝对值得努力,您将始终能够通过直接从运行速度测试来测试其工作原理WP Speed of Light
 
继续尝试WP Speed of Lighthttps://www.joomunited.com/wordpress-products/wp-speed-of-light

保持信息畅通

当您订阅博客时,我们会在网站有新更新时发送电子邮件给您,这样您就不会错过它们。.

相关文章

 

评论

没有评论,请留下您的第一条评论
已经注册?在此登录
2026年3月3日 星期二

验证码图片