B
B
BonBon Slick2020-02-06 08:31:06
JavaScript
BonBon Slick, 2020-02-06 08:31:06

Replace data or cache, how does the amount of stored data in the Store affect performance?

For example, there is a list of 100 posts.
When a user clicks on a post, ajax requests are made to get data about a particular post.

The question is, can you cache at the Store level in the form

post_list_with_full_data:
{
   {
    id: 5,
    title: 'FIRST VISITED POST',
    description: 'Some very long description, displayed only on post info page,
    images: {{url: 'some_attachment_url'}, {url: 'some_attachment_url'}, {url: 'some_attachment_url'}},
    comments: {{comment: 'long comment, only on full info page'}, {comment: 'long comment, only on full info page'}},
...
  },
   {
    id: 25,
    title: 'FIRST VISITED POST',
    description: 'Some very long description, displayed only on post info page,
    images: {{url: 'some_attachment_url'}, {url: 'some_attachment_url'}, {url: 'some_attachment_url'}},
    comments: {{comment: 'long comment, only on full info page'}, {comment: 'long comment, only on full info page'}},
...
  },
...
}

In this approach, we have 2 lists, the first one is minified to be displayed in the list of posts, with a minimum data set, and there is a second list of posts that is replenished in the order the posts are visited individually.
Each time a user clicks on a post, we download additional data and insert it into the list of posts with wave descriptions.
Thus, when you go back to the previous post, the data will already be in the Store.
  1. However, how heavy will the Store be?
  2. How much will this affect the speed of rendering and storage manipulation?
  3. For example, if a user viewed 100 posts and we recorded them all in the Store?
  4. Does the amount of data stored in the Store affect UI performance?
  5. SSR vs SPA with big data, that is, we draw all the pieces on the back end and display them on the UI?


Or another option, each time update the data of the current post, something like this
current_post:
{
    id: 2,
    title: 'SECOND POST'
...
}

but then every time you open previous posts, there will be ajax requests and data replacement.

Answer the question

In order to leave comments, you need to log in

1 answer(s)
A
Alex, 2020-02-06
@BonBonSlick

Storing data in a store makes sense in many cases. But this is not one of them. There are several much better tools for caching network requests. First Cache API , second Service Worker API and Workbox . All of these methods use the browser's built-in cache for storage. Which gives a number of advantages:

  • Minimal performance impact.
  • The cache persists between sessions. This means that after looking at one post yesterday. Today it will be loaded from the local cache.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question