4 điều cần biết về Progressive Web App

I. Progressive Web App (PWA) là gì

Đây là định nghĩa của từ progressive trong Progressive Web App.

PWA là tức là cách dùng để mô tả việc làm cho web app "ngon" hơn.

Ngon hơn ở đây là những khả năng web app chưa làm được. Hiện tại vấn đề lớn nhất web app chưa làm được đó là ứng dụng có trải nghiệm người dùng (UX) như là native app.

Progressive Web App

Để làm được điều này, PWA cần đảm bảo 3 yếu tố chính:

Reliable: App load nhanh và có thể sử dụng offline. Ví dụ vào niviki.com chỉ mất 0.5s, tắt mạng đi vẫn dùng được.
Fast: App không những load nhanh mà còn chạy nhanh như máy điện, nhấn button phát là mở trang mới ngay, animation load vù vù không một dấu hiệu giật lag.

Engaging: Có khả năng dụ user như là native app. Có thể gửi notification, badge.

(Hình ảnh minh hoạ) Tiki - Một trong những đơn vị dụ user theo trend qua push notification số một VN từ #chạy ngay đi #bua yeu đến #sân choi cua tao

II. Progressive Web App vs Native Mobile App.

Sao không làm mẹ native app luôn đi? Progressive là gì cho mất thời gian?

Về mặt kinh doanh

Source: https://www.mobiloud.com/blog/mobile-apps-vs-the-mobile-web

Số người dùng mobile app sẽ nhiều hơn mobile web. Nhưng điều đáng nói trên 80% user chỉ dùng những app top chart như Facebook Messenger, Youtube, vv. Và trung bình mỗi user chỉ cài 1,2 app một tháng. ( Những số liệu này thay đổi từng năm, nhưng bạn có thể dàng search trên Google, đã có nhiều tổ chức làm research và công bố. )

Ngươc lại, chi phí để reach 1 user ( dụ user dùng app ) trên web là rẻ hơn.

Ví dụ bạn chạy quảng cáo một cái web, user có thể tò mò click vào xem. Còn quảng cáo cho một mobile app, user phải click vào App Store/CH Play xong tắt mất tiu. Chưa kể web còn thể SEO, ví dụ user đang tìm "phần mềm nói chuyện tiếng Anh với người nước ngoài", thấy kết quả trên Google, họ sẽ click vào ngay, chứ không ai lại vào App Store/CH Play tìm kiếm cái mình cần trước cả.

Về mặt kỹ thuật.

Dễ thấy nhất là đỡ phải học 2 ngôn ngữ cho iOS và Android. Vậy React Native cũng vậy mà?

Nhưng PWA sẽ tận dụng được source code của web, RN hiện tại thì không

React Native dù native nhưng vẫn phải cần có native dev trong team để fix lỗi, viết các module của native.

III. Demo

Đây là trang báo của Financial Times, bạn hãy vào trang này bằng mobile, sau đó tắt mạng và tiếp tục dùng nhé.

http://app.ft.com/ Sau đó vào lại VNexpress.net để so sánh trải nghiệm người dùng khi đọc tin tức ở 2 trang

Ngoài ra, https://pwa.rocks/ là một trang listing các PWA, nhưng nó có chia ra các category khác nhau như game, shopping, news. Bạn hãy vào trang này bằng mobile và clicks từng ứng dụng để xem PWA chạy thế nào nhé, đặc biệt là thử chơi Flappy Bird với 2048 được viết bằng PWA

Progressive web app demo

IV Học PWA ở đâu?

Progressive Web Apps Training Khoá học Udemy: Progressive Web Apps (PWA) - The Complete Guide - Khoá này mình cực kỳ recommend, nội dung rất chi tiết, anh Maximilian Schwarzmüller này cũng có rất nhiều khoá về web development rồi nên bạn yên tâm về chất lượng.

Kết

Có nhiều nhận định là PWA sẽ là tương lai của ứng dụng di động. Theo mình công nghệ cũng một phần, app bạn ngon thì users cũng chả quan tâm bạn dùng công nghệ gì đâu. Những app mình hay dùng như Money Lover, Trello, WorkFlowy, dù chúng có viết bằng gì đi nữa, mình vẫn dùng.