6

I have an app that allows users to sort and filter through 30,000 items of data. Right now I make fetch requests from Redux actions to my rails API, with the queries being handled by scope methods on my rails end. My instructor is recommending that I move all my querying to my front-end for efficiency, but I'm wondering if it really will be more performant to manage a Redux state object with 30,000 objects in it, each with 50 of their own attributes.

(A couple extra notes: Right now I've only run the app locally and I'm doing the pagination server-side so it runs lightning fast, but I'm a bit nervous about when I launch it somewhere like Heroku. Also, I know that if I move my querying to the front-end I'll have more options to save the query state in the URL with react-router, but I've already sort of hacked a way around that with my existing set-up.)

Improve this question

1 Answer 1

Reset to default
14

Let's have a look at the pros and cons of each approach:

Querying on Front End

  • 👍 Querying does not need another network request
  • 👎 Network requests are slower because there is more data to send
  • 👎 App must store much more data in memory
  • 👎 Querying is not necessarily more efficient because the client has to do the filtering and it usually does not have the mechanisms to do so effectively (caching and indexing).

Querying on Back End

  • 👍 Less data to send to client
  • 👍 Querying can be quite fast if database indexes are set up properly
  • 👍 App is more lightweight, it only holds the data it needs to display
  • 👎 Each query will require a network request

The pros of querying on Back End heavily outweighs that on Front End. I would have to disagree with your instructor's opinion. Imagine you want to search for something on Google and Google sends all relevant results you want to your browser and does the pagination and sorting within your browser, your browser would feel extremely sluggish. With proper caching and adding database indexes to your data, network requests will not be a huge disadvantage.

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

Good explanation.
I'm very relieved to hear this explanation. Thank you!
@evita could you mark the answer as correct if it helps you? Thanks!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.