Searching in large object arrays - vue.js

Question

I have a Vuex.Store where I have centralized all site data, this object is actually pretty big. In different pages, the user needs to search data while the result has to be paged.
In order to show all data, I partition a particular object array in my store in a way that I keep the length and totalPages in a component, and then iterate through the original array maintained by Vuex.
However, for searching, I have created an action in my Vuex module which takes an argument and compares items within the object array against that, and it finally returns a promise.
The actual problem is that, I then create a temporary array in my component for the searched items followed by re-assigning the length and totalPages values. I feel like this temporary array is something redundant which only increases the size of the DOM and I also feel like it is such a bad idea.
The point of posting this question is to know, whether this approach would be considered as a standard solution, or whether there are better ways for searching large repositories.

Answer 1

Let's take for example a simple blog.
We have the following pages:
/blog/page/1
/blog/page/4
/slug-of-the-post
/slug-of-another-post
My Vuex store has the following keys:
{
posts: {},
pages: {},
}
Now when the user goes to /blog/page/1 I fetch all the data for that page from the API and store each post in the posts object, and in the pages object I store only a reference to the post.
This is how the store looks like after going to /blog/page/1
{
posts: {
'blog-post-example': {
id: 1,
title: 'test'
},
'another-blog-post-example': {
id: 2,
title: 'another title'
}
},
pages: {
1: [
'blog-post-example',
'another-blog-post-example'
]
},
}
Same happens if they go to the next page "/blog/page/2".
However, if they go back to "/blog/page/1", I can detect that the data of that page has already been fetched and I don't need to go back to the API.
This way you smoothen the UX, without loading all your blog posts into the store at once.
Hope that helps.