React Native

En el Radar compartido: Adopt (valoración de la edición aportada).

Cómo funciona

Combina lógica JavaScript con componentes nativos y APIs de dispositivo. La New Architecture incorpora mecanismos como JSI y Fabric; Expo aporta herramientas adicionales de desarrollo y distribución.

Ejemplo de uso

Compartir una pantalla de movimientos y su acceso a datos, adaptando navegación, permisos y autenticación biométrica según el sistema. Probar accesibilidad en dispositivos reales.

Piezas de la New Architecture

Pieza	Función
JSI	Interfaz C++ que permite llamadas directas entre JS y nativo, sin serializar por un puente
Fabric	Nuevo sistema de renderizado, con soporte para funciones concurrentes de React
Turbo Modules	Módulos nativos cargados bajo demanda y con tipos generados
Hermes	Motor JavaScript optimizado para móviles (por defecto)

Es la arquitectura por defecto en las versiones actuales. Antes de actualizar, verifica que las librerías nativas de las que dependes la soportan.

Expo y EAS

Servicio	Uso
Expo SDK	Módulos de cámara, archivos, notificaciones, biometría, almacenamiento seguro…
Expo Router	Rutas por archivos, deep links y navegación nativa
Development builds	App de desarrollo con tus módulos nativos
EAS Build	Compilación en la nube para iOS y Android
EAS Submit	Envío a App Store y Google Play
EAS Update	Actualizaciones over-the-air del código JavaScript

Las actualizaciones OTA solo pueden cambiar JavaScript y recursos; cambios nativos exigen una nueva versión en la tienda, y deben respetar las políticas de cada tienda.

Seguridad en una app financiera

import * as SecureStore from 'expo-secure-store';
import * as LocalAuthentication from 'expo-local-authentication';

async function desbloquear() {
  const ok = await LocalAuthentication.authenticateAsync({
    promptMessage: 'Confirma tu identidad',
  });
  if (!ok.success) return null;
  return SecureStore.getItemAsync('refresh_token'); // Keychain (iOS) / Keystore (Android)
}

Riesgo	Medida
Tokens en AsyncStorage (sin cifrar)	Almacenamiento seguro del sistema
Secretos en el bundle JS	Nunca: el bundle se puede extraer y leer
Interceptación de tráfico	TLS estricto y, si el riesgo lo justifica, certificate pinning
Dispositivos comprometidos	Señales de integridad (Play Integrity, App Attest) en el backend
Capturas de pantalla con datos	Bloquear capturas en pantallas sensibles

Rendimiento

• Listas largas con FlashList o FlatList bien configurada (keyExtractor, tamaños estables).
• Animaciones en el hilo de UI con Reanimated.
• Imágenes optimizadas y cacheadas (expo-image).
• Medir en dispositivos de gama baja, no solo en simuladores o teléfonos de desarrollo.

Reutilización con la web

Se puede compartir lógica (validaciones, clientes de API, estado) con una aplicación React web mediante un monorepo (pnpm, Turborepo). Compartir componentes visuales es posible con React Native Web, pero la navegación y los patrones de interacción móviles suelen merecer diseño propio. Una alternativa para variar pantallas sin publicar es server-driven UI.

Criterios de implementación

Validar bibliotecas nativas y requisitos de rendimiento. Planificar actualizaciones, publicación en tiendas y funciones específicas que puedan requerir código nativo.