PWA vs. AMP: Care este mai bine și în ce fel sunt diferite între ele?

La aproximativ un deceniu de la introducerea primului iPhone, web-ul mobil ajunge în sfârșit la nivelul stilului de viață al utilizatorilor săi. Prinderea și mărirea au fost șterse de paginile responsive. Aplicațiile AMP și native luptă cu timpul de încărcare lent ...

Dar există încă o zonă cu probleme majore pentru web-ul mobil: implicarea. Primele 1.000 de site-uri mobile ajung la 4 ori mai multe persoane decât primele 1.000 de aplicații native. Cu toate acestea, aceste site-uri web atrag utilizatorii cu 20 de minute mai puține minute, în medie, decât aplicațiile mobile.

Se pare că site-urile mobile pot atrage vizitatori, dar nu îi pot păstra. Una dintre cele mai noi tehnologii care rezolvă această problemă sunt aplicațiile web progresive.

Ce sunt aplicațiile web progresive?

Aplicațiile web progresive sunt experiențe de site-uri web mobile concepute să arate, să simtă și să funcționeze așa cum fac aplicațiile mobile native. Utilizatorii îi întâlnesc într-un browser așa cum ar face orice site web mobil. După ce se angajează cu acel site, utilizatorul este solicitat să instaleze aplicația web pe dispozitivul său. Dacă aleg să instaleze, aplicația se va descărca pe dispozitiv așa cum ar face o aplicație nativă.

Termenul „aplicații web progresive” a fost inventat de Google în 2015. Compania spune că aplicațiile web progresive îndeplinesc trei criterii:

• Fiabil - Încărcați instantaneu și nu arătați niciodată downasaurul, chiar și în condiții de rețea incerte.
• Rapid - Răspundeți rapid la interacțiunile utilizatorilor cu animații netede și mătase și fără derulare.
• Implicare - Simțiți-vă ca o aplicație naturală pe dispozitiv, cu o experiență de utilizator captivantă.

După îndeplinirea acestor cerințe, aplicația web mobilă poate fi oferită ca descărcabilă utilizatorilor. Înainte de a ne adânci în aplicațiile web progresive, să revenim la suprafață pe scurt și să definim aplicațiile native și o altă tehnologie care accelerează web-ul mobil, Accelerated Mobile Pages (AMP).

Ce este o aplicație nativă?

Aplicațiile native sunt instalate pe o piață, cum ar fi App Store sau Google Play și trăiesc ca pictograme pe ecranul de pornire al unui dispozitiv. Acestea sunt concepute special pentru un anumit dispozitiv și pot folosi toate caracteristicile sale, cum ar fi GPS, cameră, listă de contacte și multe altele. Acestea sunt aplicații care ar putea fi pe dispozitivul dvs. în prezent, cum ar fi Google Maps, Gmail sau Instagram.

Ce este AMP?

Proiectul open-source Accelerated Mobile Pages (AMP pe scurt) permite dezvoltatorilor să construiască pagini web care se încarcă aproape instantaneu cu un limbaj de codare unic. Acest limbaj este o versiune redusă a HTML și CSS care restricționează utilizarea JavaScript. Aceste pagini sunt găzduite pe un CDN, care oferă o versiune cache a paginii atunci când este vizitată de un utilizator.

Aplicații web progresive față de aplicații native

Aplicațiile native oferă experiențe de utilizare instantanee și fără probleme și sunt acceptate de piețe mari, cum ar fi App Store și Google Play, deci de ce să optați pentru o aplicație web progresivă față de versiunea nativă tradițională? Într-un articol pentru Forbes, Andrew Gazdecki oferă o explicație la nivel înalt:

Site-urile mobile sunt ușor de accesat, dar tind să fie mai puțin plăcute în ceea ce privește experiența utilizatorului. Aplicațiile native oferă cea mai bună experiență a utilizatorului, dar sunt limitate la anumite dispozitive și au bariere ridicate în calea adoptării. Aplicațiile native necesită o descărcare, ceea ce înseamnă mai întâi generarea unui buy-in considerabil de la consumatori și pierderea beneficiului comportamentului impulsiv. Așezarea între aceste opțiuni este cea mai nouă soluție mobilă: PWA.

Pentru o explicație mai rafinată, să ne uităm la unele dintre cele mai mari diferențe dintre aplicațiile native și aplicațiile web progresive:

• Utilizarea caracteristicilor: În prezent, în timp ce aplicațiile web pot profita de caracteristicile unui dispozitiv, aplicațiile native pot face mai mult. Lucruri precum GPS, notificări push și gesturi sunt mai ușor disponibile într-o aplicație nativă.
• Restricții de conținut: pentru a oferi aplicației dvs. șansa de a concura pe Google Play sau App Store, va trebui să vă îndreptați către regulile pieței. Restricțiile de conținut și taxele îngreunează crearea unor aplicații native de succes pentru unele site-uri web. Cu toate acestea, pentru aplicațiile web nu sunt impuse nici restricții de conținut, nici taxe, ceea ce face mai ușor pentru oricine să creeze o aplicație, indiferent de tipul de conținut.
• Conectivitate offline: aici, marginea merge la aplicațiile native, care oferă o cache mai completă decât aplicațiile web progresive încorporate în HTML5. Dacă aplicația dvs. trebuie să funcționeze offline, în prezent cea mai bună alegere este nativă.
• Instalare: Instalarea unei aplicații native necesită acțiuni semnificative în numele utilizatorului. Trebuie să deschidă o piață și să caute o aplicație, apoi să o descarce. Trebuie să existe o intenție serioasă. Pentru instalarea unei aplicații web progresive, există mult mai puține fricțiuni. Adăugarea unuia pe dispozitiv este ca și cum ai crea un marcaj pe ecranul de pornire. Este mai ușor să instalați o aplicație web progresivă, dar procesul este mult mai puțin familiar, ceea ce poate inhiba adoptarea timpurie.

• Viteză: în prezent, aplicațiile web progresive rămân în urma aplicațiilor native. Cu toate acestea, ei reduc în mod continuu diferența. Acest lucru este valabil mai ales atunci când luați în considerare următoarea comparație.

Aplicații web progresive vs. AMP

Oameni precum Gazdecki cred că aplicațiile web progresive vor înlocui în cele din urmă aplicațiile native, dar ce rămâne cu AMP? Unde vin paginile mobile accelerate aici și există un loc pentru ambele? Câteva diferențe cheie între aceste două:

• Descoperire: AMP câștigă această bătălie. AMP primește ajutorul unui carusel în rezultatele căutării Google, unde aplicațiilor web progresive nu li se oferă un impuls în descoperirea motorului de căutare.
• Implicare: aplicațiile web progresive nu sunt limitate la utilizarea AMP HTML sau CSS, deci pot include conținut mult mai interesant decât poate AMP. Orice element interactiv care necesită JavaScript nu poate fi creat folosind cadrul AMP. Pentru AMP, conținutul dinamic nu este disponibil.
• Viteză: avantajul aici merge la AMP din același motiv pentru care aplicațiile web progresive câștigă implicare. AMP poate accepta doar conținut ușor, dar acest lucru face timp de încărcare mai rapid.

În revista Smashing, Paul Bakaus rezumă bine diferența dintre cele două formate:

Pentru ca experiența să fie rapidă, trebuie să trăiți cu anumite constrângeri atunci când implementați paginile AMP. AMP nu este util atunci când aveți nevoie de funcționalități extrem de dinamice, cum ar fi notificări push sau plăți web sau orice altceva care necesită JavaScript suplimentar.

De asemenea, deoarece paginile AMP sunt difuzate de obicei dintr-o memorie cache AMP, nu veți obține cele mai mari beneficii ale aplicației web progresive la primul clic, deoarece propriul dvs. Service Worker nu poate rula. Pe de altă parte, o aplicație web progresivă nu poate fi niciodată la fel de rapidă ca AMP la acel prim clic, întrucât platformele pot prelegera paginile AMP în condiții de siguranță și ieftin - o caracteristică care face, de asemenea, încorporarea mai simplă (de exemplu, într-un vizualizator inline).

Dar, până la urmă, chiar trebuie să alegem unul peste celălalt?

Cooperarea asupra concurenței

Puteți alege să utilizați AMP numai pentru a crea o experiență rapidă, dar simplă. Vă puteți baza pe o aplicație web progresivă pentru a crea o experiență de utilizator dinamică, dar mai lentă. Sau, ați putea începe rapid și rămâne rapid prin încorporarea ambelor în designul dvs. web.

Astăzi, utilizările AMP împreună cu aplicațiile web progresive devin din ce în ce mai răspândite, dezvoltatorii folosind ambele în trei moduri.

1. AMP ca aplicație web progresivă

Dacă conținutul dvs. este în principal static și vă puteți mulțumi cu funcționalitatea limitată a AMP, această opțiune vă permite să creați experiențe fulgerătoare ca aplicație web progresivă. AMP, de exemplu, este construit astfel - o aplicație web progresivă în întregime încărcată de AMP. Are un lucrător de service, care permite accesul offline, precum și un manifest, care solicită bannerul „Adăugați la ecranul de start”.

2. AMP la o aplicație web progresivă

O altă modalitate de a utiliza împreună AMP și o aplicație web progresivă este gândirea la pagina AMP ca la cârligul site-ului dvs. web. Prinde utilizatorul cu o încărcare instantanee, apoi îl rulează în aplicația dvs. web progresivă. Acest lucru vă permite să combinați paginile AMP cu încărcare rapidă cu un PWA mai dinamic decât prima opțiune.

3. AMP într-o aplicație web progresivă

Așa cum a fost cazul AMP vs. PWA, nu trebuie să fie totul sau nimic. Nu este nevoie să vă construiți toate paginile cu AMP; de asemenea, nu este nevoie să separați AMP și PWA ca cârlig și tijă. Acum, puteți de fapt să AMP doar o subsecțiune mică a unei singure pagini, reducându-i astfel dimensiunea și scăzând timpul de încărcare fără schimbul complet de funcționalitate dinamică.

Aceasta implică utilizarea unei alte forme de AMP numită „Shadow AMP”, care permite AMP să se cuibărească într-o zonă a unei pagini web. Rezultatul este AMP în cadrul unei aplicații web progresive. Pentru a-l vedea în acțiune, consultați demo-ul creat de Google numit ShadowReader:

Sunteți gata să vă creați propria aplicație web progresivă?

Crearea unei experiențe rapide, asemănătoare unei aplicații native, cu posibilitatea de descoperire a web-ului, începe aici, unde puteți afla toate casetele pe care trebuie să le verificați pentru a îndeplini criteriile Google pentru PWA-uri. Pentru mai multe informații despre utilizarea AMP și PWA împreună, consultați:

• Discuția asta de la Ben Morss
• Discuția asta de la Eric Lindley

Când sunteți gata, începeți să utilizați generatorul de pagini de destinație AMP după clic în Instapage pentru a vă oferi cea mai rapidă experiență de utilizator.