Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Only re-render if action creator returns an object #99

Open
runemadsen opened this issue Apr 7, 2019 · 6 comments
Open

Only re-render if action creator returns an object #99

runemadsen opened this issue Apr 7, 2019 · 6 comments

Comments

@runemadsen
Copy link

First of all, thanks for the great library!

Here's a proposal for a feature: To allow an action creator to return false or {} in order not to re-render the connected components.

We're having an issue in our app where we need to have a timeout running every 100ms to fetch updates from a backend. Most of the time, this fetch returns an identical object to that in state and we don't want to re-render all our connected components. So our action creator looks like this (using immutable):

{
  actionsCreators: {
    syncData: async ({ data }) => {
      const newData = await api.get('/data');
      return data.equals(newData) ? {} : { data: newData };
    }
  }
}

So we return an empty object if the data did not change. However, this still causes react-waterfall to re-render every connected component. It seems like it would be easy to implement something where we can return false or an empty object in order not to make react-waterfall re-render.

Is this a PR that you would be interested in?

@mstronge
Copy link

mstronge commented Apr 9, 2019

@runemadsen Could you utilise the shouldComponentUpdate lifecycle method to solve your issue?

@runemadsen
Copy link
Author

Yes, we are currently using shouldComponentUpdate as a workaround. However:

  1. We have hundreds of connected components that have to do deep equality checks every 100ms. This is a significant performance hit that could be entirely eliminated with a single if() statement in react-waterfall that does not break the current API.

  2. I would argue that the current functionality is undesirable. In a component, I can easily fetch new data and only call setState if the data is different. This is currently impossible in react-waterfall, as setState will be called on every action call, even ones that return nothing. This patterns prevents us from really embracing the store philosophy because we have no ability to perform heavy data fetching without also introducing heavy component logic. PureComponent is no help since connect() creates a new object every time it is called, so the shallow equality check does not work.

I will happily send a PR if it's wanted.

@bravomartin
Copy link

any interest on this?
It would solve my problem too :)

@didierfranc
Copy link
Owner

didierfranc commented Jul 28, 2019

@runemadsen A PR will be great and will solve a real issue ;)

@vbuch
Copy link

vbuch commented Oct 16, 2019

@didierfranc @runemadsen @bravomartin ^ here is a PR

@bravomartin
Copy link

Excellent! That's exactly what I need.

Also very clean implementation 👍

@didierfranc please take a look and merge away 💯

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants