Progressive Webapps

Travailler avec les progressive web apps

Description

Dans les dernières statistiques parues sur l'utilisation du web, la majorité se faisait sur un smartphone. Ceci engendre des éventuels problèmes de connexions, de performances ou encore d'expérience utilisateur. Les différentes spécifications derrière le terme "Progressive Webapps", vont nous permettre de développer une application web dont l'expérience utilisateur est d'aussi bonne qualité qu'une application native.

Objectives

  • Connaitre les concepts des Progressive Webapps
  • Savoir optimiser une application
  • Améliorer l'expérience utilisateur de votre application
  • Maitriser les nouveaux concepts du développement Web : Service Worker, Web Worker, IndexDB, ...

Prerequisites

  • JavaScript, Ecosystème NodeJS

Programme

Présentation

  • Concepts
  • Cas d'utilisation
  • Exemples

Web App Manifest

Protocole HTTPS

Web App Install Banner

IndexedDB

Service Worker

  • Cycle de Vie
  • Utilisation
  • Stratégie de Cache
  • Cache API
  • Fetch API

Web Worker

Push Notification

App Shell

Optimisation de votre application

  • PRPL Pattern
  • Webpack
  • Code Splitting
  • Tree Shaking

Autres API : Vibration, Battery, ...

Outillage

  • Chrome Dev Tools
  • Workbox
  • Lighthouse
  • Testing