Microfrontends en Sistemas Críticos de Aviación

Mi nombre es Jared, y soy líder técnico en AWS SafeKit. Hoy vamos a hablar un poco sobre microfunciones y sistemas de aviación críticos para la seguridad. AWS SafeKit es líder mundial en software de control de aeropuertos y sistemas de guía visual de atraque, y el software del que hablaremos hoy gestiona toda la operación de un aeropuerto desde la llegada hasta la salida, incluyendo el seguimiento en tiempo real de la posición de las aeronaves, la planificación de puertas y posiciones y la integración con todos los sistemas principales para proporcionar una única fuente de verdad. Los aeropuertos están conectados entre sí, al igual que los nodos de una red, y si un nodo es lento o falla, hay un efecto dominó para cada nodo siguiente. Además, el tráfico aéreo se duplica cada 15 años, creciendo a una tasa anual del 4.4%. Se espera una escasez de capacidad del 50% para 2035 en la mitad de los aeropuertos del mundo si no tomamos ninguna medida. Esto significa en última instancia que 237 millones de pasajeros no podrán volar para 2035. Así que abróchense los cinturones, siéntense y disfruten del vuelo. Un poco sobre AWS SafeKit. Somos más de 1,200 empleados en 38 oficinas repartidas por todo el mundo, y trabajamos con más de 2,700 aeropuertos. Yo mismo, he estado divirtiéndome con code durante 13 años. Empecé con mucha robótica, luego pasé a aplicaciones web y móviles, luego obtuve un título en ingeniería informática, y he estado con AWS SafeKit durante los últimos cinco años en diversos roles técnicos. Un dato curioso, en realidad me mudé de Estados Unidos a Suecia hace tres años. Así que ahora que hemos terminado algunos de los controles previos al vuelo, es hora de despegar.

Comenzamos nuestro viaje con un poco de historia. Nuestra pila de aplicaciones actual ha pasado por algunas reestructuraciones importantes. Comenzamos con un monolito muy simple, un backend en C++ y un frontend en Qt. Comenzamos a tener más demanda de aplicaciones con más funciones y soluciones integradas. Así que, en última instancia, nos mudamos a la web, introdujimos Angular y otros equipos comenzaron a construir nuevos productos en la misma tecnología, y encontramos muchas sinergias en esos productos. Pero con cada vuelo, siempre hay posibilidad de turbulencias. Así que si volvemos a ese monolito tradicional, todos conocemos esta imagen, equipos contribuyendo código en una única base de código. Y llegará un punto en el que es una buena idea separar estas cosas. Tienes un frontend y un backend, tienes una mejor separación de preocupaciones y aceleras tu desarrollo. Y es posible que llegues a un punto en el que el backend crezca tanto que introduzcas microservicios, un concepto muy popular. Y para nosotros, así es como hemos desarrollado productos durante años. Tenemos muchos microservicios separados de las cosas. Pero un día llegas al trabajo y te hacen una pregunta realmente interesante, una pregunta realmente compleja. ¿Podemos tomar 60 de estos diferentes productos y combinarlos en una sola aplicación web? Y para nosotros, los desarrolladores, eso significaba que teníamos 46 aplicaciones y 22 bibliotecas distribuidas en 20 repositorios. Aún peor, estamos repartidos por toda Europa. Tenemos desarrolladores en Suecia, Austria, Alemania, Polonia y el Reino Unido. Y cuando miras por primera vez el problema, es posible que te imagines algo como esto, donde tienes muchos servicios backend y un frontend gigante. Parece realmente aterrador. Afortunadamente, al igual que una aeronave, hay instrumentos y controles que podemos utilizar para facilitarnos la vida. Entonces, la gran pregunta, ¿qué son las microfunciones? Por supuesto, naturalmente es solo una extensión de la arquitectura de microservicios al frontend. Y lo que eso significa es que tomamos nuestros componentes o grupo de componentes y los colocamos en paquetes independientes y luego los combinamos durante la ejecución para crear una sola aplicación en el navegador. Es importante tener en cuenta que esto es independiente del framework. Puedes tener una aplicación React, Vue o Angular ejecutándose en el mismo navegador al mismo tiempo. Es difícil hablar de microfunciones sin mencionar la federación de módulos de Webpack. Y este es el modelo mental original que realmente popularizó la idea de las microfunciones. Te permite tomar compilaciones separadas de Webpack y formar una sola aplicación. Y facilita la carga de estos módulos remotos de forma asíncrona durante la ejecución. Para ti, puede parecer una carga diferida. Y también proporciona mecanismos para gestionar diferentes dependencias entre diferentes compilaciones y tener un tamaño de paquete optimizado.

Si no estás utilizando Webpack, hay otras opciones como la federación nativa. Y esto es una implementación nativa del navegador de la idea de la federación de módulos. Y esto realmente puede ser utilizado con cualquier framework o herramienta de compilación. Algunas otras opciones, los componentes web han estado presentes durante bastante tiempo, al igual que los iframes. Incluso podrías hacer la orquestación en JavaScript tú mismo. Ahora, para nosotros en particular, para gestionar todo esto, utilizamos un monorepositorio con índice. Y el índice proporciona un sistema de compilación extensible, te permite utilizar herramientas modernas como Cypress, Jest, Prettier de manera estándar en todas las aplicaciones de tu repositorio. Y proporciona un entorno integrado para desarrollar aplicaciones con frameworks populares como Angular, React, Node.js, lo que facilita la gestión del intercambio de código y minimiza la redundancia.

Todo esto se combina con características interesantes como el almacenamiento en caché computacional, el comando efectivo, la generación de código, que agilizan la experiencia del desarrollador y el proceso. Ahora que conocemos las herramientas, instrumentos y controles, creo que estamos listos para navegar. Así que, si volvemos a esa imagen realmente aterradora, tenemos este enorme frontend y todos estos servicios backend. Pero lo que queremos es algo como esto donde todo esté separado. Y aún podemos lograrlo entregando una sola aplicación web utilizando microfunciones, donde envolvemos estos componentes individuales basados en características en una aplicación principal. Y si lo haces bien, podría verse algo como esto donde tenemos un menú con muchas opciones. Y cada una de estas opciones en el menú es en realidad un frontend construido de forma independiente. Algunos de los beneficios de las microfunciones incluyen actualizaciones incrementales. Puedes descomponer tu aplicación pieza por pieza, introducir nuevas tecnologías, frameworks, paquetes y mantener tu velocidad mientras te ocupas de la deuda técnica. También obtienes una gran independencia en el despliegue. Tus aplicaciones están desacopladas y tienes menos posibilidades de sufrir impactos negativos de otros equipos. Y todo esto se combina para permitir la autonomía del equipo. No tienes que coordinarte tanto entre ellos y ganas libertad para elegir las herramientas y frameworks que deseas utilizar. Ahora, junto con los beneficios, también hay desventajas. Puedes tener un rendimiento deficiente si no está bien diseñado. Puedes tener tamaños de paquete muy grandes. Puedes aumentar la carga de trabajo en el navegador. Por lo tanto, debes tener mucho cuidado en cómo estás orquestando esto durante la ejecución. También puedes tener problemas con los estilos. Diferentes equipos están utilizando enfoques de estilización diferentes. Esto podría generar conflictos y llevar a una interfaz de usuario inconsistente. Y, por supuesto,