mirror of
https://gh.wpcy.net/https://github.com/discourse/discourse.git
synced 2026-05-12 07:05:24 +08:00
20923d1b09
The reactions users menu is paginated and lets the user filter by
reaction (emoji tab) or view all reactions ("All" tab). Without caching,
every tab switch and every scroll-driven page request hits the server.
This change introduces a per-instance `#tabCache: Map<filter, { users,
canLoadMore }>` keyed by the active filter (null for "All", or a
reaction id), so already-fetched results can be reused.
On each `fetchUsers` call, we slice the cached users for the requested
range. We serve from cache when either:
- Full page - the cache holds at least pageSize users at this offset, so
we can return a complete page directly.
- Partial page - the server has already told us there are no more users
to fetch (entry.canLoadMore is false), and the cache still has at least
one user at this offset. We return whatever's left, even if it's fewer
than pageSize.
Other things to note:
- After a fetch we splice the new page onto whatever was already cached
for that filter (existing.slice(0, offset) + users) and store the
updated `canLoadMore`. Slicing up to offset (rather than appending
blindly) keeps the cache coherent if pages are ever requested out of
order.
- When the "All" tab finishes loading every user, we already know the
full reaction set client-side and can eagerly populate per-reaction tab
caches by partitioning that list. Switching to an emoji tab afterwards
is then a zero-network operation.
- The cache lives on the component instance, so it's discarded when the
menu is closed. Live reaction changes from other users still flow in via
MessageBus → addTrackedPostProperties("reactions", …), which re-renders
the menu while it's open; the cache simply avoids redundant network
calls within a single open session.
|
||
|---|---|---|
| .. | ||
| deleted-post-test.js | ||
| discourse-reactions-archived-topic-test.js | ||
| discourse-reactions-custom-emoji-test.js | ||
| discourse-reactions-disabled-test.js | ||
| discourse-reactions-enabled-test.js | ||
| discourse-reactions-icon-aliases-test.gjs | ||
| discourse-reactions-notifications-test.js | ||
| discourse-reactions-post-test.js | ||
| discourse-reactions-received-test.js | ||
| discourse-reactions-rollback-test.js | ||
| discourse-reactions-users-menu-test.js | ||
