Memory startup when using hundreds of identical images

Description

I am using responsive maps to draw about 750 markers on the map. Each marker uses the same image

Reproduction Steps and Sample Code

const markerImage = <Image source={images.marker} />;
export default class Main extends Component {
  render() {
    return (
      <MapView style={StyleSheet.absoluteFill}>
        { coordinates.map(coordinate => {
          return (
            <Marker
              key={coordinate.id}
              coordinate={coordinate}
              children={markerImage}
            />
          );
        })}
      </MapView>
    )
  }
}

      

Possible Solution

Reuse UIImage Optimize custom marker performance with Google Maps SDK for iOS

However, I don't know how to do this in React Native, since React abstracts from the presentation layer.

Additional Information

  • React Native version: ["0.41.2"]
  • react-native-maps: ["^ 0.13.0"]
  • Platform: [both]
  • Development operating system: [MacOS]
  • Developer tools: [Xcode: 8.3, iPhone 7 (10.3), GalaxyS6 (6.0.1)]

image

image

+3
memory uiimage react-native marker react-native-maps


source to share


No one has answered this question yet

See similar questions:

fourteen
Optimizing custom marker performance using the Google Maps SDK for iOS

or similar:

56
Eclipse memory settings when receiving "Java Heap Space" and "Out of Memory"
3
Translate screen x / y to map coordinates
2
When does a Windows process run out of memory?
2
Resizing images and running out of memory
1
Run from RAM
1
Macro out of memory when run twice
1
vb.net - Launch from memory when working with a lot of images
1
Transferring the addressee to Maps and going to this point
0
What is causing this error when running run-ios for react?
0
Animation doesn't work after calling setState



All Articles
Loading...
X
Show
Funny
Dev
Pics