React Native dynamisch erfordern (Bilder)

Question

Ich programmiere eine App ähnlich wie bei coinmarketcap.com. Eine riesige Liste von bis zu 700 Münzen und Icons usw. in einer SectionList. Aber in meiner App können Sie auswählen, welche Münzen Sie verfolgen möchten.

Gibt es eine Möglichkeit, nicht ALLE 700 Symbole zu benötigen, sondern nur ausgewählte? Im Moment habe ich eine objects.js Datei mit:

export const IMAGES = { 
    'btc-usd': require('../icons/bitcoin.png'), //statically analyzed 
    'eth-usd': require('../icons/ether.png'), 
    ... 

Aber ich mache mir Sorgen um Speicher und Leistung. Lädt React sie alle im RAM? Oder gerade wenn es rendert? Vielen Dank für die Unterstützung

diese Lösung gefunden, aber nicht sicher, ob es technisch effizienter ist:

Eine einfache Lösung fand ich einen sehr minimalistischen package.json innerhalb dem war die Schaffung obersten Ordner Sie will unbedingt aus importieren. Diese package.json sollte wie folgt aussehen: {"name": "src"}, wobei "src" der Name dieses Ordners ist.

Sie können einfach X von 'src/X.js' importieren, genauso wie Sie normalerweise tun würden.

Source

Vielen Dank für die Unterstützung!

Answer 1

Haben Sie versucht, einen zu verwenden? Es werden nur Objekte in der Ansicht sowie einige Elemente im Voraus gerendert. Es sollte Ihnen den Leistungsschub geben, den Sie suchen. Für das Laden/Laden von Bildern verwenden Sie bitte ein Paket wie react-native-lazyload.