Rohan is a Software Engineer who loves to explore different technologies and build digitals products.  \nHe works on the Fluent design system and React Native tooling & platform space at Microsoft. He loves teaching and tries to bring that out in the form of YouTube videos and blogs. \nHe is looking forward to meet you all at React India.

Rohan Prasad

React Native in Microsoft’s Office Mobile - how we improved the DX to deliver faster & better code

We at Microsoft, work on many RN experiences across platforms which are plugged into many MS apps to provide a cohesive experience.
These experiences are worked upon by many teams distributed globally and we have tons of repos, many of which are monorepos where our packages reside and there are many co-dependencies among each other with which comes it lot of complexity.
 
This complexity also comes with a lot of issues like: 
i. How do we check the compatibility of various packages over other packages inside the monorepo? (For e.g.: one package might be used in another package inside a mono repo, but they have incompatible version of dependencies (for e.g.: react-router) 
ii. How do keep RN updated in each of the codebases? 
and many more.  
 
In this talk, we intend to give an overview of the tools available and showcase actual implementations and usages of these tools in popular Microsoft applications experiences, which simplified developer experience and gave lot of performance improvement.  
 
rnx-kit (https://github.com/microsoft/rnx-kit) is Microsoft's opensource RN tooling kit which provides lot of modern, scalable tools for exceptional developer experience.
 
RNTA (https://github.com/microsoft/react-native-test-app)  is an opensource tool that provides test app for all the supported platforms as a package so developers can focus on writing JavaScript/JSX/TSX without much thinking about the running test tooling issues. 
 
implementations: split bundles in M365 apps, monobundle in office apps.
 
tools usages: 
@rnx-kit/dep-check 
@rnx-kit/react-native-lazy-indexing
@rnx-kit/metro-serializer-esbuild (tree shaking) 
@rnx-kit/metro-plugin-cyclic-dependencies-detector  
@rnx-kit/metro-plugin-duplicates-checker  
 react-native-test-app (Usage in Fluent RN Library)

Rohan Prasad

About