React native scroll view twitching on iOS when using SafeAreaView

This is bizarre and I can't find anything about it.

I have a very simple project (just getting started with react native), and when I put a list of items in a scroll view, I'm getting a constant "twitching". Here is a video of the behavior: https://imgur.com/a/MYerrFl

It happens on both the iOS simulator as well as my phone.

Here is the very simple code:

const App = () => {
    return (
        <ScrollView style={{
            backgroundColor: '#fcfcfc'
        }}>
            <SafeAreaView>
                {['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p'].map((letter) => {
                    return <Text style={{
                        backgroundColor: 'red',
                        padding: 20,
                        margin: 3
                    }} key={letter}>{letter}</Text>
                })}
            </SafeAreaView>
        </ScrollView>
    );
};

When I remove the SafeAreaView, it doesn't twitch at all...