FlyingPress插件教程WordPress轻量级速度优化插件

[2024]FlyingPress插件教程WordPress轻量级速度优化插件

FlyingPress插件教程WordPress轻量级速度优化插件

  如果你使用的是Google Search Console,可能会看到称为Core Web Vitals的内容。谷歌显示这些数据让您了解慢速、中速或快速的页面。

FlyingPress插件教程WordPress优化插件

  网站排名有部分取决于您网站的速度。如果您的网站速度很慢,则意味着您的网站可能需要一些时间才能排名。这就是使用FlyingPress插件的原因,它可以帮助WordPress建站用户加速网站。本文,晓得博客为你介绍FlyingPress插件教程WordPress轻量级速度优化插件。

  推荐:WPControl性能优化插件WordPress最简单的优化插件教程

什么是FlyingPress

  FlyingPress是WordPress网站的一站式解决方案,可以处理所有事情。从页面缓存、CDN到图像优化。任何非技术人员都应该能够创建超快的WordPress网站,而无需使用太多教程或多个插件来优化速度。

  FlyingPress自动化所有可能的优化,用户就不会感到头疼。

  推荐:WordPress性能优化插件

FlyingPress定价

  FlyingPress有4个计划,Personal、Developer、Professional 和 Agency。个人计划起价为60美元/年。您可以根据网站选择计划。

FlyingPress定价

FlyingPress功能

  以下是FlyingPress的主要功能:

  • 页面缓存——生成静态HTML页面并直接从您的Web服务器提供它们。
  • 缓存预加载——当您进行一些更改时自动生成缓存页面。
  • 删除未使用的CSS——生成关键CSS并删除未使用的CSS。
  • 预加载链接——在用户点击之前在浏览器中预加载页面。
  • 延迟脚本执行——仅在用户交互时加载和执行非关键脚本。
  • 缩小——在服务器中或通过FlyingCDN缩小CSS和JavaScript文件。
  • 延迟脚本——通过延迟它们来避免渲染阻塞脚本。
  • 优化数据库——优化和清理数据库表并将它们设置为自动驾驶!
  • 延迟加载——延迟加载图像、HTML元素、视频、iFrame等。
  • 优化Google字体——自托管、组合和预加载Google字体。可选择显示后备字体。
  • 优先资源——优先考虑关键资源,如上述折叠图像和字体以高优先级加载。
  • 减少布局偏移——添加缺少的宽度和高度属性以减少由图像引起的布局偏移。

  推荐:WordPress网站如何使用WP Rocket删除未使用的CSS

最佳FlyingPress设置概述

  一旦安装并激活FlyingPress,该插件将应用许多安全的默认设置,这些设置应该适用于绝大多数网站。但是,我们还可以配置更多设置以使您的网站更快,可参考我们的FlyingPress插件教程。

1、FlyingPress 插件仪表板
FlyingPress插件仪表板

  FlyingPress仪表板非常基本,包含三个不同的部分——缓存、帐户和支持。缓存区域仅在启用FlyingPress缓存时才会显示,将看到当前缓存的页面数。还可以使用“清除缓存Purge Cache”“清除和预加载缓存Purge & Preload Cache”按钮。

  除非需要手动清除缓存,否则不应该使用这些按钮,如果确实需要使用,建议使用“清除和预加载缓存Purge & Preload Cache”按钮,因为这会预缓存页面,以便网站访客感受到快速的加载时间。

  帐户区域告诉您以下信息:

  • FlyingPress账户状态是否有效
  • FlyingPress帐户关联的名称
  • FlyingPress许可证的到期日期,以便知道何时更新许可证
  • 在帐户部分的右上角有一个访问FlyingPress帐户的快速链接

  支持区域快速链接:

  • 文档:如果想知道应该使用哪些FlyingPress设置,建议使用FlyingPress文档
  • Facebook社区:FlyingPress Facebook群组拥有超过1,000名成员,非常棒
  • 支持:如果对FlyingPress有疑问或问题,请使用,FlyingPress团队将在24小时内回复您的查询

  推荐:什么是网站缓存?WordPress网站怎么使用缓存?

2、FlyingPress 插件缓存设置
FlyingPress插件缓存设置

  应该使用FlyingPress中的缓存页面设置,当启用“缓存页面”时,FlyingPress将为您的所有页面生成静态HTML版本,这可以大大提高您的首字节时间(TTFB)。这是因为页面的HTML版本被缓存,并不需要用户使用时再每次从PHP、WordPress和数据库调用动态生成的页面,确实会减慢页面的响应速度。

  FlyingPress缓存是如何生成的?FlyingPress将通过预加载站点地图中指定的页面来构建您的静态HTML页面缓存,该页面会自动检测到。

  1、Additional Auto Purge自动清除

  启用“缓存页面”后,可以选择是否要在发布或更新帖子时自动清除其他页面缓存。FlyingPress非常擅长在发布或更新帖子时自动检测应该清除哪些页面,但也有可能希望清除缓存以获取其他帖子或页面。

  • 所有帖子和页面All Posts and Pages——清除所有帖子和页面的缓存
  • 仅页面Pages only——仅清除页面缓存以及自动检测到的URL
  • 无None——仅清除自动检测到的URL

  2、缓存寿命

  可以指定在特定生命周期后自动清除和预加载站点的缓存,大多数网站应将“缓存寿命”设置为“Never绝不”,但如果遇到“nonce”验证问题,您可能需要将其设置为较低的值。

  请记住,自动清除缓存的频率越高,它将使用的服务器资源就越多。

  3、从缓存中排除页面Exclude Pages from Caching

  如果使用WooCommerce电子商务插件,FlyingPress会自动从缓存中排除某些页面,例如“购物车”、“结帐”和“帐户”页面。可能仍然需要从缓存中排除其他页面。可以通过在“Exclude Pages from Caching”框中添加关键字“custom-checkout”来自动将此页面排除在缓存之外。

  4、忽略查询字符串Ignore Query Strings

  在此框中,您可以键入要删除的查询字符串并改为提供缓存页面。当URL中有查询字符串时,FlyingPress不会缓存该页面,而是动态优化该页面。默认情况下FlyingPress会忽略大量查询字符串,而是为缓存页面提供服务。

  如果需要除默认FlyingPress之外的其他查询字符串,可以在“Ignore Query Strings忽略查询字符串”框中添加关键字。

  注意:如果启用Cloudflare APO,则需禁用FlyingPress缓存

  推荐:WordPress缓存插件WP Fastest Cache插件使用教程

3、FlyingPress 插件CSS优化
FlyingPress插件CSS优化

  1、缩小和优化CSS文件

  应使用FlyingPress优化插件中的“Minify & Optimize CSS Files缩小和优化CSS文件”设置。这会通过删除CSS文件中所有不必要的字符(例如空格、空行和注释)来提高网站的加载速度。保存此选项后,单击站点并确保你的WordPress网站运行正常。

  2、生成关键和使用的CSS

  FlyingPress生成关键和使用的CSS功能解决了Google PageSpeed Insights中针对您的CSS文件的“消除渲染阻塞资源”建议。

  Critical CSS和Used CSS略有不同。

  Critical CSS关键CSS是在首屏呈现页面所需的所有CSS,FlyingPress找出必要的CSS并将其直接注入到head标签中,

  Used CSS使用的CSS是为您的页面删除所有未使用的CSS后生成的所有剩余CSS,然后将使用的CSS作为异步加载的外部样式表注入。

  推荐:WordPress网站如何使用WP Rocket删除未使用的CSS

  3、加载未使用的CSS

  启用“Generate Critical and Used CSS”设置后,可以从三个选项中选择如何加载未使用的CSS:

  • 异步加载Asynchronously——其余CSS文件将与您的其余文件异步加载。这是最安全的选择。
  • 关于用户交互On user interaction——类似于异步加载文件,除了剩余的CSS文件在用户交互(鼠标移动、键盘输入、滚动等)之前不会加载
  • 删除Remove——将删除所有未使用的CSS文件,从不加载它们,但要小心,使用此选项可能会出现网站问题。

  注意:如果选择“关于用户交互”或“删除”选项,请彻底测试您的网站,尤其是在初始页面,可能看到样式本身正确。

  4、强制包含选择器

  有时,FlyingPress可能不包括它需要的所有关键和使用的CSS。如果您发现需要包含的元素缺少某些选择器,您可以在“强制包含选择器”框中指定这些选择器。

  5、延迟渲染HTML元素

  延迟渲染HTML元素可以大大提高您的交互时间(TTI)、总阻塞时间(TBT)和最大内容绘制(LCP)分数。可以告诉您的浏览器在用户将其滚动到其视口附近之前不要渲染任何这些内容。

  推荐:如何将自定义CSS添加到WordPress网站

4、FlyingPress 插件JavaScript优化
FlyingPress插件JavaScript优化

  JavaScript部分包含优化网站,将有助于减少首次输入延迟(FID)或总阻塞时间(TBT),这将处理Google PageSpeed Insights 和 GTMetrix中的许多速度建议,帮助通过了Core Web Vitals。

  1、Minify JavaScript缩小JavaScript

  会通过删除JS文件中所有不必要的字符(例如空格、空行和注释)来提高站点的加载速度。保存此选项后,刷新站点并确保一切看起来都还不错。

  2、Preload Links预加载链接

  启用此选项将改善浏览您网站的用户的页面加载时间。如果访客悬停到链接,该页面将开始在后台获取。当用户点击链接时,页面将立即加载。

  3、Defer JavaScript延迟JavaScript

  FlyingPress插件中的“延迟JavaScript”设置。有助于显着降低Core Web Vitals的首次输入延迟(FID)或总阻塞时间(TBT)时间。建议在网站的页脚中加载JavaScript文件或延迟它们,以免它们阻止您网站上其他资产的下载,从而减慢速度。

  启用此选项将使用defer属性加载您网站上的每个JS文件。如果发现此选项因脚本有问题而导致站点出现bug,可以使用“Exclude Scripts from Defer”框来指定应从延迟中排除的脚本。

  推荐:Perfmatters免费下载WordPress性能优化插件

  4、Defer Inline JavaScript延迟内联JavaScript

  内联JavaScript是立即执行的脚本。当启用“延迟JavaScript”设置时,一些内联脚本可能会引发错误。因此,还应该启用“Defer Inline JavaScript”设置,它将内联脚本也转换为延迟加载。

  5、Exclude Scripts from Defer从延迟中排除脚本

  可以指定要从延迟中排除的脚本。当启用“Defer JavaScript”设置时,每个脚本都可能无法使用其上的defer属性。如果需要排除某个脚本获取defer属性,可以添加该脚本的URL或与script标签匹配的关键字。

  6、Load Scripts on User Interaction在用户交互时加载脚本

  FlyingPress中的用户交互加载脚本功能是可能会将您网站的加载时间增加几秒钟。Load Scripts on User Interaction通过仅在存在用户交互(例如鼠标移动、键盘输入、滚动、触摸移动屏幕等)时加载和执行指定的脚本来提高性能。

  启用此功能可以大大改善Google PageSpeed Insights中的许多速度建议,如果网站有大量需要加载的资源密集型脚本(例如Google Analytics、AdSense、聊天插件、Gravatars、FacebookPixel、YouTube嵌入和社交等第三方脚本),此功能为网站提供巨大的速度提升)。

  FlyingPress包含在用户交互时自动加载的默认脚本列表,可以根据需要删除或添加自己的脚本。

  • googletagmanager.com
  • google-analytics.com
  • googleoptimize.com
  • adsbygoogle.js

  如果您使用的是Google AdSense等广告服务,请确保启用此选项后数据或收入不受影响。

  推荐:如何将Google AdSense添加到WordPress网站

5、FlyingPress 插件字体设置
FlyingPress插件字体设置

  假设你是WordPress外贸建站用户,网站使用Google字体,那么FlyingPress优化插件的字体部分将为你带来莫大好处。

  1、Optimize Google Fonts优化谷歌字体

  如果在网站上使用Google字体,当您启用优化Google字体设置时,FlyingPress插件将:

  • 合并页面上的所有Google字体以减少HTTP请求
  • 自托管Google字体(下载并保存在本地字体)
  • 内联Google字体CSS

  注意:FlyingPress无法优化由外部JavaScript文件(例如reCAPTCHA)注入的Google字体。

  2、Display Fallback Fonts显示后备字体

  如果你的网站使用系统字体,那么你不需要做任何事情,因为系统字体不需要后备字体。

  当您使用Google字体等外部字体时,Google字体在完全加载之前不会显示。在FlyingPress中启用“显示后备字体”后,网站将向用户显示系统字体,直到Google字体准备好,才会替换显示。

  推荐:如何在Genesis Sample子主题中更改字体或添加字体

  3、Preload Fonts预加载字体

  FlyingPress“Preload Fonts预加载字体”告诉浏览器开始下载字体,否则会等很久,通常是CSS文件中引用字体。

  如何知道在FlyingPress中预加载哪些字体URL?最简单的方法是转到Google PageSpeed Insights并输入您要分析的页面的URL。如果看到“预加载请求”的建议,在该部分下查找字体URL列表。选择“复制链接地址”,然后将其添加到FlyingPress中的“预加载字体”框中。

  推荐:Astra主题开启本地加载谷歌字体提高网站性能

6、FlyingPress 插件图像优化
FlyingPress插件图像优化

  1、延迟加载图像

  启用“延迟加载图像”选项后,页面初始渲染不需要的图像只有在用户在视口附近滚动时才会加载。如果正在使用另一个延迟加载图像的性能插件或WordPress主题,请确保在其他插件中禁用它,并仅在FlyingPress中启用此选项。

  2、从延迟加载中排除折叠图像

  延迟加载图像可以防止浏览器需要加载大量位于首屏且网页初始渲染不需要的图像。

  第一次加载页面时需要的首屏图片呢?例如,假设博客文章中有徽标和特色图片加载到首屏,那么如果打开了该选项,这些图像也将被延迟加载。延迟加载的首屏图像最终会在页面生命周期的后期渲染,这可能会延迟您的最大内容绘制(LCP),从而损害您的页面分数。因此,需要排除图像以改善LCP和访问者的整体加载体验。

  3、从延迟加载中排除图像

  在此框中,您可以指定要手动排除延迟加载的图像列表。

  推荐:WordPress图片压缩插件JPEG、PNG和WebP图像压缩TinyPNG插件教程

  4、添加宽度和高度属性

  此设置将有助于大大减少由图像引起的布局偏移,从而提高您的CLS(累积布局偏移)分数。

  5、预加载关键图像

  FlyingPress会尝试自动检测初始渲染所需的关键图像(例如您的徽标、特色图像或首屏上的其他图像)。然后将这些图像设置为预加载以及从延迟加载中排除。预加载图像会告诉浏览器在图像甚至HTML发现之前就加载该图像,从而加快图像呈现时间。

  6、禁用表情符号

  无需加载WordPress用于“显示”表情符号的额外JavaScript文件,因浏览器仍会识别这些字符并显示内容。

  推荐:如何在WordPress中禁用LazyLoad图片懒惰加载

7、FlyingPress 插件iFrame设置
FlyingPress插件iFrame设置

  1、延迟加载iFrame

  本质上,iFrame允许您通过HTML文档将来自外部资源的内容嵌入到您的页面中。一些流行的示例包括在您的网站上嵌入YouTube视频、谷歌地图、Twitter帖子或Spotify播放列表。

  2、为YouTube iFrame使用占位符图像

  将网站上嵌入的YouTube视频替换为占位符图像。YouTube视频只会在用户点击您的视频时加载。对于嵌入了YouTube视频的页面或博客文章,将有助于大幅减少页面加载时间和初始页面加载的请求。

  推荐:什么iFrame?如何使用iFrame

  3、自托管YouTube占位符

  此设置与“为YouTube iFrame使用占位符图像”选项结合使用。启用该选项后,YouTube视频将替换为视频中的缩略图。缩略图将由FlyingPress下载和缓存。

  推荐:如何在WordPress中使用iFrame

8、FlyingPress 插件Bloat Settings设置

  2023.4.6日更新,FlyingPress 插件新增Bloat功能,允许您从网站中删除不必要的元素,从而提高其性能和速度。

  以下是 Bloat Remover 中可用优化的完整列表:

  • 删除谷歌字体(并使用系统字体)
  • 禁用 WooCommerce 购物车片段
  • 禁用 WooCommerce 资产
  • 禁用 XML-RPC
  • 禁用 RSS 提要
  • 禁用块编辑器 CSS
  • 禁用 oEmbeds
  • 禁用表情符号
  • 禁用 WP Cron
  • 禁用 jQuery 迁移
  • 禁用 Dashicons
  • 控制发布修订
  • 控制心跳
9、FlyingPress 插件CDN设置

  CDN是一个内容交付网络,是许多分布在世界各地的服务器,它们协同工作,为用户提供快速的内容交付,无论用户身在何处。

FlyingPress插件CDN设置

  如果有大量来自世界各地的流量,那么使用CDN是有意义的,CDN会将您网站的内容缓存在世界各地的服务器上,当有人访问您的网站时,它会从离该用户最近的CDN服务器中提取数据,将大大加快访问时间。

  推荐:什么是CDN?使用CDN的好处是什么

10、FlyingPress 插件数据库优化
FlyingPress插件数据库优化

  FlyingPress数据库部分允许您清理数据库,还可以选择安排自动清理,这将优化您的站点并减少数据库膨胀。

  • 发布修订——正式发布帖子或页面后,修订是保存的帖子或页面的旧版本
  • 发布自动草稿——当创建或编辑帖子或页面时,自动草稿会保存您的内容
  • 已删除的帖子——是已删除并放入垃圾箱的帖子。
  • 垃圾评论——评论被标记为垃圾邮件,由插件或手动标记。
  • 已删除评论——评论已被删除并放入垃圾箱。
  • ExpiredTransients——Transients是由插件创建的临时选项。它们可以安全移除。
  • 所有瞬态——瞬态是由插件创建的临时选项,可以安全删除。
  • 优化表——将优化数据库中的表,使它们高效运行而不会出现任何膨胀。
  • 自动清理——可以在此处选择FlyingPress清理和优化数据库的频率。建议选择“每周”优化

  推荐:如何使用phpMyadmin优化MySQL数据库

11、FlyingPress 插件许可证
FlyingPress插件许可证

  购买FlyingPress后,将收到一张购买收据,其中包含许可证密钥。

  如果FlyingPress没有自动激活您的许可证,您可以转到许可证部分并将您的许可证密钥粘贴到框中,然后单击“激活许可证”按钮。“启用Beta版本”框(选中时)能够提前访问FlyingPressBeta版本的新功能,建议这个选项禁用,。

FlyingPress插件教程推荐的配置设置

1、缓存

  • 缓存页面——除非正在诊断/开发,否则启用此功能。
  • Additional Auto Purge——默认选项“NONE”很好,除非您还需要清除其他页面。
  • 缓存寿命——大多数网站都应该将其设置为“Never从不”。否则,请使用与您的更新间隔相匹配的间隔。
  • 从缓存中排除页面——列出任何具有用户会话的动态信息的页面。例如购物车、帐户、结帐或不想缓存的页面。
  • 忽略查询字符串——有避免对查询字符串进行不必要的页面缓存。某些查询字符串会导致内容更改
  • 优化登录用户——缓存登录用户,建议不启用

2、CSS

  • 缩小和优化CSS文件——可以安全地启用
  • 生成关键和使用的CSS——如果想测试它是否让您的网站感觉更快,可测试。
  • 加载未使用的CSS——异步>用户交互>删除。如果有技巧建议从最激进的“REMOVE”开始,问题就退出。启用
  • 强制包含选择器——手动指定CCSS中缺少的CSS选择器的很棒的功能。
  • 延迟渲染HTML元素——使用它来延迟加载整个缓慢加载的页面部分,启用

3、JS

  • 缩小JavaScript——可以启用
  • 预加载链接——该功能会预加载链接。如果用户点击之前将鼠标悬停在许多链接上,可能会导致服务器使用率很高。
  • Defer Javascript——会以降低网站加载速度为代价来提高页面分数。
  • Defer Inline Javascript——如果它不影响您的可视页面加载,则很有用。
  • Exclude Scripts from Defer——对于希望延迟一些JS但不是大型网站非常有用,启用
  • 在用户交互时加载脚本——延迟加载外部脚本,启用

4、字体:

  • 优化谷歌字体——可尝试通过从您的主题加载字体,然后选择“继承”。

5、图片:

  • 延迟加载图像——延迟加载图像,会使网站看起来加载速度较慢,可排除首页部分图像。启用
  • 延迟加载方法——可启用BROWSERNATIVE,
  • 从延迟加载中排除折叠上方的图像——将其设置为您需要的任何内容。启用
  • 从延迟加载中排除图像——对于标题图像或任何其他显着影响网站视觉负载的图像很有用。
  • 添加响应式图像——可以使用FlyingCDN,也可以通过其他插件来执行此操作
  • 添加宽度和高度属性——如果您要延迟加载图像,则应启用
  • 预加载关键图像——启用
  • 禁用表情符号——可以启用,因为所有浏览器都已经原生显示表情符号。

6、框架:

  • 延迟加载iFrame——如果您的网站在页面顶部自动播放重要的YouTube视频,请不要使用。

  推荐:WordPress性能优化wp_head.php中删除不必要的代码

总结

  以上是晓得博客为你介绍FlyingPress插件教程WordPress轻量级速度优化插件的全部内容,希望这个FlyingPress插件设置的详细教程可以帮助加快速度较慢的WordPress网站,为你带来排名提升!

  推荐:(图文)WP Rocket插件配置教程WordPress缓存插件

  推荐:WordPress优化修复WordPress网站速度慢加载慢

  注意:如果您想购买使用FlyingPress插件,也可联系我们,本站已经购买FlyingPress插件Developer套餐,每年续费,价格美丽


滚动至顶部