我尝试渲染很多标记，但是在真实设备中运行时会崩溃，我该如何解决？

Question

当我在运行某个应用程序的应用程序中运行代码时，它可以工作，但是当我尝试将其加载到实际设备中时，它崩溃了，请不要打开...我想我需要创建一个异步应用程序，但我确实知道怎么...有什么想法？ 请打开小吃，看看我的代码，帮帮我... 我尝试在地图上加载很多标记...如果我在零食中运行它会起作用...：/有人可以帮我吗？

class App extends React.Component {
   state = {   
     isLoading: true,
     markers: [],
     modalVisible: false,
     locationChosen: false,
     showAlert: false,
   };
   componentDidMount() {  
return fetch('https://gist.githubusercontent.com/MatheusCbrl/bba7db1c0dbc68be2f26d5c7e15649b6/raw/0fab4ea3b493dcd15e95f172cd0a251724efbc45/teste.json')
  .then(response => response.json())
  .then(responseJson => {
    // just setState here e.g.
    this.setState({
      markers: responseJson,
      isLoading: false,
    });
  })
  .catch(error => {
    console.error(error);
  });
 }


 renderMarkers() {
return this.state.isLoading
  ? null
  : this.state.markers.map((marker, index) => {
      const coords = {
        latitude: JSON.parse(marker.latitude),
        longitude: JSON.parse(marker.longitude),
      };
      return (
        <MapView.Marker
        onPress={this.pickLocationHandler}
        ref={mark => (marker.mark = mark)}
        key={index}
        title={'Parada'}
        //description={marker.hora}
        coordinate={coords}>
        <Image
          onPress={e => this.onPressMarker(e, index)}
          source={
            this.state.selectedMarkerIndex === index
              ? markerImage2
              : markerImage2
          }
          style={styles.icon}
        />
      </MapView.Marker>

      );
    });
}