UVdesk Progressif avec l’Web App

Ce qui est Progressiste, Web App / PWA?

Progressive web app ou PWA est une façon dont nous fournissons des caractéristiques différentes comme push notification, à l’arrière-plan de la synchronisation, de la maison le bouton à l’écran pour nos utilisateurs pour une meilleure expérience web ou peut dire App-comme l’expérience avec le web. Progressif de l’Application Web est rapide comme l’éclair par rapport à la normale du site web de notre application.

 

Pourquoi devons-nous l’utiliser?

À ce moment de Web + Mobile ère où les utilisateurs sont pour la plupart dépendants de leurs appareils, et même sur le Mobile (80% des utilisateurs d’internet un smartphone) très bien, nous ne pouvons pas ignorer tout type de plates-formes. Si nous voulons perdre le focus sur n’importe quelle plateforme alors sûrement que nous allons perdre contre nos concurrents. Peu importe ce qu’il peut y avoir diverses autres choses qui peuvent être la raison de moins de trafic sur notre site web. Comme si notre site a css, js fichiers, trop d’images, différentes familles de polices de caractères (dont nous ne voulons pas le besoin, mais nous devons ajouter) ou les utilisateurs ont une faible connexion internet (c’est pas de leur faute, parce que dans le dernier Boss et les Clients sont toujours à droite 😉 ) etc. Quelle que soit la raison, il va nous hanter en termes de recettes. En tant qu’utilisateur d’un site web en termes de ces cas, alors je sais que ce sera mon point de vue –

tant Que Client d’un point de vue

Clients/ Utilisateurs sont les âmes de tout site web si ils ne sont pas là, nous sommes déjà morts ou si non, alors nous serons bientôt. 53% des utilisateurs abandonnent un site s’il prend plus de 3 secondes à charger! Et une fois chargé, ils s’attendent à être rapide, pas de janky de défilement ou la lenteur de la réponse des interfaces. on peut Donc penser, à quel point les attentes de clients augmente avec nos concurrents. C’est très simple, les clients veulent une réponse rapide à d’autres choses plus tard, comme si nous nous donnons Iphone7 pour 1$, mais si la page ne s’ouvre pas, personne ne va la/en mesure de l’acheter. Si nous ne sommes pas remplir tous les espaces vides à cette heure de la technologie de l’ère puis on ne peut pas gagner 121bn yuans (18 milliards de dollars) en une seule journée.

en tant Que Développeur/ Propriétaire de point de vue.

En tant que développeur, quel est le problème principal, nous avons été confrontés? Selon moi, c’est la VITESSE de notre site web, à quelle vitesse nous servir les demandes des clients? Si la réponse web est rapide (je parle surtout devant des données comme le html/css ou de données statiques) alors évidemment, le client va rester plus longtemps sinon ils vont pour surfer sur un autre site en quelques minutes, c’est comme le tabagisme, nous ne savons pas combien dangereux, c’est maintenant, mais dans la dernière, nous sommes morts? notre site internet.

Si le développeur veut un moyen d’accélérer les choses et il ya beaucoup d’options pour faire comme la mise en cache notre contenu statique dans le cache du navigateur à l’aide de la définition des paramètres dans l’en-tête du script de serveur ou de l’utiliser d’une autre manière mais vraiment, est-il la meilleure solution? Si, nous voulons mettre à jour quelque chose juste après la précédente mise à jour? Avons-nous vraiment besoin de stocker tous types de données dans le cache, comme je l’ai normalement utilisé MySql pour la base de données alors, évidemment, je préfère une sorte de base de données, si le navigateur fournit tout? et puis-je stocker facilement?

Donc, si je vous ai dit que nous ne pouvons résoudre ces choses avec PWA alors comment est-il :). Avant que nous allons vérifier, qu’est ce qu’il fait ou ce qui est derrière lui?

 

Quel est-il?

Comme je l’ai écrit PWA est un moyen d’obtenir une application mobile comme le web, l’expérience, mais ce qui est derrière ce grand concept. C’est Travailleur (avec silencieux bonheur 🙂 ). En fait, en tant que développeur de ce problème, j’ai fait face, pour la plupart, j’étais incapable de hack demande si n’importe quel navigateur a été de l’envoyer au serveur ou manquait le seul point pour elle 😐 voici le travail de Service. Travailleur des services est une sorte de serveur proxy entre le serveur et le navigateur de l’utilisateur. Tout se passe, si quelqu’un demande et nous manipuler ces demandes et de leur réponse.

Donc, ouvrier de Service nous donne une façon de faire ces choses avec quelques lignes de code javascript. Syntaxe de base est comme ça

Que peut-on faire avec elle (travailleur)?

Avec l’aide de Travailleur des Services, nous pouvons faire à peu près tout ce dont nous n’avons pas pu le faire auparavant. Avec l’aide de travailleur des services, nous pouvons complètement fonctionner sur navigateur comme la mise en cache de notre contenu, du stockage des données dans IndexedDB et d’autres de l’opération.

Nous pouvons fournir un manifeste à l’utilisateur pour l’application comme une expérience. Dans cette image, nous pouvons voir UVdesk sur l’icône de mobile home page

Avec l’aide de cela, nous pouvons complètement parcourir UVdesk comme nous voyons, dans l’application.

page d’Accueil

Billet d’affichage de la liste

De Plus, nous pouvons envoyer des notifications Push pour nos utilisateurs, peut servir réponses si l’utilisateur du réseau ne fonctionne pas correctement (en utilisant la mise en cache ou l’autre, nous avons ajouté plus tôt).

Sans Internet, mais n’a pas de cache encore de données

Sans Internet, mais de servir de données de Travailleur des Services

Nous pouvons fournir une notification à l’utilisateur de mettre à jour si nous avons mis à jour du contenu est mis en cache dans le navigateur de l’utilisateur.

 

Quelle est la prochaine étape?

Oui, bien sûr, il y a toujours quelque chose à côté, rien n’est terminé. En suivant, nous allons voir, en fait, la façon dont nous construisons ce pour UVdesk et quels sont les problèmes rencontrés? Je vous remercie pour votre temps.

Si vous avez quelconque question, n’hésitez pas à nous contacter ici support@uvdesk.com

 

existe-il des exemples?

Bien sûr, sans exemple, comment allons-nous apprendre? Ce sont quelques-uns des liens que j’ai utilisé dans l’apprentissage et au moment de la rédaction.

Google Blog

Booking.com

MDN

and great one Jake Archibald