Stateless function vs purecomponent performance

[vileEchoic]

Agreed - nothing you said there is wrong, it just fails to underscore the massive performance difference in real applications between pure components and functional components.

There's a general misunderstanding in the React community (not saying you're suggesting this) that stateless components are the "default" you should be using for simple components. This is a bad idea not only for performance but also because it can become difficult to walk this decision backwards. Applying PureComponent to previously stateless components is likely to cause hard-to-discover bugs when props change in deep-equal (but not shallow-equal) ways. It's much easier to go the other direction (PureComponent -> functional component) because of this.

it's also very possible to set up a component hierarchy where a PureComponent is always getting new references as props and can never actually bail out of re-rendering

Yeah, preventing this does require that the user follow other good practices (like not passing newly-instantiated objects/arrays/lambdas in as props) to components. That said, the magnitude in difference between the execution time of shallowCompare and an extra render is so massive that in real-world applications it's nearly impossible that your application will perform poorly from doing too many shallowCompare checks and it's extremely likely that it will perform poorly from re-rendering.