Как улучшить рендеринг SvgUri для нескольких элементов

Question

Я использую MapView, Marker и SvgUri для загрузки N маркеров на мою карту.

Мой вопрос: как мне улучшить этот код, чтобы SvgUri могрендерится быстрее, так как это тот же Uri Image, какое изменение - только положение маркера!

Я подумал, что нужно кэшировать его, чтобы первый раз имел время загрузки, а другой просто получал ссылку на SVG. той же иконы, но я не знаю, как это делается. Это должно быть сделано с использованием SvgUri, а не локального Svg

Кто-нибудь имеет какое-либо понимание, как это можно сделать, или уже прошел для аналогичной проблемы? Теперь каждому добавлению маркера требуется от 1 до 5 секунд для загрузки изображения SvgUri. Моя идея - попытаться максимально сократить время загрузки SvgUri!

Показывает маркер по умолчанию и после загрузки повторно отображает его, показываяSvg.

Этот следующий код является примером того, как он реализован прямо сейчас.

---

libs в package.json :

"react": "16.9.0", 
"react-native": "0.61.1", 
"react-native-maps": "^0.25.0", 
"react-native-svg": "^9.8.4",

---

Пример кода :

import MapView, { Marker } from 'react-native-maps';
import { SvgUri } from 'react-native-svg';


renderMarkers = () {
  // This function return N markers like renderMarker()
  // How to pre render SvgUri to not have loading timer
  // Local Svg does not work for me, it must be Uri.
}

renderMarker = (lat, lng) => {
  var url = "http://thenewcode.com/assets/images/thumbnails/homer-simpson.svg";

  return (
    <Marker
      coordinate={{
        latitude: lat,
        longitude: lng
      }}>
        <SvgUri width="30" height="30" uri={url} />
      </Marker> 
      );  
}

  render() {
  return(
  return (
    <View style={{ flex: 1 }}>
      <MapView>
        {this.renderMarkers()}
    </MapView>
    </View>
  )