联系我们
简单又实用的WordPress网站制作教学
当前位置:网站首页 > WordPress插件 > 正文

In-Viewer缓存最好的WordPress通用插件下载 博客插件模块

作者:98wpeu发布时间:2025-09-23分类:WordPress插件浏览:4


导读:浏览器内缓存安装浏览器内缓存通过ServiceWorkerAPI利用现代浏览器功能,为静态资产实施浏览器内缓存,提高网站性能,同时提供透明的指标。与传统的服务器端缓存插件不同,...
浏览器内缓存安装

浏览器内缓存通过Service Worker API利用现代浏览器功能,为静态资产实施浏览器内缓存,提高网站性能,同时提供透明的指标。

与传统的服务器端缓存插件不同,浏览器内缓存完全在客户端运行,从而减少网络请求并改善重复访问的页面加载时间。

关键特征浏览器内缓存:让服务人员直接在浏览器中缓存静态资产被动CDO识别:自动检测和优化主要CDO提供商(Cloudflare、BunnyCDO、Fastly、Amazon CloudFront等)的缓存活跃的CDO:主动监控CDO运行状况并在检测到CDO问题时实施后备策略智能缓存策略:针对不同内容类型的不同策略:静态资产(JS、CSS、图像、字体)缓存优先网络优先用于HTML内容仅用于API/动态路由智能CDO检测:使用域模式、HTTP标头和启发式来识别无需配置的CDO资产积极主动的CDO管理:主动监控CDO健康状况并在检测到CDO问题时实施后备策略简单配置:具有合理默认值的一键启用/禁用切换增强的收件箱:分别跟踪CDO和原始资产的缓存性能视觉仪表板:通过清晰的图表和统计数据(包括CDO性能)查看缓存的影响零配置:开箱即用,具有合理的默认值-CDO检测是自动的绩效保障:自动缓存管理,对页面加载的影响最小没有外部依赖:一切都在您的WordPress网站上运行,无需外部服务GDPR合规:为登录用户自动禁用服务工作人员以确保隐私工作原理

浏览器内缓存使用Service Worker API来拦截网络请求并应用不同的缓存策略:

服务人员登记:当用户访问您的网站时,服务人员会在其浏览器中注册请求拦截:服务人员拦截资产请求被动CDO检测:使用域模式(Cloudflare、BunnyCDO、Fastly、CloudFront域)、HTTP标头(CF-ray、bunnyCDn-ache-Status、x-served-by、x-amz-sf-id)和启发式(包含-cdn-、-静态-、-assets-的域)自动识别CDO资产主动CDO监控:主动监控CDO运行状况并在检测到CDO问题时实施后备策略缓存策略应用:根据内容类型和来源应用不同的策略(CDO与本地)度量收集:分别跟踪CDO和源资产的缓存命中、未命中和带宽节省数据同步:收件箱定期发送到您的WordPress网站仪表板可视化:数据经过处理并显示在管理仪表板中,并包含CDO与来源细分优势更快的页面加载:缓存资产在重复访问时立即加载减少带宽使用:既适合您的服务器,也适合您的访客改进的用户体验:更快的页面加载带来更好的用户体验透明收件箱:确切了解缓存如何使您的网站受益服务器端缓存的补充:与其他缓存解决方案配合使用增强的CDO可靠性:被动检测和主动监控都确保最佳的CDO性能开发人员信息源代码

该插件附带完整的源代码,以实现透明度和开发人员定制:

JavaScript源:位于/src/目录src/admin.js- 设置页面功能src/dashboard.js- 与Chart.js集成的Inbox仪表板src/service-worker.js- 集成Workbox的主要服务人员构建系统:使用esbuilt进行JavaScript编译和缩小Build Process

如果需要修改JavaScript源代码,可以重新构建资产:

先决条件:
* Node.js 20.x或更高版本
* npm

构建命令:

安装依赖项

npm install

清理并建造所有资产

npm run build

构建单个组件

npm run build:admin      # Settings pagenpm run build:dashboard  # Metrics dashboard  npm run build:sw         # Service worker

干净的构建目录

npm run clean

构建的文件输出到/build/目录并由插件自动使用。

安装将插件文件上传到/wp-content/plugins/in-browser-cache目录,或者直接通过WordPress插件屏幕安装插件。通过WordPress中的-Plugins-屏幕激活插件使用浏览器内缓存设置屏幕启用和配置插件(可选)访问浏览器内缓存仪表板查看缓存指标常见问题解答这与其他缓存插件有何不同?

大多数WordPress缓存插件都专注于服务器端缓存,这会减少服务器负载,但在内容传递到浏览器后却无济于事。浏览器内缓存完全在客户端运行,利用现代浏览器功能将资产直接缓存在用户浏览器中,从而减少网络请求并改善重复访问的页面加载时间。

这适用于其他缓存插件吗?

是的!浏览器内缓存补充了服务器端缓存插件。您可以将两者一起使用,以获得最大的性能优势。

这适用于所有浏览器吗?

该插件需要支持Service Workers的浏览器。这包括所有现代浏览器(Chrome、Firefox、Safari、Edge),但不包括Internet Explorer等旧浏览器。在不受支持的浏览器上,该插件会优雅地降级-您的网站将正常运行,只是没有缓存好处。

这需要HTTPS吗?

是的,服务人员仅在安全来源(HTTPS)上工作。这是浏览器强加的安全要求,而不是插件的限制。

如果WordPress安装在收件箱中,这是否有效?

不,此插件需要将WordPress安装在您的域的根目录(例如,https://example.com/)并且如果WordPress安装在收件箱中,则无法正常工作(例如,https://example.com/blog/).

存在此限制是因为服务人员有范围限制-他们只能控制自己的目录和子目录中的页面。由于服务工作者是从根路径(/service-worker.js),当WordPress处于根级别时,它只能缓存整个域的资源。

如果您的WordPress安装在收件箱中,则该插件将看起来已成功安装,但缓存将无法正常工作。

这会减慢我的网站速度吗?

不,该插件的设计考虑了性能。服务工作者注册是同步的,并且不会阻止页面呈现。缓存本身通过减少后续页面加载时的网络请求来提高性能。

如何清除缓存?

您可以通过单击-清除缓存-按钮从插件设置页面中清除缓存。这会向服务工作者发送消息以删除所有缓存的资产。

我可以从缓存中排除某些文件吗?

目前,该插件使用基于文件类型和URL模式的预定义规则。自定义排除规则将在未来的更新中添加。

指标有多准确?

这些指标直接从浏览器收集,代表实际的缓存命中、未命中和带宽节省。然而,它们依赖于浏览器报告准确的内容长度标头,而这些标头可能并不总是可用。

为什么对登录用户禁用缓存?

默认情况下,该插件会禁用登录用户的缓存,以确保GDPR合规性并保护用户隐私。当用户经过身份验证时,未经明确同意,他们的浏览模式和个人数据不应存储在浏览器缓存中。您可以在插件设置中禁用此功能,但为了隐私合规,建议保持启用该功能。

用户登录时会发生什么?

当用户登录时,服务工作者将自动注销,并且所有缓存的数据将被清除。这确保来自未经验证的会话的数据不会保留到经过验证的会话中。当用户注销时,服务人员将重新注册。

CDO检测如何工作?

该插件通过两种补充方法提供全面的CDO支持:1)被动CDO识别- 使用Cloudflare、jsDelivr、unpkg等流行CDO的域模式、sf-ray、x-served-by和服务器标头等HTTP响应标头,以及包含-cdn-、-静态-或-assets-等关键字的域的启发式分析,自动检测CDO资产。2)活跃的CDO- 主动监控CDO健康状况并实施后备机制以增强可靠性。无需配置-检测和监控都会自动工作。

支持哪些CDO提供商?

该插件为四大CDO提供商提供全面支持:Cloudflare,BunnyCDO,Fastly,而且Amazon CloudFront.为了最大的准确性,这些都通过域模式和HTTP标头进行检测。此外,该插件还识别jsDelivr、unpkg、Google Fonts、Bootstrap CDO等。它还使用智能启发法根据域模式检测未知的CDO。该插件将被动检测与主动监视相结合,可与任何CDO一起工作,同时提供增强的可靠性和回退功能。

我可以查看CDO与原始资产的单独指标吗?

是的!仪表板显示了CDO和源资产的单独统计数据,包括缓存命中率、未命中率和性能指标。这可以帮助您了解您的CDO使用对您的网站性能改进有多大贡献。

CDO缓存是否适用于任何CDO提供商?

是的,被动CDO检测和主动CDO支持均可与任何CDO提供商配合使用。虽然该插件对流行的CDO有特定的识别,但它使用智能启发法来检测和缓存任何CDO中的资产,无论您选择什么样的CDO,都确保最佳性能。该插件提供自动检测和主动监控,以增强可靠性。

我在我的Nginx服务器上收到/service-worker. js的404错误

如果您正在使用Nginx并在尝试访问时出现404错误/service-worker.js,您需要添加自定义Nginx规则来专门处理该文件。将以下内容添加到Nginx服务器配置中:

location = /service-worker.js {    try_files $uri /index.php$is_args$args;}

此规则确保请求/service-worker.js正确传递给WordPress进行处理,而不是作为静态文件处理。添加此规则后,请确保重新加载Nginx配置。

该插件没有评论。

标签:hellip工人网站性能客户端


WordPress插件排行
最近发表
网站分类
标签列表