web-dev-qa-db-fra.com

Conversion du site Web WordPress en application Web progressive

Je crée une application Web progressive, mais il y a très peu de documentation et d'assistance en ligne jusqu'à présent. Je liste toutes mes questions dans cet e-mail.

  1. Quelle est la prise en charge actuelle de l'API Service Worker (mode hors ligne) pour les postes de travail? J'ai écrit une petite application qui fonctionnait en mode hors ligne pour mobile (Android-Chrome) mais pas pour mon bureau (Chrome 42). Nous devons configurer l'environnement de développement pour cela, nous devons donc savoir de quoi aurons-nous besoin pour tester nos applications. Cela ne fonctionne même pas sur IOS-Safari/Chrome.

  2. Le travail de service utilise largement les caches et il existe un très bon moyen de déboguer ou de supprimer les enregistrements internes des travailleurs de service sur Dekstop Chrome; mais si j'exécute mon application sur Mobile, comment supprimer le cache de l'agent de service?

  3. Si j'ai une application réactive (A WordPress) et que je dois la convertir en PWA; aurais-je besoin de réécrire l'application avec RestAPI pour la version mobile à nouveau? (Lire App Shell de PWA) Dans PWA, le shell d'application est séparé des données, cependant dans le CMS comme WordPress ne sont pas séparées de l'interface utilisateur.

Je cherche ces réponses depuis très longtemps et je ne trouve pas de support adéquat.

wordpressprogressive-web-apps
22
Usama Noman

Quelle est la prise en charge actuelle de l'API Service Worker (mode hors ligne) pour les postes de travail? J'ai écrit une petite application qui fonctionnait en mode hors ligne pour mobile (Android-Chrome) mais pas pour mon bureau (Chrome 42). Nous devons configurer l'environnement de développement pour cela, nous devons donc savoir de quoi aurons-nous besoin pour tester nos applications. Cela ne fonctionne même pas sur IOS-Safari/Chrome.

Safari ne prend pas en charge les employés de service pour le moment mais cela devrait fonctionner en Chrome 42 bien que vous devriez envisager de mettre à jour votre navigateur. Quoi qu'il en soit, vous pouvez vérifier l'état de l'art dans une variété d'endroits:

En savoir plus sur SW:

Le travail de service utilise largement les caches et il existe un très bon moyen de déboguer ou de supprimer les enregistrements internes des travailleurs de service sur Dekstop Chrome; mais si j'exécute mon application sur Mobile, comment supprimer le cache de l'agent de service?

Vous devez déboguer Chrome pour Android depuis Desktop Chrome .

Quoi qu'il en soit, l'URL chrome: // serviceworkers-internals est disponible sur Chrome pour Android bien qu'il n'y ait pas de moyen facile d'effacer les caches hors ligne).

Si j'ai une application réactive (A WordPress) et que je dois la convertir en PWA; aurais-je besoin de réécrire l'application avec RestAPI pour la version mobile à nouveau? (Lire App Shell de PWA) Dans PWA, le shell d'application est séparé des données, cependant dans le CMS comme WordPress ne sont pas séparées de l'interface utilisateur.

Non. En fait, WP a une très bonne architecture pour dissocier le contenu du thème. Le problème est celui qui s'exécute sur le serveur mais vous n'avez pas besoin que votre site fonctionne sur le client pour devenir un PWA. Mozilla prend en charge un suite de WP pour aider progressivisation de vos installations WordPress:

  • Shell hors ligne [ github ] identifie vos ressources Shell (c'est-à-dire les fichiers de thème) et les met en cache dans un cache hors ligne.
  • Contenu hors ligne [ github ] identifie votre contenu dynamique et le met en cache lorsque l'utilisateur le visite.
  • Web Push [ github ] vous permet d'envoyer des notifications en temps réel à vos lecteurs dès que vous publiez un nouveau contenu.
  • Ajouter à l'écran d'accueil [ github ] engage vos lecteurs en mettant votre WordPress dans l'écran d'accueil.

Ce sont tous de très jeunes plugins mais vous pouvez les suivre sur GitHub et contribuer si vous le souhaitez!

35
Salva

Une réponse très agréable et utile est déjà ajoutée par @Salva, mais j'ai pensé me laisser ajouter quelques choses qui pourraient être utiles.

Pour la 3ème partie, j'ai travaillé sur une plateforme de conversion d'application web progressive automatique, https://www.escalatingweb.com . Je pense que vous pouvez utiliser cette plate-forme pour convertir votre application Web sur WordPress en application Web progressive. Vous pouvez l'utiliser pour convertir votre application Web en pwa en quelques minutes. J'ai également écrit un très joli tutoriel pour utiliser la plate-forme de conversion automatique pwa http://www.techromance.com/2017/07/22/automatic-pwa-converter-platform/ .

Pour la 2e partie, juste pour ajouter à la réponse ci-dessus, et à des fins de test, vous pouvez supprimer tout le cache pour un site Web particulier des paramètres du site, ce qui effacera également le cache de l'agent de service.

Pour la 1ère partie, rien à ajouter en tant que tel.

P.S. S'il vous plaît, personne ne sera offensé s'ils le trouvent comme un moyen bon marché de promouvoir ma plate-forme. L'intention est simplement d'aider la communauté, soit en construisant la plate-forme, soit en la sensibilisant au public qui en a besoin. Merci @McNab pour la suggestion. :)

2
Satys

J'utilise également un Wordpress et il y a un plugin peut résoudre votre problème. Au lieu d'installer beaucoup de plugin de Mozilla, vous pouvez installer le plugin Super Progressive Web Apps (recherchez-le dans l'installation du plugin), il fonctionne parfaitement. Essayé à la fois sur Android téléphone et IOS https://wordpress.org/plugins/super-progressive-web-apps) /

1
Nguyễn Ngọc Anh