Índice del contenido[Esconder][Espectáculo]
- Entonces, ¿qué es una federación de módulos?
- ¿Por qué federación de módulos?
- Componentes principales de la federación de módulos
Características principales de la federación de módulos+-
- Excelente rendimiento web
- desarrollo efectivo
- La capacidad de autorreparación y redundancia
- Manejo efectivo de dependencias comunes
- En lugar de tener que volver a implementar consumidores, implemente código independiente.
- Cuando se ejecuta, importe el código de otras compilaciones.
- Experiencia de desarrollador mejorada mientras se preserva la experiencia del cliente
- Las micro-frontends operan de manera monolítica.
- Conclusión
El concepto de micro frontend aplica microservicios al desarrollo de frontend.
La idea es dividir la aplicación o el sitio web en piezas más pequeñas desarrolladas de forma independiente que luego se conectan durante el tiempo de ejecución, en lugar de crearlas como un único monolito cohesivo.
El método le permite crear otros componentes de la aplicación utilizando otras tecnologías y con equipos independientes.
La idea es reducir los gastos de mantenimiento relacionados con un monolito típico segmentando el desarrollo de esta manera.
Al permitirles concentrarse en un área particular de una aplicación como un equipo coherente, también hace posibles nuevas formas de cooperación entre los desarrolladores de backend y frontend.
Por ejemplo, puede tener un equipo que sea el único responsable de la capacidad de búsqueda u otro aspecto de un producto clave que es crucial para un negocio.
Gracias a la federación de módulos, tiene suficiente funcionalidad para manejar el flujo de trabajo que el interfaz micro enfoque de los mandatos.
Esta publicación analizará en profundidad la arquitectura de la federación de módulos, así como sus principales características y patrones de aplicación.
Por lo tanto, lo que es una federación de módulos?
El diseño de federación de módulos de Javascript utiliza partes reutilizadas en muchas aplicaciones.
Es una jerga bastante básica, pero simplemente hice que pareciera de esa manera para que pareciera alegre.
Como todos estamos familiarizados con el uso compartido de componentes dentro de una aplicación React, Module Federation logra efectivamente el mismo objetivo en la práctica, con la excepción de que expone dinámicamente los módulos de la aplicación para que los consuman otras aplicaciones.
La federación de módulos busca superar el problema de compartir módulos en un sistema distribuido entregando esos elementos clave compartidos como macro o micro según se desee.
Esto se logra eliminándolos de sus aplicaciones y del flujo de trabajo de compilación.
¿Por qué federación de módulos?
Aquí hay algunos factores que la federación de módulos puede manejar fácilmente:
- Externos y DLL (Bibliotecas de enlace dinámico) eran todo lo que ocasionalmente teníamos para compartir funcionalidad entre aplicaciones. Todo lo cual hizo que escalar el código compartido fuera extremadamente desafiante.
- NPM es lento.
- Cuando dos programas separados comparten código crucial, deben ser dinámicos y flexibles.
Para que las aplicaciones independientes estén totalmente en su propio repositorio, se implementen por separado y funcionen como su propio SPA independiente, se creó Module Federation.
Componentes principales de la federación de módulos
Antes de profundizar más, es importante discutir brevemente algunos conceptos nuevos que trae la federación de módulos.
- Host: cuando se carga una página, la compilación o el módulo inicializado inicialmente se denomina host. Un proveedor puede considerarse como un host.
- Remoto: un control remoto es una construcción diferente que usa una parte del host. También se conocen como clientes.
- Host bidireccional: una compilación de Webpack que funciona como un control remoto que consumen otros hosts y un host que consume controles remotos.
- Federación de proveedores: permite el uso compartido declarativo del tiempo de ejecución de las dependencias del módulo npm para un host o un control remoto, independientemente de la ubicación desde la que se carguen. Uno de los principales problemas de rendimiento con micro frontends se resuelve de esta manera.
Patrones de aplicación federada
Sistema de diseño de hoja perenne
Una de las formas más básicas de aplicaciones federadas es un "control remoto perenne", que es un control remoto compartido como un "Sistema de diseño" o "Biblioteca de componentes" que se distribuye y actualiza de forma independiente para todos los usuarios.
Sin que cada equipo de la aplicación deba dedicar tiempo a las revisiones, esto podría ser útil para garantizar que todos los sitios en línea se adhieran a la identidad corporativa más reciente.
Con el fin de diseñar e implementar los límites y procedimientos necesarios para garantizar actualizaciones continuas y seguras, este podría ser un lugar útil para que las empresas comiencen a considerar una arquitectura de aplicaciones federadas.
Los siguientes son algunos casos de uso en los que los controles remotos compartidos implementados de forma independiente podrían ser adecuados:
- Sistemas de diseño
- Conchas de aplicación
- Bibliotecas de componentes
- Clientes
- Juegos de herramientas compartidos
- Modelos de distribución alternativos para widgets utilizados por internos o externos
Uso compartido de módulos multi-SPA
Reutilice funciones ya exportadas, como componentes, en diferentes aplicaciones independientes de una sola página. Beneficios incluidos:
- Los consumidores reciben actualizaciones automáticas
- La experiencia en el dominio permanece en el equipo que está a cargo del mismo.
- Agiliza el procedimiento de implementación porque no son necesarios lanzamientos de módulos separados.
Federación impulsada por Shell
La federación impulsada por shell incluye:
- Al crear una nueva versión del producto, el equipo de Producto no espera a que el equipo de Pago complete su trabajo.
- Al cambiar de control remoto, no hay recarga de página.
- Cuando es necesario, Shell ofrece carga remota lenta y enrutamiento (nivel superior).
- El enrutamiento entre remotos es posible a través de la federación de proveedores, lo que permite la reutilización de paquetes npm de uso frecuente.
- Shell ofrece el marco y otras dependencias comunes que son reutilizadas por los controles remotos con carga diferida.
Federación multicapa
Similar a la federación impulsada por shell descrita anteriormente, pero usaba shells diferentes.
Contiene:
- un número de conchas
- Marca blanca
- No todos los controles remotos son requeridos por Shell B o tienen implementaciones independientes.
Características principales de la federación de módulos
Excelente rendimiento web
El problema con la composición normal del módulo NPM es que a medida que aumenta la cantidad de dependientes, el tamaño de la aplicación generalmente crece.
Para evitar cargar paquetes cuando se carga su aplicación y cargarlos solo cuando sea necesario, Module Federation le ofrece la posibilidad de cargar paquetes de forma diferida.
Esto evita la necesidad de descargar módulos antes de que realmente se necesiten, lo que mejora la velocidad del sitio.
desarrollo efectivo
Cada proyecto se puede producir y entregar de forma aislada y lo pueden llevar a cabo varios equipos porque Module Federation lo alienta a organizar su aplicación en proyectos discretos para que pueda compilarlos e implementarlos por separado (y, por lo tanto, en paralelo).
La capacidad de autorreparación y redundancia
Las dependencias compartidas permiten que Module Federation realice un seguimiento de todas las dependencias de su programa en un solo lugar.
De esta manera, incluso cuando una aplicación no declara una dependencia o cuando hay problemas de red, todavía sabe lo que necesita y puede descargarlo según sea necesario.
Manejo efectivo de dependencias comunes
Además, Module Federation ofrece una administración de dependencias superior, resolviendo de manera efectiva los requisitos de proveedores y terceros para que su aplicación nunca cargue más de una versión de una biblioteca.
En lugar de tener que volver a implementar consumidores, implemente código independiente.
El desarrollador está muy interesado en tener una funcionalidad perenne. Una vez que la funcionalidad dependiente expuesta haya cambiado, ya no será necesario volver a instalar los consumidores.
Debo admitir que esta es una característica muy potente en sí misma, que necesitará un examen cuidadoso para evitar resultados inesperados.
Cuando se ejecuta, importe el código de otras compilaciones.
Al adoptar el modelo de paquete NPM, podríamos considerar aplicaciones que usan la federación de módulos similar a las API en lugar de compartir código y pensar en una "biblioteca".
De la misma manera que también pueden recibir funcionalidad de otras aplicaciones, las aplicaciones web ahora pueden proporcionar la funcionalidad a otras aplicaciones.
Experiencia de desarrollador mejorada mientras se preserva la experiencia del cliente
Alquiler y venta Desarrollador de JavaScript se sentirá bastante cómodo con Module Federation porque es un complemento de Webpack al que se puede acceder a partir de la versión 5 de Webpack.
Esto es bastante fuerte e intrigante si lo pensamos un poco.
Al utilizar cargadores de Webpack de terceros, tenga en cuenta todos los componentes que Webpack paquetes, incluidos scripts, activos, estilos, imágenes, rebajas y más.
Mediante el uso de la federación de módulos, todos estos se pueden compartir y federar.
Las micro-frontends operan de manera monolítica.
Es bastante fácil agregar funcionalidad compartida a su aplicación; simplemente importa el paquete como de costumbre o usa la carga síncrona.
Alternativamente, la carga asincrónica se puede usar para cargar solo las dependencias cuando sea necesario utilizando la carga diferida.
Conclusión
En esta publicación, hemos discutido Module Federation como una opción fantástica para desarrollar su aplicación micro-frontend.
Permitir que las aplicaciones intercambien y consuman funcionalidades en tiempo de ejecución fomenta la escalabilidad al permitir que varios equipos trabajen en aplicaciones independientes.
Cuando cambie la funcionalidad común, no necesitará diseñar e implementar sus consumidores, ya que es compatible con la funcionalidad perenne.
Su programa funcionará como un monolito después de que se haya configurado, lo cual es fantástico.
Las dependencias compartibles se utilizan para reducir el tamaño de las aplicaciones. Dado que muchos desarrolladores ya están familiarizados con el entorno Webpack, la experiencia del desarrollador es excelente.
Deje un comentario