将WordPress网站转换为Progressive Web App

Question

我正在构建一个渐进式Web应用程序，但目前为止只有很少的文档和支持。我在这封电子邮件中列出了所有的问题。

1. 对于 台式机，当前对Service Worker API（脱机模式）的支持是什么？我编写了一个小应用，该应用在离线模式下为 移动版（Android-Chrome）工作，但不适用于我的桌面版（Chrome 42）。我们需要 为此配置开发环境，因此我们需要知道 我们需要测试我们的应用程序。它甚至不适用于IOS-Safari/Chrome 。

2. 该服务工作广泛使用高速缓存，并有一个非常好的 方式来调试或未注册的服务工作者内部Dekstop 铬;但如果我在移动设备上运行我的应用程序，我将如何删除 服务人员缓存？

3. 如果我有一个响应式应用程序（一个WordPress网站），并需要 将其转换为PWA;我需要重写与 RestAPI移动版本的应用程序吗？ （阅读PWA的App Shell）。在 PWA中，应用程序外壳与数据是分开的，但是在CMS中，如 WordPress数据不与UI分开。

我一直在寻找这些答案很长时间，无法找到任何适当的支持。

Answer 1

目前对台式机Service Service API（脱机模式）的支持是什么？我编写了一款适用于移动设备（Android-Chrome）的离线模式的小应用，但不适用于我的桌面（Chrome 42）。我们需要为此配置开发环境，因此我们需要知道我们需要测试我们的应用程序。它甚至不适用于IOS-Safari/Chrome。

Safari目前不支持服务人员，但it should work in Chrome 42尽管您应该考虑更新您的浏览器。无论如何，你可以检查技术状态在不同的地方：

• 服务人员：https://platform-status.mozilla.org/#service-worker
• 推式API：https://platform-status.mozilla.org/#push
• 后台同步：https://platform-status.mozilla.org/#background-sync

更多关于SW：

• 服务人员是否准备好了？ https://jakearchibald.github.io/isserviceworkerready/
• 我可以使用吗？ http://caniuse.com/#feat=serviceworkers

服务工作使用缓存广泛且有调试或Dekstop铬未注册服务人员内部一个很好的方法;但如果我在Mobile上运行我的应用程序，我将如何删除服务工作者缓存？

您需要debug Chrome for Android from Desktop Chrome。

无论如何，网址chrome：// serviceworkers-internals在Android版Chrome上可用，尽管没有简单的方法来清除离线缓存。

如果我有一个响应式应用程序（一个WordPress站点），并需要将其转换为PWA;我是否需要再次使用RestAPI for mobile版本重写应用程序？ （阅读PWA的App Shell）。在PWA中，应用程序外壳与数据是分开的，但是在CMS中，WordPress数据并不与用户界面分开。

不。实际上，WP具有非常好的架构来将内容与主题分离。 问题是在服务器上运行，但不需要在客户端上运行的站点成为PWA。 Mozilla基金会支持suite of WP plugins帮助progressivizing你的WordPress安装：

• Offline Shell [github]识别你的shell资产（即主题文件），并在脱机缓存缓存。
• Offline Content [github]标识您的动态内容并在用户访问时缓存它。
• Web Push [github]允许您在发布新内容时立即向您的读者推送实时通知。
• Add To Home Screen [github]通过将您的WordPress插入主屏幕来吸引读者。

他们都是非常年轻的插件，但你可以跟踪他们在GitHub上，如果你想要贡献！

Answer 2

@Salva已经添加了一个非常好的和有用的答案，但我想让我添加一些可能有用的东西。

对于第三部分，我已经开发了一个自动渐进式Web应用转换器平台https://www.escalatingweb.com。我认为你可以使用这个平台将WordPress上的网页应用程序转换为渐进网页应用程序。您可以使用它在几分钟内将您的Web应用程序转换为Pwa。 我还写了一个非常不错的教程，使用自动pwa转换器平台http://www.techromance.com/2017/07/22/automatic-pwa-converter-platform/。

对于第二部分， 只需添加到上面的答案，并为了测试目的，您可以从站点设置中删除特定网站的所有缓存，这也将清除服务人员的缓存。

对于第一部分，没有任何补充。

P.S.如果他们觉得这是促进我的平台的廉价方式，请不要冒犯任何人。其目的只是为了帮助社区，或者通过构建平台或让其了解有需要的观众。 谢谢@McNab的建议。 :)