React Native with ScrollView feels sluggish

Any idea why ScrollView + multiline TextInput + KeyboardAvoidingView feels really sluggish? I'm using react-navigation with the react-native-screen for the native modal look. The screenshot gif below is taken on emulator but it behave similarly even on the real device (notice that there is a flash of blue background just before keyboard showed up)

My code looks something like (I set the KeyboardAvoidingView background to pink so it's easy to spot and ScrollView background is set to blue

<KeyboardAvoidingView behavior={'padding'} style={{flex: 1, backgroundColor: 'pink'}} keyboardVerticalOffset={48}><View style={{flex: 1}}><View style={styles.header}><Text>{date}</Text><Button title="Delete"/><Button title="Save"/></View><ScrollView keyboardDismissMode={'interactive'} style={{flex:1, backgroundColor: 'blue'}}><TextInput onChangeText={(text) => setNote(text)}                       placeholder='Note'                       value={note}                       multiline={true}                       scrollEnabled={false}                       style={{flex: 1, backgroundColor: '#fff'}}            /></ScrollView></View></KeyboardAvoidingView>

I'm also using react-native-elements, react-navigation+react-native-screens for the native modal look

PS - I tried not using ScrollView and simply using TextInput with scrollable={true} which seems to be working but the problem with that is I can't dismiss the keyboard once the keyboard is shown