fix: prevent re-render on issue fetching and improve PWA #136
Conversation
zugdev
changed the title
|
I've also changed the strategy in the PWA. We should default to Network and if offline load from cache. Defaulting to cache is horrible DX because you constantly need to clear cache in order to see update in code. This needs review and merge ASAP @0x4007 My vercel deployment: https://work-ubq-fi-git-fix-rerender-zugs-projects-e51b52e0.vercel.app |
|
Vercel is private but requested access. Why use vercel and not our continuous deploy? |
No difference tbh, I just have it setup for CD in my fork and since the CD here was pending I attached. |
| await taskManager.syncTasks(); | ||
| void displayGitHubIssues(); | ||
| if (cachedIssues) { | ||
| void displayGitHubIssues(undefined, undefined, true); // if there were cached issues skip animation |
There was a problem hiding this comment.
I think it makes sense to change the function signature so that you don't have to pass in two undefined?
Alternatively, if it makes sense, pass in destructured parameters (an object)
|
When I load the first time there is no animation. |
|
@0x4007 this should be better now, the problem was PWA would serve from cache always and we would need to manually update cache's name to ensure users get distributed updates. I've designed it now so that whenever you open the page you load the newest version into cache on the background, so next time users open the page/app they'll have the newest version. |
|
Still keeping cache first approach since it's much better in performance. |
| return cachedResponse; | ||
| } | ||
| return fetch(event.request) | ||
| const fetchPromise = fetch(event.request) | ||
| .then((networkResponse) => { |
#131 introduced issue caching to improve performance on poor networks. Now we render issues from cache and fetch in parallel. If cached issues aren't up-to-date we cache fetched issues and render them. However, this leads to a replay in the appearing issues animation. This PR introduces an option to skip this animation, handling both the case where a stale issue is removed and a new issue is introduced. Here is a demo:
fix-rerender-demo.webm