[Solved]-TextInput flickering/choppy behaviour on render-Reactjs

I had the similar issue but I solved my problem by setting a number for the width of textInput. I am not sure if that related to this. But after I checked official docs, it says,

value

The value to show for the text input. TextInput is a controlled component, >which means the native value will be forced to match this value prop if >provided. For most uses, this works great, but in some cases this may cause >flickering - one common cause is preventing edits by keeping value the same. In >addition to simply setting the same value, either set editable={false}, or >set/update maxLength to prevent unwanted edits without flicker.

Good luck!

An elegant solution to this problem is to NOT continually update the component's state when entering text, but rather update it on submission:

import React from 'react';
import { View } from 'react-native';

const MyComponent = () => {
    let textValue;

    function onFormSubmitted() {
        // do something with textValue, update state
    }

    return (
        <View>
            <TextInput
                onChangeText={(text) => {
                    textValue = text;
                }}
                onEndEditing={onFormSubmitted}
            />
        </View>
    );
};

export default MyComponent;

The reason for the flickering seems to be to be related to the component's size, and continuous updating of the state may work in small components, but it is wasteful in it's nature. If you're not dependent on real-time filtering of something, it should be completely unnecessary.