D'une application à une centaine. Le chemin du microfront vers Tinkoff Business

Bonjour, je m'appelle Vanya, j'ai récemment pris la parole à CodeFest 11 , où j'ai parlé du chemin parcouru par Tinkoff Business sur le frontend d'une application à une centaine. Mais comme tout change très vite en informatique, et qu'il faudra attendre longtemps pour l'enregistrement, je vais maintenant vous raconter brièvement notre voyage de six ans dans le monde merveilleux du microfront !





. . — , .





  1. AngularJS 2014—2015 .





  2. Angular2.





  3. .





  4. 100 .





2015 . : « ! , , ». AngularJS, . , . - .





, 2017 . , . — «». , , — , , .





2017—2018 , , .





-, 3—5 , 25 ! : - , ! - ! .





- , , .





. .





.





, . , , . , .





iframe , . . , «» .





Zone en surbrillance - application de barre latérale autonome

Frame Manager

Frame Manager' ( ).





Zone en surbrillance - application Frame Manager autonome
– Frame Manager

, iframe, .





Gauche - concept de barre latérale (anciennement), droite - Frame Manager'a (maintenant)
– (), – Frame Manager' ()

, , . , , window. , , .





:





  • - index.html.





  • .





— iframe, - . 





: « Google Chrome, . , !» : - — . . , , , -, . , , , iframe src . , , .





-

: « iframe. ? !» — . - — , , ;-) 





— . , :





— :





  1. Webpack- — , .





  2. Angular builder — .





  3. Angular schematics — AST.





2021 , Webpack 5 Module Federation, , 2018 , Angular , 12 2021 . , MF , .





, iframe, Single SPA. , Angular .





https://single-spa.js.org/docs/ecosystem-angular/
https://single-spa.js.org/docs/ecosystem-angular/

, , .





Angular builder schematics, , , , , :





ng update @scripts/deframing
      
      



, . .





, , . :





  1. . , , .





  2. , : , , . - (stub), — . .





, . : .





— «» , . , :





.my-pretty-header {
    display: none;
}
      
      



- , !





: , , :





id , .





— , , :





, . .





Microzord

. , ? npm scope @microzord



.





— Angular, . , , .








All Articles