Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
re-renders are triggered even if the style props aren't changed
See original GitHub issueDescribe the bug
When sx remains constant, the component re-renders on both 0.3.x and 0.4.x-rcs
To Reproduce Steps to reproduce the behavior:
-
Go to https://91hn6.csb.app/ or code
-
In react-dev-tools enable highlights when a component re-renders
-
type in the first input box (emotion
jsx), see that only the input triggers the highlights -
type in the second input box (theme-ui
jsx) see that the input triggers highlights even if the sx prop is hoisted out and is a constant object
Expected behavior
Ideally, if the value that is passed in to sx doesn’t change, then emotion could also use their caching to not re-render.
Screenshots
Additional context We probably need to dig into how emotion is able to return the same component if the style stays the same.
Issue Analytics
- State:
- Created 3 years ago
- Comments:7 (6 by maintainers)
Top Results From Across the Web
Top Related Medium Post
Top Related StackOverflow Question
Troubleshoot Live Code
Top Related Reddit Thread
Top Related Hackernoon Post
Top Related Tweet
Top Related Dev.to Post
Top Related Hashnode Post
@atanasster it looks like theme-ui
0.5.0-alphawith emotion 11 doesn’t have the re-render issue so we can probably go without the plugin for now. I’ll keep you posted if I find other cases of re-rendering due to object styles.@alexanderchan - I am a bit behind - do you think we need to incorporate the hoisting in the plugin?