React Native and why Microsoft uses it for its own cross-platform development

React Native and why Microsoft uses it for its own cross-platform development

Interview: Microsoft is among the biggest users of React Native for cross-platform development, despite having its own home-grown frameworks.

At QCon London this week, Microsoft senior software engineer Lorenzo Sciandra, who is also a React Native maintainer, spoke to DevClass about why Microsoft uses this approach to cross-platform development, despite having alternatives such as .NET MAUI (multi-platform app UI) and a long-term investment in cross-platform C++ for Office.

Microsoft’s Lorenzo Sciandra at QCon London

Examples of React Native use include Microsoft Office, Outlook, Teams, Xbox, Skype and Microsoft Store on Xbox. This does not mean that the entirety of these applications uses React Native, since the company makes extensive use of a technique Sciandra calls “brownfield development,” extending an existing codebase with new features using React Native. It is also being used in Copilot in various ways, which Sciandra said was a “big success” but that “I’m only going to tease it today, there are going to be more details later this year.”

When did Microsoft start using React Native? “It’s a bit convoluted. There were different sides of the company, but they started using it more or less as soon as it became available, 2015-2016,” Sciandra told DevClass. “Skype was one of the first ones to invest, and similarly in the Office and Windows organizations, they started collaborating right away. Over time these different efforts grew into bigger investments from different organizations, and now Xbox is also heavily invested into this platform. We have React Native Windows and React Native macOS platforms that everyone can use in open source. And that requires a lot of collaboration with Meta, and other companies like Amazon, and one of the main things I do is ensuring that these collaborations across the companies are all coordinated to make this platform better.”

What is the attraction of React native to Microsoft, when the company has other choices for cross platform? “First of all, JavaScript hire-ability,” said Sciandra. “You have the biggest pool to fish from.” Other languages such as C++ or C# are “much more hardcore languages, more complicated,” he said. “Another one is that we have web versions of all our apps … most of them are using React as one of the key components, so having React Native as an option allows for focused investment in the React space.”

The ability to use React Native for brownfield development is also key. “It is not an all or nothing option. Other cross-platform solutions exist but usually you need to write everything using the solution. You need to start from scratch. With React Native you add this layer on top of your existing projects and can much more easily try just one screen,” he told us.

In practice, is TypeScript rather than JavaScript used? “I think almost everyone using React Native uses TypeScript,” said Sciandra. The ubiquity of JavaScript remains an advantage. “There is a massive community, a massive set of libraries you can leverage,” he said. 

Another feature of React Native is that it uses native operating system controls, as opposed to frameworks like Google’s Flutter which generally draw their own controls. “That means that the OS running the app knows what’s going on,” Sciandra told us. This has benefits for navigation and optimization, as well as ensuring a native look and feel.

Sciandra is also open about some of the trade-offs involved in using React Native. One of the biggest is “how alive and dynamic this space is now,” he said. “Having to keep up with a company like Meta where every commit goes into action in a couple of hours … that is one of the main complexities.” Part of his role is to work with Meta and others to “make sure that releases are reliable, stable and predictable.”

React Native is open source, but the repositories for Android and iOS are managed by Facebook whereas those for Windows and macOS are managed by Microsoft. “That means we need to keep up with the code base,” said Sciandra.

There is plenty of change on the way. Meta has been redesigning the core internals with a new architecture, currently still designated experimental, but which will become the default. The implication is that React Native adoption means being ready to refactor code frequently as the framework gets updated.

How does React Native compare to other approaches such as Electron, using a web view, which also uses JavaScript or TypeScript to create a desktop app? Meta migrated Messenger from Electron to React Native on Windows and macOS, Sciandra told us. “They have seen very significant improvements in both performance and binary size.”

Using a web view though makes it easy to share code between web and desktop or mobile, whereas with React Native this is not so good. “The reason why React and React Native are two separate projects is that React Native requires some custom code that is React-like, but you cannot use React code directly,” said Sciandra. “For example, for anything that is a component libarary or a design system, you cannot share that easily. You need to build custom components for React Native.”

This may change though. React Strict DOM is under development and “the idea here is what if we figure out a way to make UI written for web work directly in React Native,” said Sciandra.

Sciandra’s presentation, to a somewhat sceptical QCon audience, was called “How Microsoft leverages React Native for strategic advantage.” The topic is worth attention for developers interested in cross-platform development using native controls, even if Microsoft’s developer marketing for cross-platform – what it says as opposed to what it does – is more focused on .NET MAUI.