Salir de AngularJS: ¿Angular o React?

Angular y React son opciones sólidas y bien mantenidas. La correcta depende de tu equipo, tu código y tu empresa. Esta guía te entrega criterios que puedes aplicar sin tomar partido.

Una nota sobre mi sesgo

La mayor parte de mi trabajo es de AngularJS a Angular, así que pondera mi opinión con eso en cuenta. Intenté escribir los criterios de modo que puedan llevar a cualquiera de las dos respuestas.

De qué no depende la elección

• Benchmarks. Para aplicaciones de negocio, ambos son lo bastante rápidos. Las pantallas lentas suelen venir de la carga de datos y del código de la aplicación.
• El nombre. Angular moderno es un framework distinto de AngularJS. Se reescribió desde cero. Pasar a Angular es una migración, igual que pasar a React.

Los criterios que importan

1. Lo que tu equipo sabe

El framework que tus desarrolladores ya usan bien es el más barato. Si la empresa tiene varios productos en React y una librería de componentes compartida, sumar una sola app en Angular crea una isla. Lo mismo vale al revés.

Si el equipo solo conoce AngularJS, ambos destinos exigen aprender. Angular se va a sentir más familiar en sus conceptos: servicios, inyección de dependencias, templates con directivas, módulos de funcionalidad. React pide otra forma de pensar el estado y el renderizado.

2. Cómo se traduce tu código actual

Las apps AngularJS se organizan alrededor de servicios, inyección de dependencias y templates HTML.

• Hacia Angular. Los servicios pasan a ser servicios de Angular. Los templates se reescriben con una sintaxis que sigue ideas parecidas. La estructura de la app se conserva en gran parte.
• Hacia React. Los servicios necesitan un nuevo lugar: hooks, context o una librería de estado. Los templates pasan a JSX. La app se rediseña tanto como se traduce.

Mientras más lógica de negocio tenga tu app en servicios, más favorece este criterio a Angular. Si casi toda la lógica está en el backend y el frontend es delgado, pesa menos.

3. El camino de migración

• Angular tiene herramientas oficiales de upgrade que ejecutan AngularJS y Angular en una sola aplicación y comparten servicios entre ambos. Las pantallas se mueven de a una. Revisa Cómo migrar de AngularJS a Angular sin downtime.
• React no tiene un puente oficial desde AngularJS. La migración incremental igual es posible: los componentes React se pueden montar dentro de directivas AngularJS con wrappers de la comunidad o con un poco de código propio, y las rutas completas se pueden cambiar en el borde. Construyes por tu cuenta una parte mayor de la capa de convivencia.

En una app grande que debe migrarse de forma incremental, verifica este punto con un piloto antes de decidir.

4. Cuánto decide el framework por ti

Angular trae router, formularios, cliente HTTP, inyección de dependencias y una herramienta de línea de comandos, todo publicado en conjunto. React es una librería de renderizado. Tú eliges el router, la librería de formularios, la capa de datos y muchas veces un meta-framework.

• Si quieres un conjunto estándar y menos decisiones, Angular lo entrega.
• Si quieres armar el stack a tu medida, o ya tienes librerías preferidas, React da esa libertad.

5. La contratación en tu mercado

Revisa tu propio mercado. Pregunta a tu equipo de selección cuántos candidatos ven para cada framework, con qué seniority y a qué costo. La respuesta cambia según el país y la industria, y es el único dato que aplica a tu caso.

6. Componentes de terceros

Lista los widgets de los que depende tu app: grilla de datos, gráficos, manejo de fechas, texto enriquecido. Verifica que cada uno tenga una opción mantenida en el framework de destino. El índice de migración de librerías cubre el lado de Angular. Haz el mismo ejercicio para React antes de decidir.

Una tabla de decisión

Cómo decidir sin una discusión eterna

1. Anota los criterios de arriba y asigna a cada uno un peso para tu empresa.
2. Puntúa ambas opciones con las personas que van a mantener el código.
3. Si el resultado es parejo, construye la misma pantalla pequeña en los dos, dentro de la app actual. Compara el esfuerzo, la convivencia con AngularJS y cómo se sintió el equipo.
4. Decide una vez y deja escritas las razones. Reabrir la elección a mitad de la migración sale caro.

Elijas lo que elijas

El método es el mismo con cualquiera de los dos destinos: inventario, piloto, fases incrementales y limpieza. El mapeo concepto por concepto del camino hacia Angular está en la referencia de AngularJS a Angular. El mantenimiento posterior a la migración se cubre en después de la migración.

Más en esta sección

• Migrar una app con mucho jQuery a un framework de componentes
• Migrar aplicaciones Backbone, Knockout y Ember antiguas
• Migrar AngularJS que vive dentro de ASP.NET MVC
• Migrar AngularJS que vive dentro de Java y JSP