Hot Reloading in React Native

Rana Hasnain Khan 18 April 2022
Hot Reloading in React Native

Wir werden Arten des Nachladens in React Native und die Vor- und Nachteile des Live- und Hot-Nachladens in React Native vorstellen.

Arten des Neuladens in React Native

Die zwei Arten des Nachladens sind Live-Nachladen und Heiß-Nachladen. React Native unterstützt sowohl Live- als auch Hot-Reloading, obwohl sie unterschiedlich sind.

Live-Neuladen in React Native

Beim Live-Neuladen können unsere Änderungen kompiliert und gelesen werden, indem dem Simulator eine neue Datei bereitgestellt wird, die die App automatisch von Anfang an liest.

Hot Reloading in React Native

Es basiert auf Hot Module Replacement (HMR). Der Prozess des Hot-Reloading unterscheidet sich vom Live-Reloading. Es liest nur die von uns vorgenommenen Änderungen und lädt die Komponente dort neu, wo sie vorgenommen wurden. Die Anwendung muss die App nicht von Anfang an lesen, sie bleibt jedoch im selben Zustand.

Der Hauptvorteil des Hot Reloading liegt in der Fähigkeit des Hot Reloading, die Änderungen im Quellcode so zu sanktionieren, dass wir die Codeänderungen anzeigen können, selbst wenn wir nicht die gesamte Anwendung neu kompiliert haben.

Wenn wir also zwei oder mehr Fenster für den Code und den Anwendungsbildschirm geöffnet haben, können wir die Ergebnisse sofort sehen, nachdem wir die Änderungen im Code vorgenommen haben. Heißes Nachladen verkürzt die Wartezeit drastisch.

Ein weiterer Vorteil des Hot Reloading besteht darin, dass wir, wenn wir eine Seite vier oder fünf Navigationen entfernt bearbeiten, nicht navigieren müssen, während wir die Änderungen sehen, die wir auf dieser Seite vornehmen.

Hot-Reloading-Funktion in React Native aktivieren

Zuerst müssen wir unsere App auf dem Gerät oder dem Emulator starten, indem wir den folgenden Befehl in React Native verwenden.

# react native
react-native run-android

Dann müssen wir auf den Emulator klicken und CTRL+M drücken oder unser Android-Gerät schütteln, auf dem die Anwendung läuft.

Dann wird ein Popup mit einer Option zum Aktivieren des Hot Reloading angezeigt.

Rana Hasnain Khan avatar Rana Hasnain Khan avatar

Rana is a computer science graduate passionate about helping people to build and diagnose scalable web application problems and problems developers face across the full-stack.

LinkedIn

Verwandter Artikel - React Native