Angular 2的架構讓它有可能使用多種渲染引擎來渲染應用，其中包括React Native。
為Angular 2的基礎架構做出的決定中有一個是將框架分為兩個層級：一層是核心，其處理組件，指令，過濾器，服務，路由，修改檢查，DI和 I18n；另一層是渲染引擎，其處理DOM，CSS，動畫，模板，web組件，自定義事件等等。核心可以在獨立的進程中執行，這樣就將其從界面中解耦出來，而且在核心有很多的任務要處理時，這樣可以讓界面的響應更快。關于這個決定的詳細內容可以在Angular 2渲染架構文檔中找到。
傳統上渲染一個Angular.JS應用是通過DOM在瀏覽器中完成的，但是現在有可能通過其他的渲染引擎來渲染應用，包括桌面的或者移動端的原生渲染引擎，甚至還有服務器端。Angular 2渲染一文中更加仔細地解釋了如何使用不同的渲染引擎來完成此工作。
從主應用中將渲染獨立出來有多種益處。據Google的工程師主管Brad Green說，Angular 2應用可以運行在Node.js上，而且速度相當快。“你可以在此環境下運行Photoshop，所以為何不呢？”，Node.js提供了文件系統，進程和硬件所需的入口。而且，Angular 2可以通過Angular Electron運行在桌面上，或者在微軟的UWP上。
在移動設備端，Angular 2提供了一些選擇項比如Ionic 2，NativeScript或者React Native。對于最后一個，有個庫使得用React Native渲染Angular 2應用變得有可能。開發者可以調用所有React Native提供的API和polyfill來使用iOS和Android的原生功能，然后回調可以按需在Angular Zone中執行。據Marc Laval所說，原生移動開發和web開發很類似，除了是使用不同的組件而不是HTML和CSS提供的那些：
通用組件：Image，Picker，RefreshControl，ScrollView，Switch，Text，TextInput，View，WebView
Android特定組件：DrawerLayout，PagerLayout，ProgressBar， Toolbar
iOS特定組件：ActivityIndicator，DatePicker，MapView，Navigator，ProgressView，SegmentedControl，Slider，TabBar
應用風格是按照React Native的風格，手勢是由Hammer.js處理的。Laval在下圖中詳細說明了一個React Native + Angular 2應用的架構：
他解釋說：
技術上來說，一個React Native應用運行了三個線程。主要的一個是JS線程，在這里所有的JS代碼可以被執行；它控制了整個應用。其它兩個線程運行著應用的原生的部分：標準主UI線程，和一個“shadow”線程用來測量和布局。
原生和JS這兩塊通過一個橋雙向通信。這意味著有Bridge JS API來獲取原生的功能特性（網絡，地理位置，剪貼板等等）而且可以操作原生的元素，然后原生的事件被傳回到JS模塊。
在不久的將來，Angular 2的團隊計劃創建一個新的動畫模塊，而React Native的團隊打算在原生端獲得更優的性能，而且Facebook會支持UWP。
京公網安備 11010502049343號