[PWA] 0. Introduce to Offline First

时间:2023-03-09 16:05:42
[PWA] 0. Introduce to Offline First

Why offline first?

Imagin you are visiting a website, it is fine if wifi connection is good. It might be also "fine" if show you "Your don't have internet connection", so you give up. The worse case is you have really poor wifi connection and the page is trying to loading, but nothing comes up. So you just wait and wait...

Noramlly online first soultion is trying to connect network (server) first. If cannot connect then fetch data from cache. This is not so good, because you still need to wait and wait util network fallback then you will get cache data. How about we do:

  1. When page loading, send two request.
  2. One request going to cache to fetch as much as we can to display on the screen.
  3. Another reqest going to the reall server, get data update.
  4. If we are in really poor wifi connection, at least we get something, we see something, better than nothing.
  5. If the connection is good, the cache data will be replaced with real data and interface update immediately. This will provide a better user experence.