Som du har hittat till det här blogginlägget har du förmodligen hört termen PWA någonstans. Bra för dig – PWA:s är vad året 2018 kommer att bli ihågkommet för, så du är precis i framkant. Så spännande! I det här blogginlägget förklarar jag vad begreppet egentligen betyder och varför du bör bry dig om det.
(källa: Google Developer site)
Vad är en PWA?
PWA står för Progressive Web Application. Låt oss undersöka det genom att dela upp det i två delar. De två sista orden (”webbapplikation”) talar för sig själva. PWA:er är webbapplikationer. Här betyder webbapplikation helt enkelt en app som körs som en webbplats som till exempel Twitter. Den första delen av termen – progressiv – innebär att användarupplevelsen förbättras gradvis utifrån webbläsarens möjligheter. Det betyder i huvudsak att webbapplikationen fungerar bra i äldre webbläsare, men att den kan använda nyare teknik för att förbättra upplevelsen om användaren använder en webbläsare som stöder dem. Låter enkelt, eller hur? Så varifrån kommer termen?
Progressiv innebär att användarupplevelsen förbättras gradvis baserat på webbläsarens kapacitet
Termen introducerades av Google Chrome-ingenjören Alex Russell i hans blogginlägg 2015. Sedan dess har Google aktivt främjat användningen av dem och tillhandahållit många resurser i ämnet, t.ex. en webbplats som förklarar dem närmare.
När jag håller presentationer om PWA:er stöter jag alltid på samma förvirring vid den här punkten. ”Så… Är det en teknik? Är det en standard? Är det något som ägs/patenteras av Google?” Nej, inget av detta. Det är helt enkelt en term för att beskriva ett specifikt sätt att utforma och bygga program. Låt oss sedan försöka förstå vad de är genom att gå igenom egenskaperna.
Här är de ursprungliga 9 egenskaperna hos PWA av Alex Russell med en förklaring till vad de betyder i det här sammanhanget:
- Responsive: Sidan ser bra ut på olika skärmstorlekar (t.ex. telefon, surfplatta, skrivbord)
- Oberoende av anslutningsmöjligheter: Fungerar utan internetanslutning
- Appliksliknande interaktioner: Utseende och känsla som en inhemsk applikation
- Färsk: Alltid uppdaterad
- Säker: Använd säker anslutning för att minska flera typer av säkerhetshot
- Detekterbar: Säker anslutning för att minska flera typer av säkerhetshot: Webbläsare identifierar PWA:er automatiskt
- Återupptäckbar: Kan få användarna att återvända till appen med hjälp av till exempel push-notiser
- Installerbart: Kan lagras på startskärmen precis som vanliga appar, men utan det extra besväret med App Store
- Länkbar: Kan delas runt som vanliga webbadresser
För läsaren av det här blogginlägget är de viktigaste funktionerna:
- Installerbarhet på hemskärmen
- Access till flera inhemska API:er som kamera, geolokalisering, vibrationer, betalningar osv.
- Stöd för push-notiser
- Offline-användning
- Stöd för fullskärm och splash screen
(källa: Alex Russells blogginlägg)
För att sammanfatta allt det ovanstående kan PWA:er göra det mesta av vad infödda appar kan göra, och klyftan mellan vad infödda appar och webbappar kan göra blir hela tiden mindre och mindre.
Varför nu?
Nuförtiden kanske du tänker att allt detta låter så bra att det måste finnas en hake eftersom PWA:s inte är standardmetoden för att implementera applikationer. Ja, du har rätt. Det finns en hake. Det har saknats stöd för de tekniker som möjliggör PWAs i vissa miljöer. Stödet för Android har funnits ett tag, från och med Android 5, vilket innebär att över 80 % (källa: Googles Android-statistik) av Android-enheterna i hela världen har stöd för den teknik som behövs för att implementera PWA:er. Antagandet är ännu större om man bara tar hänsyn till Europa eller Nordamerika. Så Android-stödet är verkligen bra redan.
Tyvärr har den andra viktiga aktören som delar marknaden för mobiltelefoner inte varit alltför ivrig att implementera tekniken (läs varför). iOS-stödet har saknats, vilket har förhindrat ett bredare införande av PWA:er. Men från och med den snart kommande iOS 11.3 kommer stödet att finnas tillgängligt även för iOS. Lyckligtvis är antagandet av nya iOS-versioner relativt snabbt, så man kan anta att en hög nivå av stöd kommer att finnas tillgänglig senare i år. Som referens kan nämnas att versionerna 10 och 11 står för 93 % av alla iOS-versioner som används där ute enligt Apple.
Och även om fokus när man pratar om PWA:er ofta ligger på den mobila miljön, fungerar de även på skrivbordet. Tidigare den här månaden kom ett viktigt tillkännagivande från Microsoft om att PWAs nu stöds av Edge och Windows 10. Chrome och Firefox har redan stöd för PWA:er och det kommer även nästa version av Safari.
Exempel: Twitter Lite
Det mest kända exemplet på PWA:er är Twitters PWA-version kallad Twitter Lite (prova den med Android eller dator på mobile.twitter.com). Twitter har också publicerat sitt resonemang bakom byggandet av PWA-versionen. För att belysa några fakta från inlägget, jämfört med deras ursprungliga app är storleken på PWA-versionen endast 1-3 % och den genomsnittliga laddningstiden är 30 % kortare.
Andra välkända exempel på PWA:er är Forbes, Trivago, Washington Post, Telegram, Alibaba och nu senast Google Maps Go. Det finns också en katalog över PWA:er tillgänglig.
Slutsatser
Året 2018 förväntas bli året för PWA:er. Verktygen är redan på en bra nivå och fler och fler PWA:er dyker upp hela tiden. När stödet i iOS är mycket tillgängligt blir PWA:er ett realistiskt alternativ för inbyggda appar. Om du funderar på om PWAs är det rätta valet för dig, kom tillbaka snart då jag kommer att skriva en guide om Should I do a PWA instead of a native app?
Gofore har redan erfarenhet av PWAs och har också bred erfarenhet av att bygga responsiva, snygga, offline-first och effektiva webbappar. Oavsett om du behöver hjälp med arkitektoniska val, design eller implementering av PWAs, tveka inte att kontakta oss.
FORTARE LÄSNING FRÅN GOFORE BLOGGEN
Agile Transformation in Action – Del 1
Agile Transformation in Action – Del 2
Vad är poängen med att skala Agile