React Native è un framework open source creato da Meta Platforms, Inc. utilizzato per sviluppare applicazioni per Android, Android TV, iOS, macOS, tvOS, Web, Windows e UWP e consente agli sviluppatori di utilizzare il framework React insieme alle funzionalità della piattaforma nativa. Viene anche utilizzato per sviluppare applicazioni di realtà virtuale presso Oculus.
Scrivi in JavaScript e render in codice nativo
Le primitive React eseguono il rendering nell’interfaccia utente della piattaforma nativa, il che significa che la tua app utilizza le stesse API della piattaforma nativa di altre app.
Con React Native è possibile creare versioni specifiche di un’applicazione in modo che un singolo codebase possa condividere il codice tra varie piattaforme. Con React Native, un team può gestire più piattaforme e condividere una tecnologia comune: React.
I componenti di React racchiudono il codice nativo esistente e permettono l’interazione tra i componenti React e JavaScript con le API native. Ciò consente lo sviluppo di app native per team di sviluppatori completamente nuovi e può consentire ai team nativi esistenti di lavorare molto più velocemente.
Architettura
Nell’architettura attuale, quando viene eseguita un’applicazione React Native, il codice JavaScript viene raggruppato in un pacchetto chiamato JS Bundle e il codice nativo viene tenuto separato. Il thread JavaScript esegue il pacchetto JS e il thread nativo/UI esegue i moduli nativi e gestisce il rendering dell’interfaccia utente.
La migliore interoperabilità tra React Native e le viste host è abilitata dal core C++, che è condiviso tra diverse piattaforme host e consente a React Native di eseguire il rendering delle superfici React in modo sincrono.
La pipeline di rendering avviene in tre fasi:
- La fase di Render
- La fase di Commit
- La fase di Mount
Esaminiamo ciascuno di essi più da vicino.
Corso React Native, dacci un’occhiata!
La fase di Render
In questa fase, React esegue la logica per creare alberi di elementi React, che consistono in React Element. Un React Element è un semplice oggetto JavaScript che descrive cosa dovrebbe apparire sulla schermata dell’applicazione.
La fase di Commit
Il motore di layout multipiattaforma Yoga è estremamente importante nella gestione delle operazioni che si verificano durante la fase di commit che consiste in due operazioni: calcolo del layout e promozione dell’albero.
Il calcolo del layout calcola la posizione e la dimensione di ciascun nodo ombra di React. Ciò si ottiene invocando Yoga per calcolare il layout di ciascun nodo ombra di React.
La fase di Mount
Questa è la fase in cui il React Shadow Tree (che contiene i dati del calcolo del layout) viene trasformato in un host view tree con pixel renderizzati sullo schermo. Il renderer Fabric crea una vista host corrispondente per ogni nodo shadow di React e la monta sullo schermo.
In conclusione
Questa vuole essere solo un’infarinatura di cos’è React con un piccolo accenno alla sua architettura. Se vuoi saperne di più mettiti in contatto con LaraMind per accedere a uno dei nostri corsi.
Dai un’occhiata al catalogo corsi LaraMind e inizia una formazione di livello avanzato!
