Konvertieren einer WordPress-Website in eine Progressive Web App

Ich baue eine Progressive Web App, aber bisher gibt es nur sehr wenig Dokumentation und Unterstützung online. Ich liste alle meine Fragen in dieser E-Mail auf.

1. Was ist die aktuelle Unterstützung der Service Worker API (Offline-Modus) für Desktops? Ich habe eine kleine App geschrieben, die im Offline-Modus für Mobilgeräte (Android-Chrome) funktioniert, aber nicht für meinen Desktop (Chrome 42). Wir müssen die Entwicklungsumgebung dafür konfigurieren, also müssen wir wissen, was wir brauchen, um unsere Apps zu testen. Es funktioniert nicht einmal auf IOS-Safari/Chrome.

2. Die Servicearbeit verwendet Caches ausgiebig und es gibt eine sehr gute Möglichkeit, Interna von nicht registrierten Servicemitarbeitern auf Dekstop Chrome zu debuggen; aber wenn ich meine Anwendung auf Mobilgeräten ausführe, wie entferne ich den Service-Worker-Cache?

3. Wenn ich eine reaktionsschnelle Anwendung (eine WordPress-Site) habe und sie in PWA konvertieren muss; müsste ich die Anwendung mit RestAPI für die mobile Version noch einmal neu schreiben? (Lesen Sie App Shell von PWA). In PWA ist die Anwendungs-Shell von den Daten getrennt, in CMS wie WordPress sind die Daten jedoch nicht von der Benutzeroberfläche getrennt.

Ich habe sehr lange nach diesen Antworten gesucht und konnte keine angemessene Unterstützung finden.

Was ist die aktuelle Unterstützung der Service Worker API (Offline-Modus) für Desktops? Ich habe eine kleine App geschrieben, die im Offline-Modus für Mobilgeräte (Android-Chrome) funktioniert, aber nicht für meinen Desktop (Chrome 42). Wir müssen die Entwicklungsumgebung dafür konfigurieren, also müssen wir wissen, was wir brauchen, um unsere Apps zu testen. Es funktioniert nicht einmal auf IOS-Safari/Chrome.

Safari unterstützt derzeit aber keine Servicemitarbeiter Es sollte in Chrome 42 funktionieren obwohl Sie erwägen sollten, Ihren Browser zu aktualisieren. Jedenfalls können Sie sich an verschiedenen Stellen über den Stand der Technik informieren:

• Servicemitarbeiter: https://platform-status.mozilla.org/#service-worker
• Push-API: https://platform-status.mozilla.org/#push
• Hintergrundsynchronisierung: https://platform-status.mozilla.org/#background-sync

Mehr zu SW:

• Ist der Servicemitarbeiter bereit? https://jakearchibald.github.io/isserviceworkerready/
• Kann ich benutzen? http://caniuse.com/#feat=Serviceworkers

Die Servicearbeit verwendet Caches ausgiebig und es gibt eine sehr gute Möglichkeit, Interna von nicht registrierten Servicemitarbeitern auf Dekstop Chrome zu debuggen; aber wenn ich meine Anwendung auf Mobilgeräten ausführe, wie entferne ich den Service-Worker-Cache?

Du musst Debuggen Sie Chrome für Android von Desktop Chrome.

Wie auch immer, die URL chrome://serviceworkers-internals ist in Chrome für Android verfügbar, obwohl es keine einfache Möglichkeit gibt, Offline-Caches zu löschen.

Wenn ich eine reaktionsschnelle Anwendung (eine WordPress-Site) habe und sie in PWA konvertieren muss; müsste ich die Anwendung mit RestAPI für die mobile Version noch einmal neu schreiben? (Lesen Sie App Shell von PWA). In PWA ist die Anwendungs-Shell von den Daten getrennt, in CMS wie WordPress sind die Daten jedoch nicht von der Benutzeroberfläche getrennt.

Nein. Tatsächlich hat WP eine sehr gute Architektur, um Inhalte vom Thema zu entkoppeln. Das Problem wird auf dem Server ausgeführt, aber Sie müssen Ihre Website nicht auf dem Client ausführen, um eine PWA zu werden. Mozilla unterstützt a Suite von WP-Plugins helfen fortschreitend Ihre WordPress-Installationen:

• Offline-Shell [github] identifiziert Ihre Shell-Assets (dh Designdateien) und speichert sie in einem Offline-Cache.
• Offline-Inhalt [github] identifiziert Ihren dynamischen Inhalt und speichert ihn, wenn der Benutzer ihn besucht.
• Web-Push [github] ermöglicht es Ihnen, Echtzeit-Benachrichtigungen an Ihre Leser zu senden, sobald Sie neue Inhalte veröffentlichen.
• Zum Startbildschirm hinzufügen [github] bindet Ihre Leser ein, indem Sie Ihr WordPress auf dem Startbildschirm platzieren.

Sie sind alle sehr junge Plugins, aber Sie können sie auf GitHub verfolgen und beitragen, wenn Sie möchten!

Eine sehr nette und hilfreiche Antwort wurde bereits von @Salva hinzugefügt, aber ich dachte, lassen Sie mich einige Dinge hinzufügen, die hilfreich sein könnten.

Für den dritten Teil habe ich an einer automatischen progressiven Web-App-Konverter-Plattform gearbeitet, https://www.escalatingweb.com. Ich denke, Sie können diese Plattform verwenden, um Ihre Web-App auf WordPress in eine progressive Web-App umzuwandeln. Sie können es verwenden, um Ihre Web-App innerhalb von Minuten in PWA umzuwandeln. Ich habe auch ein sehr schönes Tutorial zur Verwendung der automatischen PWA-Konverterplattform geschrieben http://www.techromance.com/2017/07/22/automatic-pwa-converter-platform/.

Für den zweiten Teil, nur um die obige Antwort zu ergänzen, und zu Testzwecken können Sie den gesamten Cache für eine bestimmte Website aus den Site-Einstellungen löschen, wodurch auch der Cache des Servicemitarbeiters gelöscht wird.

Zum 1. Teil ist als solches nichts hinzuzufügen.

PS: Bitte sei niemand beleidigt, falls er es als billigen Weg empfindet, für meine Plattform zu werben. Die Absicht ist nur, der Community zu helfen, entweder durch den Aufbau der Plattform oder durch die Sensibilisierung des nötigen Publikums. Danke @McNab für den Vorschlag. 🙂

Ich benutze auch eine WordPress-Site und es gibt ein Plugin, das Ihr Problem lösen kann. Anstatt viele Mozilla-Plugins zu installieren, können Sie das Super Progressive Web Apps-Plugin installieren (suchen Sie danach in der Plugin-Installation), es funktioniert perfekt. Sowohl auf Android-Handy als auch auf iOS versucht
https://wordpress.org/plugins/super-progressive-web-apps/