Magento wordt een progressive web applicatie platform. Althans ze komen met een set aan tools om je Magento installatie in te zetten als progressive web applicatie. Wat is nou zo’n progressive web application afgekort P.W.A.? De term P.W.A. werd als eerst door Google geïntroduceerd. Ze hebben er echter geen intellectuele eigendomsrechten op. Lees ook ons artikel over de 6 mobiele trends die commerce gaan veranderen.
P.W.A. is software, die in tegenstelling tot de “single page javascript apps” die je wellicht kent, veel sneller en schaalbaarder is. Het gedraagt zich niet als een app, het heeft eerder de feeling van een app. Ja, het wordt ingeladen vanuit de cloud / vanaf een server. Het mooie van P.W.A. is daarnaast voornamelijk dat het de mogelijkheden biedt om het ook offline te kunnen gebruiken dankzij ‘Service Workers’ in combinatie met de ‘web cache API’. Let wel op, die geeft gebruikers wel minder mogelijkheden dan online.
Ben je benieuwd of Magento Commerce vanuit de cloud het beste past bij jou wensen? Download dan onze whitepaper met de 40 redenen waarom ook jij zou moeten willen kiezen om te migreren naar Magento Commerce Cloud.
Normale content zal gewoon gecached op een apparaat beschikbaar zijn. Het is een applicatie omdat het ook echt code installeert en draait vanaf het device van de gebruiker. Het is web omdat het is gebaseerd op de door een browser leesbare code HTML, CSS en Javascript, in tegenstelling tot de device specifieke code waarin moet worden geprogrammeerd voor de diverse mobiele platformen als IOS en Android. Tot slot is het progressive omdat het zich zogezegd “lazy-load” op het moment dat de gebruiker door de site navigeert. Dit samen zorgt ervoor dat je het makkelijk kunt laten programmeren door het Magento bureau en je wel de gemakken kunt gebruiken die meekomen met een native app. Denk hierbij aan snelheid, usability, device integratie en offline bruikbaarheid.
In tegenstelling tot de berichten dat P.W.A. een stille dood zou zijn gestorven, zijn ze er bij Magento van overtuigt dat dit de toekomst is. Dat op een dag het geen P.W.A. meer heet maar de standaard zal zijn en de maatstaf voor een goed bruikbare mobiele beleving als responsive design en compressie van afbeeldingen. Mede hierdoor zijn ze op dat vlak de samenwerking met Google aangegaan.
Wat is dan het grote verschil tussen een P.W.A. en een redelijk snelle site?
- Het minimaliseert mobiele data gebruik. Het werkt dus ook bij slechter bereik;
- De eerste pageload serveert een klein shell document die zorgt voor een eerste weergave;
- Alles wordt geladen via https en via zware cache;
- Installeert een ServiceWorker die slimme caching uitvoert op vervolg requests;
- Geen postback of page refresh, de JS app route bij de cliënt en communiceert via API calls;
- De code in de app laadt nieuwe functionaliteit progressief naar wens, net als data;
- Het maakt gebruik van “non blocking” techniek zodat het tijdens gebruik aanvoelt als als een native app;
- Op de ondersteunde OS-en (Android, Windows phone en later meer) kun je de P.W.A. ook laten zien tussen je overige apps en laden als een app, dus niet in een standaard browser.
Magento P.W.A. kondigt aan dat er veel nieuwe tools zullen worden gelanceerd, dat ze begrijpen dat het voor frontend developers een steile leercurve met zich mee zal brengen en daarom erg benieuwd zijn naar het zelf lerende aspect en de feedback die ze zullen gaan ontvangen. Ze geven aan dat veel keuzes en tools worden gelanceerd rondom het development proces en hier juist mensen uit de community bij willen betrekken.
Headless met Magento
Omdat Magento is gebouwd op het idee dat je met 1 platform alle e-commerce activiteiten kunt beheren zal de P.W.A. suite ook met Magento moeten blijven samenwerken en werken op basis van headless commerce technologie. Vanaf het moment dat het is ingeladen en draait op het device van de eindgebruiker, zal het alleen nog communiceren via de API’s van Magento 2
React Apps
Magento PWA heeft ervoor gekozen om de React architectuur te adopteren voor de P.W.A. tools Suite. Zeker omdat er vanuit de community veel geluiden kwamen voor een betere front-end suite. React heeft namelijk, volgens Magento, de breedste en grootste developers adoptiegraad en tevredenheidsniveau van alle beschikbare view systemen. De 2 belangrijkste redenen waarom Magento voor React heeft gekozen zijn:
- Een “top-notch developers experience”, dit omdat deze direct feedback krijgt bij aanpassingen;
- Een grote en actieve community met gebruikers en add-ons, ook buiten het Magento ecosysteem;
- Een gestructureerd format voor view changes wat aanpassen makkelijker maakt.
Magento PWA sluit niet uit op termijn ook andere architecturen te introduceren, echter is eerst de liefde met ReactJS verklaard.
Vue Storefront
Inmiddels heeft de community ook al diverse projecten opgestart in andere view layers zoals bijvoorbeeld Vue.js. Voorbeeld van Magento P.W.A. op basis van een Vue storefront:
Interesse?
Wil jij meer weten over wat PWA kan betekenen voor jullie e-commerce succes? Laat het ons dan weten door contact met ons op te nemen. Je kunt ook tickets bestellen voor de volgende editie van ons eigen even E-commerce Insights, hier praten we je graag samen met Magento bij over de laatste stand van zaken.