React-hot-loader: ShouldComponentUpdate bypassed when rendered from root

[omerts]

Description

There is a bug where shouldComponentUpdate is not being called. In our case it caused bugs to be discovered only in production mode, since the app was rendered on every small change in development mode. This is also a performance hit (which is important is development too).

Expected behavior

shouldComponentUpdate should be raised before every render

Actual behavior

shouldComponentUpdate is not being raised

Environment

React Hot Loader version: 3.0.0-beta.X

1. node -v: v6.3.1
2. npm -v: 3.10.5

We have an app where on state changes we re-render from the top. On every render we would expect shouldComponentUpdate to be called, but it is not. Other lifecycle hooks we checked, are being raised as expected. We have reproduced it on the react-hot-boilerplate (see below).

1. Operating system: Windows 7
2. Browser and version: Chrome 54.0.2840.99 m (64-bit)

Reproducible Demo

Next branch at:
https://github.com/omerts/react-hot-boilerplate

[calesce]

We use react-deep-force-update, which updates regardless of what sCU returns. However, I'd expect sCU to still be called. It seems to make some assumptions about internal React element properties, which may break at any time.

Relatedly, I wonder whether there's a simple way to distinguish between hot update re-renders (where we can do deep updates) and "normal" re-renders from external props changes. We currently always deep update.

[omerts]

@calesce Thanks for the answer.
If AppContainer causes deep-updated regardless of hot updates, this is kind of interfering with the "real" way react works, and can introduce unexpected behavior when react-hot-loader is not used (like in production builds).

[aledoroshenko]

Guys, did i get it right - when in AppContainer, and non-production more (NODE_ENV=development) - app will always re-render?

I'm trying this with Redux, and on test app when i dispatch action in some inner component that don't update store - whole app re-renders. And as i see, it could be react-hot-loader business - when i'm setting NODE_ENV=development or remove AppContainer - dispatched action don't cause full re-render. Could it be it?

[kevin-hendrickx]

full rerender also happening for me when calling reactDOM.render() multiple times.

[asgerhallas]

We've also run into this issue. Is there any chance this will be fixed? I will gladly help out - but would like to know in advance if there's some known road blocks ahead, something I should know or if it's a "by design/won't fix" kind of issue :)

[marbemac]

Chiming in here, we use nextjs, which in turn uses react-hot-loader. This issue has caused bugs in production for us a couple of times that were not caught in development. We've only just now traced it back to shouldComponentUpdate firing in production but not development, leading to hard to catch bad behavior.

Any chance anybody is looking at this? @asgerhallas did you end up getting started or no?

[gregberge]

To clarify, shouldComponentUpdate will not be called when react-hot-loader <AppContainer> or <HotContainer> will be re-rendered. If your setup is "classic", it will happen when you re-render your application from the root.

Except that, the behaviour is exactly the same with or without react-hot-loader.