{"id":6515,"date":"2022-04-01T17:52:19","date_gmt":"2022-04-01T17:52:19","guid":{"rendered":"https:\/\/www.directimpactsolutions.com\/aide-memoire-sur-les-applications-web-progressives\/"},"modified":"2025-05-01T05:08:50","modified_gmt":"2025-05-01T05:08:50","slug":"aide-memoire-sur-les-applications-web-progressives","status":"publish","type":"post","link":"https:\/\/www.directimpactsolutions.com\/fr\/aide-memoire-sur-les-applications-web-progressives\/","title":{"rendered":"Aide-m\u00e9moire sur les applications Web progressives"},"content":{"rendered":"<p>Les applications Web progressives (AWP) font l\u2019objet d\u2019un regain d\u2019int\u00e9r\u00eat. Voil\u00e0 pourquoi nous avons cherch\u00e9 \u00e0 r\u00e9pondre aux questions fr\u00e9quemment pos\u00e9es et cr\u00e9\u00e9 un aide-m\u00e9moire pour mieux les comprendre avec l\u2019aide de Matt Leering, d\u00e9veloppeur chez Direct Impact Solutions.<\/p><h2 class=\"wp-block-heading\">Table des mati\u00e8res<\/h2><ul class=\"wp-block-list\"><li><a href=\"#pwasunique\">Qu&rsquo;est-ce qui rend les PWA uniques ?<\/a><\/li>\n\n<li><a href=\"#nativevspwas\">Applications natives et PWA<\/a><\/li>\n\n<li><a href=\"#pwasvsweb\">PWAs vs. autres applications web<\/a><\/li>\n\n<li><a href=\"#spa\">Qu&rsquo;est-ce qu&rsquo;une application \u00e0 page unique (SPA) ?<\/a><\/li>\n\n<li><a href=\"#pwaflexibility\">PWA et flexibilit\u00e9<\/a><\/li>\n\n<li><a href=\"#pwasbudget\">Consid\u00e9rations budg\u00e9taires<\/a><\/li>\n\n<li><a href=\"#nonbudgetpwas\">Consid\u00e9rations non budg\u00e9taires<\/a><\/li>\n\n<li><a href=\"#technologiespwas\">Technologies utilis\u00e9es dans les PWA<\/a><\/li>\n\n<li><a href=\"#pwapossibilities\">Possibilit\u00e9s fonctionnelles<\/a><\/li><\/ul><h2 class=\"wp-block-heading\" id=\"pwasunique\">Tout d\u2019abord, qu\u2019est-ce qui rend les applications Web progressives si particuli\u00e8res? Plus pr\u00e9cis\u00e9ment, en quoi les applications Web progressives diff\u00e8rent-elles des applications natives (une application iPhone ou Android, par exemple) ? <\/h2><p>En bref, les AWP sont des <a href=\"https:\/\/www.directimpactsolutions.com\/fr\/applications-web\/\">applications Web<\/a> qui suivent certaines r\u00e8gles. Ces r\u00e8gles ont pour but d\u2019assurer que ces applications se comportent comme des applications natives. Une AWP doit utiliser des communications s\u00e9curis\u00e9es, peut \u00eatre utilis\u00e9e hors ligne et poss\u00e8de un fichier manifeste qui lui permet d\u2019\u00eatre \u00ab install\u00e9e \u00bb comme une application sur des appareils. Elle r\u00e9cup\u00e8re ses donn\u00e9es gr\u00e2ce \u00e0 des <a href=\"https:\/\/developers.google.com\/web\/ilt\/pwa\/introduction-to-service-worker\" target=\"_blank\" rel=\"noreferrer noopener\">service workers<\/a> afin d\u2019assurer le t\u00e9l\u00e9chargement le plus rapide possible des pages.  <\/p><figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"614\" src=\"https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-1024x614.png\" alt=\"Applications natives par rapport aux AWP\" class=\"wp-image-6504\" srcset=\"https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-1024x614.png 1024w, https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-300x180.png 300w, https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-768x461.png 768w, https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-1536x922.png 1536w, https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-1080x648.png 1080w, https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-1280x768.png 1280w, https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-980x588.png 980w, https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-480x288.png 480w, https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps.png 2000w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure><h3 class=\"wp-block-heading\" id=\"nativevspwas\"><strong>En ce qui concerne les utilisateurs finaux, quels sont les compromis possibles entre une application native et une application Web progressive ?<\/strong><\/h3><p>Du point de vue de ce qui distingue les applications natives des AWP, les principales diff\u00e9rences sont :<\/p><ul class=\"wp-block-list\"><li>Les AWP ne doivent pas n\u00e9cessairement \u00eatre t\u00e9l\u00e9charg\u00e9es ou install\u00e9es de la m\u00eame fa\u00e7on que les applications natives ;<\/li>\n\n<li>Les AWP sont ex\u00e9cut\u00e9es dans un navigateur plut\u00f4t que d\u2019\u00eatre prises en charge directement par le syst\u00e8me d\u2019exploitation h\u00f4te ;<\/li>\n\n<li>Les AWP ont acc\u00e8s \u00e0 un sous-ensemble \u2013 limit\u00e9, mais croissant \u2013 du mat\u00e9riel informatique du syst\u00e8me (system hardware).<\/li><\/ul><h3 class=\"wp-block-heading\" id=\"pwasvsweb\"><strong>Qu\u2019est-ce qui distingue les AWP des applications Web? Est-ce qu\u2019il y a des similitudes entre les AWP et les sites Web ? <\/strong><\/h3><p>Tout d\u2019abord, selon moi, un site Web est un ensemble de pages Web. Je ne pense pas que la fa\u00e7on dont il a \u00e9t\u00e9 cr\u00e9\u00e9 est importante. Si on retrouve un ensemble de pages Web \u00e0 un endroit pr\u00e9cis, je pense qu\u2019il s\u2019agit alors d\u2019un site Web.<\/p><p>Ensuite, il y a les applications Web qui, selon moi, sont des sites Web dynamiques dont les donn\u00e9es sont habituellement cod\u00e9es, et qui sont dot\u00e9s de fonctionnalit\u00e9s. En fait, une AWP est une application Web distincte qui suit des r\u00e8gles bien pr\u00e9cises.    <\/p><h3 class=\"wp-block-heading\" id=\"spa\"><strong>Qu\u2019est-ce qu\u2019une application Web monopage ?<\/strong><\/h3><p>Une application Web monopage (AWM) est un autre exemple courant d\u2019application Web. <\/p><p>Les applications Web monopage peuvent se comporter comme des applications natives, mais leur architecture est g\u00e9n\u00e9ralement diff\u00e9rente de celle des AWP. Elles ne doivent pas n\u00e9cessairement \u00eatre soumises aux m\u00eames r\u00e8gles strictes. La principale id\u00e9e qui sous-tend une AWM est que la majorit\u00e9 du contenu d\u2019une page Web est demand\u00e9e une fois, et que les demandes suivantes ne fournissent que les bribes n\u00e9cessaires.  <\/p><p>Si je peux me permettre une analogie :<\/p><p><em>Nous avons un commis responsable de la saisie de donn\u00e9es, appelons-le Steve. Il est tr\u00e8s bon dans ce qu\u2019il fait. En fait, il est tellement bon qu\u2019il a d\u00e9j\u00e0 termin\u00e9 toutes ses t\u00e2ches de la journ\u00e9e.  <\/em><\/p><p><em>Comme il a d\u00e9j\u00e0 tout fait, mais qu\u2019il est toujours en service, je lui ai confi\u00e9 d\u2019autres t\u00e2ches. D\u00e8s qu\u2019il a termin\u00e9 ce sur quoi il travaille, il se pr\u00e9sente \u00e0 mon bureau et prend une page. Il tape toutes les donn\u00e9es sur son clavier d\u2019ordinateur, puis il vient chercher une autre page, au besoin. Il l\u2019a fait \u00e0 plusieurs reprises d\u00e9j\u00e0.    <\/em><\/p><p><em>S\u2019il utilisait une application Web traditionnelle, il se pr\u00e9senterait \u00e0 tout moment \u00e0 mon bureau en plus de me demander comment s\u2019est pass\u00e9e ma soir\u00e9e, notamment. C\u2019est sans doute mon petit c\u00f4t\u00e9 introverti, mais je consid\u00e8re cela comme une perte de temps. S\u2019il faisait plut\u00f4t les choses avec une AWM et qu\u2019il se pr\u00e9sentait \u00e0 mon bureau pour me demander une page, il repartirait uniquement avec les donn\u00e9es dont il a besoin et reprendrait ses t\u00e2ches.  <\/em><\/p><h2 class=\"wp-block-heading\" id=\"pwaflexibility\">Les AWP sont reconnues pour leur flexibilit\u00e9. Pourquoi ? Avez-vous l\u2019impression qu\u2019elles sont plus flexibles que les autres applications ?<\/h2><p>Leur flexibilit\u00e9 repose sans doute sur le fait que les technologies utilis\u00e9es dans les AWP leur permettent de fonctionner essentiellement partout. Peu importe le type d\u2019appareil que vous utilisez, ou que vous disposiez ou non d\u2019une connexion Internet, vous devriez \u00eatre en mesure d\u2019utiliser une AWP.<\/p><p>Elles sont plus flexibles que les applications natives parce qu\u2019elles ne d\u00e9pendent pas d\u2019une plateforme en particulier. <\/p><h3 class=\"wp-block-heading\" id=\"pwasbudget\"><strong>Sur le plan budg\u00e9taire, y a-t-il des avantages \u00e0 d\u00e9velopper une AWP plut\u00f4t qu\u2019une application native ? Pourquoi ? <\/strong><\/h3><p>Lorsqu\u2019il est question de budget, le d\u00e9veloppement d\u2019une AWP plut\u00f4t que d\u2019une application native <em>peut certainement<\/em> pr\u00e9senter des avantages importants. Cela s\u2019explique principalement par le fait que vous n\u2019avez besoin que d\u2019un seul code de base pour que cette application fonctionne partout. Un m\u00eame ensemble de codes (r\u00e9dig\u00e9s correctement) peut \u00eatre d\u00e9ploy\u00e9 sur Android, iOS, Windows, OSX, Linux et d\u2019autres syst\u00e8mes.   <\/p><p>Si vous choisissez de d\u00e9velopper une application native, vous devrez normalement cr\u00e9er un code de base distinct pour chaque plateforme sur laquelle vous souhaitez la d\u00e9ployer, ce qui a une incidence sur les co\u00fbts de d\u00e9veloppement initial et d\u2019entretien. <\/p><h3 class=\"wp-block-heading\" id=\"nonbudgetpwas\"><strong>Si le budget d\u2019une entreprise soul\u00e8ve des inqui\u00e9tudes parce qu\u2019elle doit choisir entre le d\u00e9veloppement d\u2019une AWP et celui d\u2019une application native, quelle serait votre recommandation ? Certains facteurs influenceraient-ils votre recommandation ? Dans l\u2019affirmative, quels seraient-ils ?  <\/strong><\/h3><p>Si le budget ne cause pas un probl\u00e8me, je recommanderais de choisir une application Web progressive plut\u00f4t qu\u2019une application native dans la plupart des situations. Je ferais exception \u00e0 cette r\u00e8gle si je devais acc\u00e9der \u00e0 du mat\u00e9riel informatique pr\u00e9cis qui n\u2019est pas accessible au moyen de <a href=\"https:\/\/www.directimpactsolutions.com\/fr\/policies-dans-laravel\/\">technologies Web<\/a> (je parle ici d\u2019une liste de mat\u00e9riels qui ne cesse de diminuer). <\/p><h2 class=\"wp-block-heading\" id=\"technologiespwas\">Quelles sont les technologies utilis\u00e9es pour concevoir des AWP ? Croyez-vous que ces technologies demeureront pertinentes au cours des prochaines ann\u00e9es ?<\/h2><p>En g\u00e9n\u00e9ral, les technologies int\u00e9gr\u00e9es aux AWP comprennent un code JavaScript, un balisage HTML, <a href=\"https:\/\/www.directimpactsolutions.com\/fr\/laravel\/\">Laravel<\/a> et des feuilles de style en cascade (CSS). Cependant, les r\u00e8gles qui d\u00e9terminent quels sites Web sont des AWP ne pr\u00e9cisent pas quelles sont les technologies \u00e0 privil\u00e9gier.  <\/p><p>Une AWP doit r\u00e9cup\u00e9rer ses donn\u00e9es \u00e0 un endroit pr\u00e9cis, habituellement sur un serveur Web (NGINX, Apache, IIS ou autres), et ce serveur utilise g\u00e9n\u00e9ralement un code en arri\u00e8re-plan (PHP, Node.js ou autres). Le plus souvent, ce code permet de r\u00e9cup\u00e9rer les donn\u00e9es dans une base de donn\u00e9es (SQL, NoSQL ou autres).<\/p><p>Bon nombre de ces technologies sont rigoureuses et \u00e0 code source libre. \u00c9tant donn\u00e9 que les AWP sont habituellement cr\u00e9\u00e9es en tenant compte de la s\u00e9paration des pr\u00e9occupations (par exemple, en gardant la couche de donn\u00e9es s\u00e9par\u00e9e de la couche pr\u00e9sentation), les AWP constituent un placement relativement s\u00fbr, selon moi.<\/p><p>JavaScript peut poser probl\u00e8me, puisque de nouvelles versions de ce langage sont lanc\u00e9es de temps \u00e0 autre et automatiquement incluses dans les mises \u00e0 jour de votre navigateur. Cependant, JavaScript est devenu le langage le plus populaire \u00e0 l\u2019\u00e9chelle plan\u00e9taire et, pour cette raison, les ing\u00e9nieurs qui l\u2019ont cr\u00e9\u00e9 ont d\u00e9cid\u00e9 qu\u2019il serait toujours r\u00e9trocompatible.<\/p><h2 class=\"wp-block-heading\" id=\"pwapossibilities\"><strong>Pour une entreprise, quelles t\u00e2ches peuvent \u00eatre accomplies dans une AWP? Des \u00e9l\u00e9ments tels que le commerce \u00e9lectronique, les commandes en ligne et les fonctionnalit\u00e9s GPS peuvent-ils \u00eatre pris en charge ?<\/strong><\/h2><p>Essentiellement, tout ce qui peut \u00eatre fait sur le Web peut \u00eatre fait dans une AWP, ce qui inclut le commerce \u00e9lectronique, les commandes en ligne, les fonctionnalit\u00e9s d\u2019un GPS, et plus encore ! <\/p><h3 class=\"wp-block-heading\"><strong>Merci de nous accorder de votre temps !<\/strong><\/h3>","protected":false},"excerpt":{"rendered":"<p>Les applications Web progressives (AWP) font l\u2019objet d\u2019un regain d\u2019int\u00e9r\u00eat. Voil\u00e0 pourquoi nous avons cherch\u00e9 \u00e0 r\u00e9pondre aux questions fr\u00e9quemment pos\u00e9es et cr\u00e9\u00e9 un aide-m\u00e9moire pour mieux les comprendre avec l\u2019aide de Matt Leering, d\u00e9veloppeur chez Direct Impact Solutions.<\/p>\n","protected":false},"author":6,"featured_media":6462,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"","footnotes":""},"categories":[37],"tags":[361,362,288],"class_list":["post-6515","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web","tag-application-web-progressive","tag-awp","tag-web-apps-fr"],"uagb_featured_image_src":{"full":["https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps.jpg",1469,959,false],"thumbnail":["https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-150x150.jpg",150,150,true],"medium":["https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-300x196.jpg",300,196,true],"medium_large":["https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-768x501.jpg",768,501,true],"large":["https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-1024x668.jpg",1024,668,true],"1536x1536":["https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps.jpg",1469,959,false],"2048x2048":["https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps.jpg",1469,959,false],"woocommerce_thumbnail":["https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-300x300.jpg",300,300,true],"woocommerce_single":["https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps.jpg",600,392,false],"woocommerce_gallery_thumbnail":["https:\/\/www.directimpactsolutions.com\/wp-content\/uploads\/2022\/03\/progressive-web-apps-100x100.jpg",100,100,true]},"uagb_author_info":{"display_name":"Direct Impact Solutions","author_link":"https:\/\/www.directimpactsolutions.com\/fr\/author\/direct-impact-solutions\/"},"uagb_comment_info":0,"uagb_excerpt":"Les applications Web progressives (AWP) font l\u2019objet d\u2019un regain d\u2019int\u00e9r\u00eat. Voil\u00e0 pourquoi nous avons cherch\u00e9 \u00e0 r\u00e9pondre aux questions fr\u00e9quemment pos\u00e9es et cr\u00e9\u00e9 un aide-m\u00e9moire pour mieux les comprendre avec l\u2019aide de Matt Leering, d\u00e9veloppeur chez Direct Impact Solutions.","_links":{"self":[{"href":"https:\/\/www.directimpactsolutions.com\/fr\/wp-json\/wp\/v2\/posts\/6515","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.directimpactsolutions.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.directimpactsolutions.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.directimpactsolutions.com\/fr\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/www.directimpactsolutions.com\/fr\/wp-json\/wp\/v2\/comments?post=6515"}],"version-history":[{"count":7,"href":"https:\/\/www.directimpactsolutions.com\/fr\/wp-json\/wp\/v2\/posts\/6515\/revisions"}],"predecessor-version":[{"id":20104,"href":"https:\/\/www.directimpactsolutions.com\/fr\/wp-json\/wp\/v2\/posts\/6515\/revisions\/20104"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.directimpactsolutions.com\/fr\/wp-json\/wp\/v2\/media\/6462"}],"wp:attachment":[{"href":"https:\/\/www.directimpactsolutions.com\/fr\/wp-json\/wp\/v2\/media?parent=6515"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.directimpactsolutions.com\/fr\/wp-json\/wp\/v2\/categories?post=6515"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.directimpactsolutions.com\/fr\/wp-json\/wp\/v2\/tags?post=6515"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}