Issue 42 Didi Chuxing Small Program Volume Optimization Practice & Advanced TypeScript Application in Model & Micro Front End Practice in Meituan Delivery Group
Posted Jun 15, 2020 • 2 min read
The micro front end is a solution that uses the split of widgets to achieve project split management, which can solve problems such as project expansion and difficulties in development and maintenance. As the front-end business scenario becomes more and more complicated, the concept of micro front-end has been mentioned more and more recently, and many teams in the industry have begun to explore and practice and have landed in the business. It can be seen that many teams have encountered various problems, but they also have different solutions.
In the second half of 2019, in order to migrate the Didi travel of the WeChat wallet/Alipay Jiugongge entrance into a small program, the team performed a large number of function upgrades and completions on the small program. In the whole process, a series of problems and challenges were also encountered and overcome, among which the package volume problem was particularly prominent. Next, a comprehensive introduction to the efforts and precipitation of the small program of Didi Chuxing in the volume control.
After joining Taobao, it has undergone changes in the development and deployment of large and small, and was also fortunate to have participated in the construction of some of these capabilities in the entire trend of change. Today, from the perspective of an intimate person, through his own experience and exquisite colleagues, from the "13 years of stone age", "14 years of silver age", "15 years of golden age" and "future age" to talk to everyone How do big factories develop and deploy front-end code.
In MVC, MVVC and other front-end classic commonly used development models, V and C are often the highlights. It may be that the front-end business mainly focuses on these two pieces. Combined with the actual business, the author prefers the routing model and plug-in design. This kind of iteration and maintenance can make developers more profitable(however, you need to find PM to coordinate this matter. After all, they understand the simplified user experience, most of them are how to let users easy to use). But let's take a look at the Model today to see what expansion possibilities M has.
What is the architecture diagram? Why draw an architecture diagram? How to draw? What are the methods? This article begins with the definition of architecture, shares the experience summary of Alibaba Entertainment senior technical expert Xiao Yi on drawing architecture diagrams for many years, and discusses the concept of abstraction in depth. Longer, students can read it after collecting.
Webpack 5's module federation provides the ability to load partially compiled code, which seems to be the standard implementation of the micro front-end architecture.