Progressive web apps (PWA)
A new way to deliver amazing user experiences on the web. PWA must be fast, reliable and engaging for every user. It must work on even the worst network speeds, have silky smooth animations without any janky scrolling, and must feel like an application on any device. This can be done by looking at key technologies, service workers can cache key elements of a site for the user to view regardless of network state. It must load within 3 seconds! This has useful benifits for both the user and the developer. To be a progressive web app, you must complete the following checklist that ranges across five categories push notifications, caching, performance, user experience and indexability & social.;
- Site is served over HTTPS
- Pages are responsive to tablets & mobile devices
- The start URL (at least) loads while offline
- Metadata provided for Add to Home screen
- First load fast even on 3G
- Site works cross-browser
- Page transitions don’t feel like they block on the network
- Pages each have a URL
- Site’s content is indexed by Google
- Schema.org metadata is provided where appropriate
- Canonical URLs are provided when necessary
- Pages use the History API
- Content doesn’t jump as the page loads
- Pressing back from a detail page retains scroll position on the previous list page
- When tapped, inputs aren’t obscured by the on screen keyboard
- Content is easily sharable from ‘standalone’/full screen mode
- Site is responsive across phone, tablet and desktop screen sizes
- Any app install prompts are not used excessively
- First load very fast even on 3G
- Site uses cache-first networking
- Site appropriately informs the user when they’re offline
- Provide context to the user about how notifications will be used.
- Ensure that the UI that encourages users to turn on Push Notifications isn’t overly aggressive.
- Ensure the site ‘dims’ the screen when Chrome’s permission is showing
- Ensure any push notifications sent are timely, precise and relevant
- Ensure the site provides controls to enable/disable notifications
HTTPS
Encrypting data in transit is something that google finds very important. So important that it has started ranking lower, the sites that don’t include HTTPS.
References;
https://developers.google.com/web/
akbrodie.wordpress.com 