Components inside <Transition> renders 4+ times in a row

[vasilich6107]

Hi. Thanks for the library. I'm trying to use it for animation. But I have a pretty complex component to animate. Before animation occurs the component inside component re-renders 4+ times and only after that animation starts.

Here is a screenshot https://tppr.me/MxskE

To reproduce that just replace <Text>Screen</Text> inside AppearingElements.js to

class ScreenScale extends Component<{}> {
    shouldComponentUpdate(nextProps: Readonly<P>, nextState: Readonly<S>, nextContext: any): boolean {
        return false;
    }

    render() {
        console.log('ScreenScale render called');
        return (
            <View style={styles.textContainer}>
                <Text>Screen</Text>
            </View>
        );
    }
}