Refactor MsgFeed and enable simple cache with map

[digi-monkey]

No description provided.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
flycat-web	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Dec 14, 2023 2:54pm

[ahonn]

It seems to be a memory cache, why not use React Query?

[digi-monkey]

It seems to be a memory cache, why not use React Query?

because memo is the simplest way, we can switch to a more robust one. also, I am not familiar with react query, what cost and advantage will it brings?

[ahonn]

It seems to be a memory cache, why not use React Query?

because memo is the simplest way, we can switch to a more robust one. also, I am not familiar with react query, what cost and advantage will it brings?

React Query is also a memory cache by default. React Query can simplify the related implementation, for example, using request params as Query Keys to reduce unnecessary requests. It also provides some caching control, pagination logic, and other functionalities we may need.

For cost: We need to familiarize ourselves with React Query, which provides many functionalities. From a code perspective, it should be able to reduce the amount of code. But, using it at the moment may need some significant code modifications.

For advantages: It primarily addresses the issues of fetching, caching, synchronizing, and updating server states, all of which are problems that flycat needs to solve.

I highly recommend reading the documentation on React Query, especially the Caching section, for this PR.
You can find it here: https://tanstack.com/query/v4/docs/react/guides/caching

[digi-monkey]

It seems to be a memory cache, why not use React Query?

because memo is the simplest way, we can switch to a more robust one. also, I am not familiar with react query, what cost and advantage will it brings?

React Query is also a memory cache by default. React Query can simplify the related implementation, for example, using request params as Query Keys to reduce unnecessary requests. It also provides some caching control, pagination logic, and other functionalities we may need.

For cost: We need to familiarize ourselves with React Query, which provides many functionalities. From a code perspective, it should be able to reduce the amount of code. But, using it at the moment may need some significant code modifications.

For advantages: It primarily addresses the issues of fetching, caching, synchronizing, and updating server states, all of which are problems that flycat needs to solve.

I highly recommend reading the documentation on React Query, especially the Caching section, for this PR. You can find it here: https://tanstack.com/query/v4/docs/react/guides/caching

cool, I will first make sure everything runs as expected under the simple Map cache and then take a look at this lib

[digi-monkey]

this is getting big. I am going to merge it and separate some following tasks in issue for the React Query thing

cc @ahonn

[ahonn]

this is getting big. I am going to merge it and separate some following tasks in issue for the React Query thing

cc @ahonn

Yes, I think so. There may be a lot of changes to using React Query to refactor the current implementation, so we need to break it down step by step.