Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Outperforming native platforms with Progressive Web Application

Outperforming native platforms with Progressive Web Application

Way of Zattoo web platform from web site to progressive web application. Explanatory showcase of mobile and desktop applications made on pure HTML, CSS and JavaScript. Look into native markets delivery.

13a0857775ce894b33288ce85d52efd8?s=128

Bogdan Plieshka

June 25, 2019
Tweet

Transcript

  1. None
  2. 25.06.2019, TAMEDIA EXCHANGE Outperforming native Apps with Progressive Web App

  3. 25.06.2019, TAMEDIA EXCHANGE Page 3 whoami Bogdan Plieshka Frontend Engineer

    at Zattoo
  4. Demo Yes, right away 25.06.2019, TAMEDIA EXCHANGE Page 4

  5. This is Web App! HTML, CSS, JavaScript - nothing more

  6. 25.06.2019, TAMEDIA EXCHANGE https://beta.zattoo.com

  7. What our users say? A lot of surprises 25.06.2019, TAMEDIA

    EXCHANGE Page 7
  8. Content pages Page 8 “Wann gibt es diese App über

    ITunes zum herunterladen? Bin bis jetzt sehr zufrieden ” “When there is this app on iTunes for download? I am very satisfied so far ” — iOS Safari user 25.06.2019, TAMEDIA EXCHANGE
  9. Content pages Page 9 “Finde ich super gemacht. Wann kommt

    das auf der Android TV App?” “I think it's great. When will that be on the Android TV app?” — Mac OS Safari user 25.06.2019, TAMEDIA EXCHANGE
  10. 25.06.2019, TAMEDIA EXCHANGE “Cool, unbedingt APP Upgrade machen!” “Cool, be

    sure to upgrade APP!” — Android Chrome user “Wann kommen alle Funktionen wie in der App?” “When will all functions come in the app?” — iOS Safari user
  11. Users don’t care about technologies Users care about experience 25.06.2019,

    TAMEDIA EXCHANGE Page 11
  12. None
  13. None
  14. None
  15. None
  16. Performance is not about numbers Performance is all about feelings

    25.06.2019, TAMEDIA EXCHANGE Page 16
  17. None
  18. None
  19. None
  20. How? Web mindset 25.06.2019, TAMEDIA EXCHANGE Page 20

  21. Stopped limiting Most of the performance problems in web coming

    from custom implementation instead of using native browser APIs 25.06.2019, TAMEDIA EXCHANGE Page 21
  22. None
  23. Devil in details Something that no one ever asked 25.06.2019,

    TAMEDIA EXCHANGE Page 23
  24. None
  25. So we get low 25.06.2019, TAMEDIA EXCHANGE Page 25 01

    Care about low-end devices. Everything that good for sluggish phone good for any high-end device. 02 Forget about desktop or mobile experience. Do web experience. 03 Consistency is a must. Nothing should be introduced without reason. 04 Prevent content jumps, empty screens, do animations 05 Speak to users, receive feedback, iterate on it. 06 Trust your engineers
  26. Accessibility What if run your application with my fridge? 25.06.2019,

    TAMEDIA EXCHANGE Page 26
  27. 25.06.2019, TAMEDIA EXCHANGE Page 27 Not so friendly, heh?

  28. Size matters Page 28 Why do we need hold megabytes

    of app in our pockets? 25.06.2019, TAMEDIA EXCHANGE
  29. Distribution Web is everywhere Native applications are limited by their

    platforms 25.06.2019, TAMEDIA EXCHANGE Page 29
  30. From Browser to App 25.06.2019, TAMEDIA EXCHANGE Page 30 You

    can find “Add to home screen” button in most of major browsers
  31. Windows Market supports PWA for a long time 25.06.2019, TAMEDIA

    EXCHANGE Page 31 developer.microsoft.com/en-us/windows/pwa they even have tool for easy publishing pwabuilder.com
  32. Google Play opens for PWA 25.06.2019, TAMEDIA EXCHANGE Page 32

    This year Google announced support of Progressive Web Apps in their market as first-class citizens
  33. Apple a bit behind 25.06.2019, TAMEDIA EXCHANGE Page 33 Generally

    you can already use PWA in iOS and Mac OS, however it’s not available in App Store yet. More sadly that over last years Safari became new IE.
  34. - Can we replace all native apps with web? -

    No 25.06.2019, TAMEDIA EXCHANGE Page 34 Web & Native serve different purposes, but… - web can compete close enough* - web can fill uncovered platforms without big effort - web can instantly impress, give a sneak-peek into native Don’t limit Web
  35. 25.06.2019, TAMEDIA EXCHANGE THX! and have a nice surfing!

  36. None