react native - How to only rerender marker instead of map and marker

Question

I am developing an app that involves tracking another user on the user's phone. I am trying to update a marker location and display it on my user's phone. The problem is that every time I update the marker location the entire map reloads to the initial user's coordinates. How can I only rerender the marker instead of the entire map?

      <View style = {styles.container}>
      {!this.state.ready &&(
        <ActivityIndicator size='large' color="#0000ff"/>
      )}
      {this.state.ready &&(
        <MapView style={styles.map} region={{          
          latitude: this.state.where.lat,          
          longitude: this.state.where.lng,          
          latitudeDelta: 0.0922,          
          longitudeDelta: 0.0421 }}        
          showsUserLocation={true}>

          {this.state.friendMarkers &&(
          <MapView.Marker
          coordinate={this.state.friendMarkers[0].coordinates}
          title={this.state.friendMarkers[0].title}/>
        )}

        </MapView>

        )}
          
      </View>

question from:https://stackoverflow.com/questions/65879635/how-to-only-rerender-marker-instead-of-map-and-marker

Answer 1

Use RNLocation or Geolocation react-native package to get real-time user live location. These packages will update the user's live location without re-rendering the whole screen.