1. Что такое React Native

React Native — это фреймворк от Meta (Facebook) для создания нативных мобильных приложений с использованием JavaScript и React. Одна кодовая база — два приложения: iOS и Android.

Как это работает

React Native не использует WebView (как Cordova/PhoneGap). Вместо этого JavaScript код выполняется в отдельном потоке и общается с нативным кодом через Bridge (старая архитектура) или JSI — JavaScript Interface (новая архитектура).

[JavaScript Thread]  ←→  [Bridge / JSI]  ←→  [Native Thread (iOS/Android)]

Старая архитектура (Bridge)

• Асинхронная коммуникация через JSON сообщения
• Узкое место: сериализация/десериализация данных
• До 2022 года — основная архитектура

Новая архитектура (JSI + Fabric + TurboModules)

• JSI: прямой вызов нативных функций из JS без сериализации
• Fabric: новый движок рендеринга (синхронный, поддерживает Concurrent React)
• TurboModules: ленивая загрузка нативных модулей
• Включена по умолчанию в React Native 0.74+

React Native vs Альтернативы

	React Native	Flutter	Nativе (Swift/Kotlin)
Язык	JavaScript/TypeScript	Dart	Swift / Kotlin
UI	Нативные компоненты	Свои виджеты (Canvas)	Платформенные
Производительность	Отличная	Отличная	Максимальная
Размер экосистемы	Огромный (npm)	Растёт	Отдельные
Переиспользование кода	iOS + Android	iOS + Android + Web	Нет
Компании	Meta, Microsoft, Shopify	Google, Alibaba	Apple, Google

Кто использует React Native

• Facebook / Meta — Facebook, Instagram
• Microsoft — Teams, Xbox apps
• Shopify — мобильное приложение
• Discord — мобильный клиент
• Coinbase — криптовалютный кошелёк

Жизненный цикл приложения

Запуск → Metro Bundler → JS Bundle → Hermes Engine → JSI → Native Renderer → UI

Hermes — движок JavaScript, оптимизированный для мобильных устройств. Компилирует JS в байткод заранее (AOT), ускоряя время запуска приложения на 40-50%.

Интерактивный пример

Вот как выглядит базовый React компонент vs React Native компонент: