Nachdem wir nun wissen, was
React Native ist, werfen wir einen kurzen Blick hinter die Kulissen.
Wie ich bereits erwähnt habe, erstellen wir mit React und React Native eine App, und unser Code sieht normalerweise
so aus.
Wir erstellen normale React-Komponenten, wie Sie sie aus dem Web kennen, mit Javascript, da Javascript die
Sprache ist, in der wir React
Native-Apps erstellen. Dort verwenden wir jedoch spezielle Komponenten wie Ansicht und Text.
Dies sind keine normalen HTML-Elemente, da die normalen HTML-Elemente nicht unterstützt werden. Die
nativen Plattformen wissen nicht, wie sie verwendet werden sollen. Daher verwenden Sie spezielle Komponenten, die Sie
von React Native erhalten haben und für die React Native sie in Anweisungen übersetzen kann
Die nativen Plattformen verstehen das. So funktioniert das also.
Jetzt ist es wichtig zu verstehen, dass Ihre Ansichten, also die Komponenten, mit denen Sie arbeiten, letztendlich zu echten
nativen Widgets, zu echten nativen Elementen und zu echtem nativem Code kompiliert werden. Ihr Javascript-Code, in dem Sie Ihre Geschäftslogik verwalten,
wird nicht kompiliert, Ihre Ansichten jedoch, und das bedeutet natürlich auch, dass Sie
beim Erstellen von React Native-Apps normalerweise eine hervorragende Leistung erzielen, da das Ergebnis eine echte
native App ist, in der ein großer Teil der Code ist echter nativer Code.
Wenn wir uns diese Komponente genauer ansehen, ist es wichtig zu verstehen, dass Sie React
natürlich zum Erstellen von Web-Apps verwenden können, aber dass Sie auch native Apps für Android und iOS mit nativem
Code erstellen können, also ohne React Native oder Sie kann React Native verwenden, daher gibt es vier verschiedene
Möglichkeiten, Apps zu erstellen, bei denen React for the Web uns natürlich keine native App bietet, sondern nur
um zu vergleichen, wie dies zusammenhängen würde.
Wenn Sie also React for the Web verwenden, arbeiten Sie normalerweise mit einem Div, um Ihre Inhalte zu strukturieren.
Wenn Sie direkt mit Android
arbeiten und Ihre App in Android Studio ohne React Native erstellen würden, würden Sie beispielsweise mit
einer Android-Ansicht arbeiten, die ein Widget ist, das Sie dort in der von Ihnen erstellten
Benutzeroberfläche verwenden können direkt mit nativen Plattformfunktionen zur Strukturierung Ihrer Inhalte. Unter iOS wäre dies das UI-Ansichts-Widget, und Sie müssen sich diese
Begriffe nicht merken. Ich
möchte nur erklären, wie React Native die Dinge für Sie übersetzt, da Sie in
React Native-Apps das Ansichtselement tatsächlich verwenden.
Wenn Sie sich dieses Ansichtselement ansehen, sehen Sie natürlich, dass es dem div-Element
sehr ähnlich ist. Es
sieht aus wie ein HTML-Tag. Der Unterschied besteht natürlich darin, dass es mit einem Großbuchstaben beginnt
und diese Ansicht kein HTML-Tag ist Der Browser würde nicht wissen, was mit einer Ansicht zu
tun ist, aber React Native tut dies und React Native übersetzt diese Ansicht für Sie in die Android-Ansicht oder in
die UI-Ansicht, und dies natürlich nicht nur für diese Ansicht, sondern auch für die allgemeine Wrapper-Komponente Wenn Sie
beispielsweise Benutzereingaben abrufen, tun Sie dies im Web mit dem Eingabeelement. Wenn Sie eine
native Android-App erstellen, verwenden Sie Text bearbeiten. Für eine native iOS-App verwenden Sie ein UI-Textfeld und
in React Native gibt es die Texteingabekomponente. Wieder kompiliert React Native diese für Sie in die nativen Widgets,
und so funktioniert React Native hinter den Kulissen. Natürlich interessiert uns das Web in diesem Kurs hier nicht,
nur damit Sie verstehen, dass es einige Ähnlichkeiten gibt, verwenden wir diese Tags, die wie HTML-Tags aussehen, aber natürlich besteht der wichtige Unterschied
darin, dass es sich um spezielle Komponenten handelt, die kompiliert wurden zu nativem Code. Wie ich bereits erwähnt habe, ist es wichtig zu
verstehen, dass React Native für die Benutzeroberfläche spezielle Komponenten bietet, die dann für Ihre
andere Logik zur nativen Verwendung
kompiliert werden. Wenn Sie also Redux verwenden oder über eine Geschäftslogik verfügen, Wenn Sie
HTTP-Anforderungen senden, transformieren Sie Daten. Der gesamte andere Javascript-Code wird nicht in nativen Code kompiliert, sondern in einem speziellen Thread
ausgeführt, der von React Native gehostet wird. Sie können sich also Ihre React Native-App vorstellen,
die Sie am Ende als echte native App erhalten, da alle Ansichten zu nativen
Widgets kompiliert wurden, Ihre App jedoch eine zusätzliche Mini-App enthält, ein Mini-Javascript Die App wird dort ausgeführt, sozusagen von React
Native gehostet und gestartet. Sie führt Ihren gesamten Javascript-Code aus und Ihr Javascript-Code kann dann mit der nativen
Plattform kommunizieren.
Sie können sich das hier so vorstellen, Sie haben Ihren Code, Ihre App und Sie erstellen eine native
App, die auf einer nativen Plattform ausgeführt wird, und natürlich stehen Ihnen dort bestimmte Plattformfunktionen zur
Verfügung, beispielsweise mit einer Gerätekamera.
Wie bereits erwähnt, kann Ihr Code hier in zwei Dinge unterteilt werden - Ihre Ansichten
und Ihre Geschäftslogik, also den anderen Javascript-Code. Wie bereits mehrfach erwähnt, werden Ihre Ansichten
zu nativen Ansichten und nativen Widgets für diese Plattformen kompiliert. Ihr Code wird jedoch als Javascript-Code beibehalten, und Sie können auf native Plattformfunktionen
wie die Kamera zugreifen, da Ihr Javascript-Code in einer speziellen virtuellen Ausführung ausgeführt wird Maschine, die am Ende
von React Native in Ihrer App hochgefahren und gehostet wird. Der richtige Teil hier
befindet sich also in unserer nativen App, die wir an die App Stores liefern, und dieser Javascript-Code,
diese virtuelle Javascript-Maschine, kann sprechen zu den nativen Plattformfunktionen, also zu dem Betriebssystem, auf dem
Ihre App am Ende über eine spezielle Brücke läuft, die Sie
sagen könnten, und diese Brücke und diese virtuelle Maschine, die alle automatisch von React Native bereitgestellt werden.
Sie müssen sich nicht
darum kümmern, alles, was Sie tun, ist, Ihre React Native-App mit Javascript und diesen speziellen Komponenten zu schreiben, und das ist alles, was Sie
vorerst wissen müssen. So funktioniert
eine React Native-App hinter den Kulissen und ich Es ist wichtig, sich dessen bewusst zu sein, da es einen Teil der
Magie im positiven Sinne wegnimmt, weil Sie verstehen, was Sie tatsächlich schreiben und was mit Ihrem Code passieren wird und wie
dieser Code in einer nativen App landet und natürlich Sie verstehen auch, dass Sie
daher am Ende eine echte native App haben. Nicht Ihr gesamter Code ist kompiliert, das
wäre ziemlich
unmöglich, aber Ihre Ansichten werden kompiliert, und natürlich sind die Ansichten, also der Teil, den der Benutzer
sieht, der wichtigste Teil, wenn es um die Leistung einer App geht, da die Benutzeroberfläche neu gerendert
wird und all das, das ist
normalerweise der leistungsintensive Teil und daher ist es sehr gut, dass dies kompiliert wird und
das ist eine der großen Stärken von React Native.