Impreza是一个流行的基于WPBakery的主题,有它自己的味道。在这篇文章中,一位WPMU DEV成员分享了如何优化这个多用途的WordPress主题,以获得最佳速度和最佳性能。
作为WPMU DEV成员、网站开发人员和加拿大网页设计公司的老板Phil Martin CapitalWebDesign.ca 最近与我们分享,”最近有很多人对优化基于WPBakery的主题感兴趣,我想我应该对我最近一直在使用的WPBakery驱动的主题Impreza提供我的一点经验。”
在这篇文章中,我们将介绍以下内容。
WordPress的Impreza主题概述
Impreza 是一个使用WPBakery的高级WordPress主题。它由UpSolution开发和维护,目前可从ThemeForest获得,在那里它被列为他们最畅销的主题之一,迄今已有超过80,000个销售量,并在2200多个用户评论中获得4.89/5星评级。
该主题的许可费通常为59美元,但经常以39美元的价格出售,并附带12个月的支持。
正如菲尔所说。”他们平均每个月都会推送大的更新。 说真的,看看这个更新日志吧 并试图说服我这不是你在很长一段时间内看到的最好的更新日志布局/风格。”
Impreza主题使用WPBakery,但加入了他们自己的味道。这是一个令人难以置信的模块化主题,解耦了许多结构组件,包括。
- 网格布局。 Impreza让你自定义如何显示数据组,如帖子,自定义帖子类型,如推荐或产品,图片库等。你可以有效地定制网格中的任何元素。 请看他们的网格布局文档页,一目了然。
- 页块。 该主题提供了可重复使用的块。这让你可以在一个地方编辑所有的东西,然后在你添加了块的地方反映出变化。将这些块用于页脚、号召行动等。
- 页面模板。 你可以使用WPBakery建立一个模板,可以应用于任何帖子类型或页面。使用这些模板可以为帖子和页面提供不同的页脚,或者根据帖子类型支持不同的模板(例如,博客中的烹饪食谱和产品评论)。
- 页眉构建器。 Impreza提供了一个独特的、强大的、非常直观的页眉构建器。 请查看标题生成器的文档页面。
关于Impreza还有一些需要注意的地方。
- 它原生支持ACF的大部分自定义字段(如果你使用我们的 用于SEO的SmartCrawl插件,它也支持ACF)。)
- 100%兼容于 WPML语言翻译插件.
- 内置性能优化选项 (包括对WPBakery元素的一键式资产优化:只包括您页面上存在的元素的CSS + JS)
- 内置维护模式,按钮生成器,自定义图片尺寸等。
- 能够导入单个演示 页面 或具体复制 从特定的演示页中复制行.这是一个很好的生活质量选项:当你在演示中看到一个你想复制的特定行时,只需复制+粘贴。
- 每个许可证对1个生产网站和1个开发网站有效(强制维护模式)。有许可证的网站为您提供主题白标、演示文稿导入、一键式主题更新(无需Envato插件)、附加组件/推荐插件(如。 Smush)
- 注意。 每个网站运行一个许可证是没有必要的,你可以在需要安装插件或导入演示的地方轮换一个许可证。对于没有许可证的网站,也仍然可以通过Envato Plugin进行主题更新。另外,在你的支持是活跃的时候,主题开发者会帮助你进行几乎所有的主题定制,根据广泛使用该主题的菲尔的说法,他们的支持人员是非常有知识的。
所以,Impreza是一个很好的WordPress主题,特别是如果你喜欢使用WPBakery。
然而,我们真正想知道的是这个。
- 用Impreza创建的网站加载速度快、性能好吗?
- 我们能否利用我们的优化插件Smush和Hummingbird以及管理的WordPress主机,使用Impreza创建的网站加载更快,表现更好?
对于这些答案,让我们来看看Phil的…
优化Impreza WordPress主题的测试方法
Impreza是非常注重性能的,从他们提供的一些高级主题选项就可以看出。
要了解Impreza在以下方面的排名情况,可以使其在 谷歌PageSpeed Insights 和 GTmetrix,这里是菲尔的测试方法,用他自己的话说。
(编者注:像Phil这样的WPMU DEV会员可以自动获得我们的专业版插件,作为他们的一部分。 WPMU DEV会员资格的一部分。 但你可以按照下面的方法,使用免费版本的 Smush 和 蜂鸟.)
- 使用一个真正的网站。 我在这个基准中使用的网站是一个真实的、完全建成的网站。虽然它还没有向公众开放,但它正在运行WPML,并且充满了包括图片在内的真实内容。
- 托管于WPMU DEV: 位于加拿大多伦多的一个简单的青铜级服务器。我们将测试FastCGI服务器侧的缓存
- Smush Pro: 图片优化对这个网站很重要,因为每篇博文都有一个特色图片。这个网站在未来5年内可能会发展到10,000多篇博文,所以我们需要确保从一开始就进行优化。
- 蜂鸟专业: 测试资产优化是否在Impreza上发挥作用。
- 缓存: 我们不需要缓存方案中的冗余,所以要么 蜂鸟专业缓存 或 服务器端FastCGI缓存 被使用。
- 翼豹的性能设置。 在文件路径中保留 “http/https”,禁用jQuery迁移脚本,将jQuery脚本移至页脚,动态加载主题JS组件,禁用WPBakery Page Builder的额外功能,禁用Gutenberg(块状编辑器)CSS文件,优化JS和CSS大小,并将Google Fonts样式合并到单个CSS文件。
基准测试结果
测试是在禁用两个插件、关闭Impreza性能设置和禁用服务器端缓存的情况下开始的。
菲尔随后逐步启用了一个组件,每次都是如此。Google PageSpeed Insights运行了三次(保持三次运行的平均值),并生成了一份GTmetrix性能报告。
以下是菲尔的测试结果。
从上面可以看出,菲尔的测试结果从…
之前(仅翼豹)。
- 谷歌PSI移动得分。 27
- 谷歌PSI桌面得分。 83
- GTmetrix得分。 A – 92%-94%
- GTmetrix *FCP: 1.1s
- GTmetrix **TTFB: 0.8s
经过(Impreza + Smush + Hummingbird + CDN/Caching)。
- 谷歌PSI移动得分。 87 (提高222%)
- 谷歌PSI桌面得分。 96 (提高15.6%)
- GTmetrix得分。 A – 100%-95%
- GTmetrix *FCP: 0.461s
- GTmetrix **TTFB: 0.206s
* FCP = 第一批内容丰富的油漆
** TTFB = 时间到第一个字节
在运行上述测试后,以下是菲尔发现表现最好的设置。
- Impreza性能设置。 全部启用。
- 斯穆什。 所有推荐+CDN+WebP(专业版功能)。此外,确保在Smush > Integrations菜单中启用WPBakery Page Builder整合。这将粉碎使用WPBakery的Page Builder编辑器调整的自定义大小的图片。
- 蜂鸟。 所有推荐 + CDN + 资产优化 自动/快速。
- 缓存。 无论是Hummingbird Pro还是服务器端的FastCGI。
- Impreza + WPMU DEV主机 他们自己仍然做了一个很好的工作。PageSpeed Desktop上的83/100和GTmetrix上的A级(92%;94%)令人印象深刻,但显然移动端上的27分并不理想。
- Impreza的内置性能优化 是非常有效的。它将谷歌的PageSpeed分数都提高到了90分,这对移动端尤其重要。
- Smush 似乎对性能评分没有太大影响,但在有图像的情况下,它将减少你的整个页面加载大小。
- 蜂鸟 缓存似乎与FastCGI服务器端缓存相当。
- 蜂鸟专业CDN 似乎与让服务器通过FastCGI缓存提供CSS+JS的做法不谋而合。
以下是菲尔在运行测试后提供的一些额外的有价值的见解。
- “完全毁掉这些分数的第一件事是谷歌的reCAPTCHA javascript。”
- “说实话,我很惊讶这个主题+WPMU DEV主机w/FastCGI服务器端缓存的表现。在没有其他插件的情况下,TTFB为0.224s,PageSpeed Insights为92/98,这令人难以置信。Smush Pro是一个额外的优化层,它提供超级优化的图像文件。蜂鸟专业版可以放松一下,不必担心服务缓存的问题。相反,它可以专注于设置我们所有的过期标题,监测正常运行时间,并从CDN提供CSS/JS服务。”
用Smush和Hummingbird优化Impreza,你就可以吃到你的蛋糕了!
让Impreza的性能更上一层楼
用菲尔自己的话说。
“在过去使用过许多排名靠前的多功能主题(Avada、Enfold、Etalon、Extra、Jupiter、Salient等),我从来没有像使用Impreza那样成功建立现代、简约、高效和超性能的网站。用预置的模板和演示库换取周到的设计、广泛的可定制性和荒谬的性能,对我来说是值得的。
看,结果不会说谎:在GTmetrix上没有一个测试掉出A级。”
所以,你有了它!
Impreza不仅是一个由WPBakery页面生成器驱动的快速加载的WordPress多用途主题,而且它的性能可以通过使用Smush和蜂鸟优化插件以及启用CDN和FastCGI等服务器端托管功能来提高。