React VR Image Border disappears after more elements appear

Question

I have a View with the following markup. What's weird is that if I include more than one of these views in my module, some of the borders disappear. What's even more strange to me is that the borders are all there on page load, but then once all of the images finish loading, I lose some of the borders. Does anyone know why I might be losing my borders when more Image tags get added? I've attached a photo of what I'm seeing below.

      <View style={{
        flex: 1,
        flexDirection: 'row'
      }}>
        <Image source={asset('kw1.jpg')}
               style={{
                borderWidth: 0.1,
                borderColor: 'red',
                width: 1,
                height: 1,
                transform: [{translate: [0, 0, -3]}, {rotateY: 30}]
               }}
        />

        <Image source={asset('kw2.jpg')}
               style={{
                borderWidth: 0.1,
                borderColor: 'red',
                width: 1,
                height: 1,
                transform: [{translate: [0, 0, -3]}, {rotateY: 0}]
               }}
        />

        <Image source={asset('kw3.jpg')}
               style={{
                borderWidth: 0.1,
                borderColor: 'red',
                width: 1,
                height: 1,
                transform: [{translate: [0, 0, -3]}, {rotateY: -30}]
               }}
        />

        <Image source={asset('kw4.jpg')}
               style={{
                borderWidth: 0.1,
                borderColor: 'red',
                width: 1,
                height: 1,
                transform: [{translate: [0, 0, -3]}, {rotateY: -30}]
               }}
        />
      </View>