Kāpēc progresīvās tīmekļa lietotnes ir tīmekļa attīstības nākotne

"Galvenais ir savlaicīgi uztvert traucējumus un pārmaiņas. Nereaģējiet uz to gadu desmitiem vēlāk. Jūs nevarat cīnīties ar jauninājumiem. ” - Raiens Kavanauhs

Pēdējā laikā ap PWA ir daudz satraukumu, un daudzi apgalvo, ka tā ir tīmekļa attīstības nākotne, it īpaši attiecībā uz mobilajām ierīcēm. Būtībā Progressive Web App (PWA) ir vienkārši tīmekļa lietojumprogramma, kas izmanto modernas tīmekļa metodes, lai lietotājiem sniegtu vietējai lietotnei līdzīgu pieredzi. Tās ir tīmekļa lietojumprogrammas ar pakāpenisku uzlabojumu, lai ieviestu tādas funkcijas kā kešatmiņa, sinhronizācija fonā un informatīvie paziņojumi.

Lai gan PWA ir bijuši jau vairāk nekā divus gadus, atbilde ir diezgan nepietiekama. Daži lielie spēlētāji ir pieņēmuši šo filozofiju, bet lielākā daļa to faktiski nav ļoti izmantojuši. Chrome un Mozilla, iespējams, ir labākās pārlūkprogrammas, lai pārbaudītu jūsu PWA, jo Apple vēl nav iekļuvis šajā lietā.

PWA - vai tas tiešām ir labi?

No vienas puses, mums ir vietējās lietotnes, kas neapšaubāmi ir ātras un efektīvas vairumā gadījumu. No otras puses, ir vietnes, kas ir diezgan lēnas, un ar savienojamības problēmām tas tikai pasliktinās.

Paātrinātā mobilo lapu projekts (AMP), kuru vada Twitter un Google, tika uzsākts 2016. gadā, lai atrisinātu tikai šīs lēnā savienojuma problēmas. PWA darbojas nevainojami visos iespējamos scenārijos. Ar labu savienojumu nekad nav problēmu. Problēma ir tad, kad mums nav savienojuma, un mūs sagaida ar kļūdas lapu.

Bet tas var kļūt visvairāk kaitinošs, ja mums ir lēns savienojums. Šķiet, ka lapa tiek ielādēta, un viss, ko mēs redzam, ir tukšs ekrāns. Mēs vienkārši gaidām, gaidām un gaidām, bet šķiet, ka lapa nekad netiek ielādēta. Tieši šeit mūsu glābšanai nāk PWA. Labākā daļa par PWA - jūs iegūstat vislabāko iespējamo lietotāja pieredzi lēnā savienojamībā, kā arī bez savienojamības (jā, jūs to pareizi izlasījāt ..).

Kāpēc ir jēga izmantot PWA

Saskaņā ar pētījumu vidusmēra lietotājs 80% no sava kopējā laika pavada lietotnēm tikai trijās viņa lietotnēs (Man tā Chrome, Quora un Medium).

Pārējās lietotnes lielāko daļu laika vienkārši dīkstāvē, patērējot dārgo atmiņas daļu. Turklāt lietotnes izstrāde, nevis tās izveidošana, maksā apmēram desmit reizes. Izmaksas var kļūt daudz augstākas, ja plānojat izstrādāt un uzturēt atsevišķas kodu bāzes dažādām platformām, piemēram, Android, iOS un tīmeklim.

Vietējās lietotņu funkcijas, kuras PWA var izmantot

  • Push paziņojumi
  • Pilnekrāns
  • Strādā bezsaistē
  • Splash ekrāns tiek atbalstīts, piešķirot tam vairāk lietotnes izjūtu

PWA var izmantot vēl daudzas šādas funkcijas. Iepriekš minētie punkti ir tikai, lai dotu jums mājienu par to, ko PWA spēj. Tomēr ir dažas tradicionālās funkcijas, kuras pašlaik izmanto tikai vietējās lietotnes.

Vietējās lietotņu funkcijas, kuras PWA pašlaik nevar izmantot

  • Nav vai ir ļoti ierobežota piekļuve dažādiem aparatūras sensoriem
  • Signāli
  • Piekļuve tālruņu grāmatai
  • Sistēmas iestatījumu mainīšana

PWA attīstās diezgan ātri, un mēs varam cerēt, ka šīs funkcijas drīz sāk darboties.

Divi galvenie PWA komponenti

Lietotnes manifests

Tas ir JSON fails, kas nosaka lietotnes ikonu, kā palaist lietotni (atsevišķu, pilnekrāna režīmu pārlūkprogrammā utt.), Un visu šādu saistīto informāciju. Tas atrodas jūsu lietotnes saknē. Saite uz šo failu ir nepieciešama katrā atveidojamā lapā.

Tas tiek pievienots HTML lapas galvas sadaļā:

Service Worker

Service worker is where most of the magic of happens. Its nothing but JavaScript code that acts as programmable proxies solely responsible for intercepting and responding to network requests. Since it acts as a proxy and can be easily programmable, the application must be served over HTTPS to keep the data secure.

Its worth noting that the service worker caches the actual response, including all HTTP headers, rather than just the response data. This means that your application can simply make network requests and process the response without any specific code to handle the cache.

How do I get started?

The best thing about getting started is that it’s quite easier than it seems. In fact, it’s very much possible to take an existing site and convert into a PWA. I highly suggest you watch this if you intend to develop a PWA.

Thanks for reading! If you liked it, please support by clapping and sharing the post.