Microsoft is actively working on enhancing the speed of Microsoft Edge. Recently, they released an article stating that they will no longer use React for further customizations of Edge. This announcement has caused confusion among many developers. They are now uncertain whether learning React is still worthwhile or if they should consider focusing on another language, given Microsoft’s decision to move away from React.

We will discuss the specific problems faced by the Microsoft team, how they addressed these challenges, and the solutions they implemented to resolve them.

Why Microsoft is Ditching React?

Beginning of Microsoft

Firstly, Microsoft Edge was built using Chromium, the open-source web browser project by Google. Because Microsoft used Chromium, Edge initially had a similar UI to Chrome, which they wanted to change. To achieve a better and more seamless UI for Edge, they used React to build many of its components. By collectively using these components, they managed to create the whole browser.

However, the entire browser wasn’t built solely with React; it also utilized HTML pages with embedded React components, such as dropdowns, menu bars, and other static elements. Since these components are static and do not change data dynamically, using React for them doesn’t seem justified. This realization led Microsoft to question the necessity of using React for their browser.

What was the Problem?

Microsoft released an article claiming that “React is not efficient,” citing several issues they encountered while working with it. One significant problem was the chaos arising from multiple team members using the same module to build different components simultaneously. This shared usage of the same modules or bundles caused delays in rendering and displaying their work.

Additionally, Microsoft noted that the browser’s reliance on JavaScript-dependent frameworks was another reason for its decreasing speed over time. Consequently, Microsoft identified React as a primary contributor to these bundle problems. In previous versions of the browser, they used React to create small components separately, incorporating HTML within these components. However, all team members shared the same JavaScript bundle of code, which led to chaos and slowed down the loading of Edge.

The Solution

Actually, React itself was not the problem; it was Microsoft’s incorrect implementation that led to the issues. A bundle is intended to serve and work for one page at a time, but the team was sharing a single bundle to create different components, resulting in chaos. React was not designed to be used this way, and expecting to create multiple instances simultaneously with a single bundle is impractical.

To address these problems, Microsoft developed a new framework, announcing WebUI 2.0, a markup-first architecture. This framework helps minimize the file size of JavaScript that runs during the initialization phase. By using this newly developed custom framework, Microsoft aims to resolve the issues they encountered with their previous implementation.