Progressive Web Apps in 2024

Поділитися
Вставка
  • Опубліковано 6 чер 2024
  • Are Progressive Web Apps still relevant?
    💬 Topics:
    - What is a PWA;
    - Steps to convert a Web App into a PWA;
    - Working with Service Workers;
    - PWA Example;
    - List of PWA features
    🥇 Become a Member - / @awesome-coding
    ✉️ Join the Newsletter - newsletter.awesome.club/
    📖 Blog Article - www.awesome.club/blog/2024/ar...

КОМЕНТАРІ • 106

  • @guandor
    @guandor 27 днів тому +60

    You left out the two most important problems with PWAs... distribution and Apple.

    • @willinton06
      @willinton06 25 днів тому +1

      How is distribution a problem? Apple sure but distribution is definitely not a problem

    • @ustav_o
      @ustav_o 25 днів тому +6

      apple is a global problem, not in just PWAs
      could you give more info why distribution is a problem?

    • @jerrygreenest
      @jerrygreenest 24 дні тому +4

      Distribution problem: on Apple devices you can’t make installation button, you can’t simply build it into your interface. That’s the problem. It’s quality of life and it’s non-present on Apple devices. On android it’s ok.

    • @عبدالحكيم-الشنقيطي
      @عبدالحكيم-الشنقيطي 23 дні тому

      ​@@jerrygreenest my friend has an ios and he can install pwas like normal apps from clicking install from the browser

    • @ozgurNY
      @ozgurNY 8 днів тому +1

      Distribution is not a problem at all. It is handled via web server!! It is what makes PWAs better than native apps because 1) devs do not pay to Apple/Google before publish (yearly subscription) 2) you are free to update your code anytime you want and users receive them immediately

  • @Gornius
    @Gornius 28 днів тому +89

    I'm working for startup and built PWA, which was perfect fit for our use case - easy to install, fast to update, shared codebase with desktop, could be run offline and could deliver Push notifications. But then Apple decided to be Apple and we basically lost full iOS marketshare in EU with that (we're based in Poland, and EU is our main if not only market).
    EDIT: So apparently it works if your default browser is Safari, but when Apple was required to allow other browsers on iOS, they stated it is impossible to have PWAs working, and they will stop working in EU.

    • @anandhukraju9382
      @anandhukraju9382 28 днів тому +4

      Curious to know how you implemented the whole PWA with push notifications 🤔

    • @Gornius
      @Gornius 28 днів тому

      @@anandhukraju9382 Oh, it was some research on my part, but there are resources on the internet. We implemented it using Firebase FCM, so firebase sdk was handling most of it. And yes - it worked just like with any other app, with that difference it was being handled by browser's android service worker not the app's (because app per se doesn't exist).

    • @smithrockford-dv1nb
      @smithrockford-dv1nb 28 днів тому

      Wait what did they do in the EU

    • @Gornius
      @Gornius 28 днів тому

      @@smithrockford-dv1nb They took down PWAs in iOS, because the user's ability to choose browser (which is possible only in EU) made it impossible to implement. Such a bs.

    • @vaisakhkm783
      @vaisakhkm783 28 днів тому

      ​​@@smithrockford-dv1nbapple broke pwa support in EU as part of thier malicius complience, and best part is, pwas where their sales pitch for iphones 15y ago

  • @jamesgphillips91
    @jamesgphillips91 27 днів тому +46

    Hot take: as developers we should advocate for moving to pwas and wasm for all app development. The dom is by far the best way to build user interfaces, the web becomes the platform to distribute apps and we cut out the corporate fat of platform app stores entirely

    • @logantcooper6
      @logantcooper6 27 днів тому +17

      This is why apple drags their heels so much. They don't want to let you out of their walled garden.

    • @jamesgphillips91
      @jamesgphillips91 27 днів тому +7

      @@logantcooper6 hotter take: this is what regulator should make illegal

    • @funkdefied1
      @funkdefied1 27 днів тому

      Google is working on it! Check out this talk from Google IO: “A web revolution: Build great desktop-grade apps”

    • @CyberTechBits
      @CyberTechBits 27 днів тому

      100% agree!

    • @عبدالحكيم-الشنقيطي
      @عبدالحكيم-الشنقيطي 23 дні тому

      when i heard was came out i was saying WASM PWAS would be the best way to make cross platform apps...and it maybe was untill it became to diffcult so i stick to JS 👍

  • @AngularUniversity
    @AngularUniversity 28 днів тому +37

    PWAs never took off due to Apple delaying support years, and then only giving partial support, creating all sorts of problems. The installation user experience of installation was awful last time I checked.

    • @statelessdev
      @statelessdev 27 днів тому +4

      PWAs work in iPhone (and I love it). PWAs aren't prevalent because not everyone is building them - because - you don't discover a random PWA on a random site - you discover apps on app stores. Businesses want apps built. Developers like us can build PWAs, and make sites awesome by offering additional PWA capabilities.

    • @jerrygreenest
      @jerrygreenest 27 днів тому +1

      The worst drawback of PWA on iphones is istallation, right, you have to go to some menu somewhere, because on iphone developer cannot make an installation button, unlike on android.

    • @permatrout2720
      @permatrout2720 26 днів тому +1

      Yeah, you have to "share" and then "add to home screen". Not that bad but most apple users just don't know how to do it.

  • @prathamshenoy9840
    @prathamshenoy9840 28 днів тому +38

    even if i am not lazy enough to build native mobile apps, i would want to skip the app store fees

    • @MStoica
      @MStoica 27 днів тому

      question is: does a PWA (which is basically a web site, runs in the browser, just without the address bar) have access to device native APIs?

    • @Dipj01
      @Dipj01 25 днів тому

      ​@@MStoicayes using the FileSystem Access API

    • @codeaperture
      @codeaperture 25 днів тому

      ​@@MStoica Yes it does

  • @adriablancafort
    @adriablancafort 28 днів тому +33

    PWAs are awesome!

  • @CyberTechBits
    @CyberTechBits 27 днів тому +4

    Building PWAs is sooo much better! Great video!

  • @slmille4
    @slmille4 27 днів тому +10

    In theory PWAs let you create cheap cross platform apps, but in practice companies still end up needing iOS and Android native versions as well.

    • @lardosian
      @lardosian 27 днів тому +1

      Very true..

    • @jerrygreenest
      @jerrygreenest 27 днів тому +2

      Yeah and there's two main reasons for it:
      1. Web developers make shitty apps, unlike native developers who's gatekeeping shit developers away
      2. There's still quite poor support for PWA, particularly from Apple, even though they take baby steps into supporting PWA more, many wish more progress on it

    • @zshanahmad2669
      @zshanahmad2669 24 дні тому +1

      @@jerrygreenest their baby steps turned into giant steps in the opposite direction, ever since they were asked to allow other browsers... just plain evil.

    • @jerrygreenest
      @jerrygreenest 24 дні тому

      @@zshanahmad2669 they didn’t drop PWA support although they were close, so I would say it’s not «huge steps in opposite direction», but I agree it’s frightening how they almost willing to drop PWA (fortunately they didn’t)

  • @gageracer
    @gageracer 27 днів тому +2

    One thing I was not able to achieve is serverless PWA. Specifically for to send notifications to user without a server. I want to set reminders and alerts just from the client side and trigger a push notification when app is not up but it seems like you can only push the notifications from a server to the service worker.

  • @rrenildopereiraa
    @rrenildopereiraa 28 днів тому +5

    yeee, was waiting for this video!!

  • @seanknowles9985
    @seanknowles9985 28 днів тому +1

    Would be great to cover in offline sync with Mong atlas registering pwa on the appstores

  • @akashthoriya
    @akashthoriya 27 днів тому +4

    in india, hdfc card app is PWA

  • @abrahamsimonramirez2933
    @abrahamsimonramirez2933 27 днів тому +1

    Apache cordova works for me

  • @abdulazeez.98
    @abdulazeez.98 28 днів тому +1

    Awesome

  • @Stefanune
    @Stefanune 24 дні тому

    I dunno if I'm right but I recognize a sardinian/italian accent 😅 great content btw

  • @joeportnoy-qh9en
    @joeportnoy-qh9en 24 дні тому

    you should make a video on deno bindgen

  • @MaximeMoreillon
    @MaximeMoreillon 28 днів тому +9

    Are PWAs equally supported on all modern browsers ? I remember having issues with Safari a while ago

    • @helderlj
      @helderlj 28 днів тому +14

      Apple does still hate PWA and will try to ban them every now and then

    • @awesome-coding
      @awesome-coding  28 днів тому +7

      @helderlj Of course they will - I'm not sure that they'll be allowed to completely ban them (especially in Europe)

    • @Gornius
      @Gornius 28 днів тому +4

      @@awesome-coding Now Apple's reasoning in Europe is "ability to choose browsers made PWAs technically impossible to implement", which is such a bs.

    • @statelessdev
      @statelessdev 27 днів тому

      @@helderlj not true. They even went further and added PWA support to desktop experiences aswell.

    • @jimmyroserovallejo
      @jimmyroserovallejo 26 днів тому +1

      es porque las pwa no tenian que pagar nada apple y apple nunca pierde su dinero :c

  • @jimmyroserovallejo
    @jimmyroserovallejo 26 днів тому

    Yo Uso una PWA y es excelente, hasta web push e instalación sin pagar en tiendas de apps, lamentablemente el soporte para apple ya no existe, pero para android son excelente opción, creo que deberiamos exigir a google nuevas características como plashscreen y una que otra cosita que falta de las nativas... que le sigan dando soporte...

  •  27 днів тому +2

    I don't understand those increases in % after moving to pwa.... From the final user point of view, there is no difference between native and pwa, they would not even know it changed, so why their behavior would change along the code change? Are they really implying that without the move to pwa they would not had increased those % amounts? How, why?

    • @robert4445
      @robert4445 27 днів тому +2

      I've seen that statistic and other "case studies" flying around. I'm guessing it's from Google promoting/marketing PWAs, and so the statistics are biased. They don't tell you that the same user was using a native app before. If the user was only viewing Twitter from their browser before getting prompted to install the app, they may have a much easier time than going through browser afterwards. They're not necessarily saying PWA users tweet 70% more than native app users, though they leave a lot of room for interpretation.

    • @rubenheymans1988
      @rubenheymans1988 27 днів тому +3

      yeah they always compare PWA's over just opening the website in your browser, making it seem like it has a huge amount of benefits. However they should always compare it to native apps. I think the real benefits are: no app store bs, easy and fast updates (you can easily force everyone to be on the same version too), you don't need to give a percentage of your revenue to apple/google (that's why apple is cockblocking PWA's), (way) faster development for all platforms in one go (you basically just build a responsive web app), from my experience it's really fast compared to some native apps too (angular firebase combo). Downside can be no app store, because that's what the users are used too, installing a PWA is 'weird' (although you can in theory publish a PWA to app stores), limited apple support, and some missing native features (you'll never need irl).

  • @patocarrasco6266
    @patocarrasco6266 26 днів тому

    PWA are amazing. I just started learning it like 2 days ago and your video shows out! Very useful. The only thing that I can't find is how I can change the app version. It keeps showing `App version: 1`. 😓

    • @dennisadamczyk
      @dennisadamczyk 25 днів тому

      Quick hint: If you already added a service worker, it is possible that you only get the old cached version of your app. In DevTools, you can update the service worker manually to get the new version with new caching. This behaviour tends to be a bit missleading since we web developers expect everything to be updated on reload 😅

  • @nomadshiba
    @nomadshiba 28 днів тому +3

    there's a kysely adapter plugin, that let's you use indexeddb as sqlite database.
    you can also build a REST api on your sw.
    acting like a remote server. you can use it like a replica or proxy where you cache data.
    you can also have global states and all of the app logic on the sw and use the browser side as a viewer only. you can wrap sw states with a signal interface, so it's easy to handle.
    you can also use it with htmx if you want to, but instead of htmx directly talking with your remote server asking for it to render whole ui. it's asking it to the sw.

  • @frangrau3750
    @frangrau3750 28 днів тому

    What is your take on PWAs vs Flutter? Thanks

    • @celdaemon
      @celdaemon 28 днів тому +2

      Those two things aren't really comparable, what do you mean exactly?

    • @lardosian
      @lardosian 27 днів тому

      Ye a PWA is really just a website with extra powers so they dont really compare.

  • @huulbaek
    @huulbaek 22 дні тому

    Are you talking about Twitter Lite? And isn't that a very old story? And isn't native still a way better experience when we talk about mobile apps?

  • @dennisadamczyk
    @dennisadamczyk 25 днів тому

    Notice: To make an PWA installable, a service worker is required in a lot of browsers.

  • @andrespereira4608
    @andrespereira4608 28 днів тому

    Don't you have issues installing a PWA in Android mobiles? Almost every phone has only one navigator (mostly Chrome) that can install a PWA and the others install a fake one (web shortcut without the pwa features but in display standalone...)
    The android emulator cannot install a PWA with Chrome...
    It's only me?

    • @matrixlander85
      @matrixlander85 27 днів тому

      I use an Android and I have installed PWAs successfully with Chrome and Opera for Android.

  • @tomekk3569
    @tomekk3569 28 днів тому

    👍👍

  • @asagiai4965
    @asagiai4965 27 днів тому

    So this is what they called PWA, I thought it should just be named interoperability or portable for some reason

  • @Gruby7C1h
    @Gruby7C1h 24 дні тому

    The problem is Apple not wanting to make web tech too good.

  • @PhielDev
    @PhielDev 28 днів тому +1

    goat

  • @kasper369
    @kasper369 28 днів тому

    I wounder why people are building navtive or even hybrid apps when they can build PWAs anyone explain

    • @jeffreyjdesir
      @jeffreyjdesir 28 днів тому +2

      Last I tried this year's ago the ios support was terrible, maybe that's changed. You can also compile web assembly and react native so the possibilities are endless

    • @adambickford8720
      @adambickford8720 28 днів тому

      Apple's anti-competitive practices. Even if you use a different browser, you're still using safari on ios.

    • @ChrisWilson1973
      @ChrisWilson1973 28 днів тому +3

      PWAs have been around as an option for years, but iOS support for many important web platform features essential for a good "native like" experience was so poor, and has only really reached a level where it's viable quite recently, that it pretty much killed what was a great option for creating mobile apps.
      Apple's desire to have full control of the distribution of everything installed on iOS devices is commonly cited as the reason they dragged their heels, and being able to install what to all intents and purposes is an app, just from a third party website, without their involvement or any control, wasn't something they wanted to encourage or enable in any way.

    • @statelessdev
      @statelessdev 27 днів тому

      because businesses are paying people to do so. why? discoverability, familiarity. Mr Business / non-technical person doesn't know or care about PWAs.

    • @lardosian
      @lardosian 27 днів тому

      If you asked lets say 100 people would they prefer to use fakebook on their app or phone browser you can be sure it will be vast majority will be their app..

  • @najlepszyinformatyk1661
    @najlepszyinformatyk1661 27 днів тому

    PWA is awesome in theory and if you're a geek for your internal tools. But mainstream people don't use PWA. Most people I know use many native apps daily but no one uses PWA.

  • @thatsalot3577
    @thatsalot3577 25 днів тому

    Apple : no i don't think we'll support another way to make applications for ios, we need that in app purchase control

  • @rajeshpoddar5763
    @rajeshpoddar5763 28 днів тому +1

    meaow

  • @fuzzy-02
    @fuzzy-02 28 днів тому +4

    75% more tweets doesn't sound like a success story to me, haha

  • @JamesHarrisonHaribo
    @JamesHarrisonHaribo 27 днів тому

    Hasn’t Apple killed the PWA off yet?

  • @hanmingzheng5592
    @hanmingzheng5592 27 днів тому +6

    I hope less and less ppl use apple. Overpriced, so little invovation.. and limited pwa support

  • @perseon
    @perseon 25 днів тому +1

    screw you apple