Whole component is always re-rendered

[PetrGlad]

I have animation at top "main" component. I found out that when I change property of a component that is nested inside "main", the whole "main" component is re-rendered. Besides performance, this causes problems when there is a text input field which loses focus after re-render.
Also it is strange that I had to add componentShouldUpdate to make animations work. It enables animations even when componentShouldUpdate always return true.

This can be reproduced only by adding tweenstate.Mixin without any animations enabled.
I use Om (Clojurescript), ReactJS 13.3 and react-tween-state from master.

BTW, would you recommend using chenglou/react-motion instead?

[chenglou]

React-motion doesn't cover ordinary animation (only spring), but that's the way to go anyway. You should try it. Though React-motion also re-renders your thing. I know you're in Cljs but have you tried sprinkling some StaticContainer? Though shouldComponentUpdate isn't exposed in Om right?

[PetrGlad]

I tried also using react-spring but it still has some strange interactions with how Om detects state changes. E.g. it does not reflect local component's state changes if the component is inside react-spring. shouldComponentUpdate is available for override in Om but it cannot force update if Om does not consider it. This is what I do not like in Om - too much magic and it's not clear where to look when things break. So I better stay on trodden way: I have re-implemented the animations with CSS transitions (they turned out to be sufficient in my case). I never seen StaticContainer before,I'll have a look at it.