Cache Avatar Images in Client (workbox)

[Shinigami92]

When scrolling through the timeline it is common to hit avatars for the same user multiple times, and usually you follow your community that does not change that much

I would like to propose to cache the avatars on first load so scrolling trough the timeline does not fetch the avatars via internet everytime

At #VueAmsterdam2023 the avatars did load slowly and so I thought this can improved

[stackblitz[bot]]

Start a new pull request in StackBlitz Codeflow.

[patak-dev]

Maybe we should check why the browser caching isn't working correctly.

One big improvement we need to implement is to preload the avatars as soon as we get the post info even if they are out of the fold. So when you scroll, they would already be there. We are now always 10 posts ahead of the fold, so this can already avoid what you are seeing.

[Shinigami92]

This needs to be tested with a throttled connection I just have the issue when I have slow connection like in a German train in the wild or at the conference when 1000 people try to access the same wlan the same time

Here is an example (but it was worst at conference)

https://user-images.githubusercontent.com/7195563/218250549-2a0babc8-157b-4711-a31e-0d72792b8535.MOV

Even normal images seem to load faster 👀

[Shinigami92]

@userquin and I experimented a bit with PWA sw cache: https://discord.com/channels/1044887051155292200/1075465855552475136 Result: it does not work as expected and bloats up the cache by >>100mb up to 1GB for just some avatars Other stuff results in CORS issues

We need to try other solutions

[Shinigami92]

I'm in a restaurant with slow connection Ayo is definitely someone I follow and is very often in my timeline So why does it not read the avatar from a cache It is so slow I could make easily a screenshot

PWA iOS iPhone Xs