Innovating with React and React Native at Meta: VR, AR, Gaming, and More
Key insights
- ⚛️ React and React Native are fundamental to product development and innovation at Meta, powering a wide range of experiences from VR and AR to gaming interfaces
- 📱 The use of React Native expands the capabilities of React beyond web development, enabling diverse applications across platforms
- ☁️ Zephyr Cloud is the sponsor, offering a cloud-agnostic platform for module federation in microfrontends
- 📱 React Native uses 'view' and 'text' instead of 'div' for native mobile development, and has been used to build apps like Instagram and Facebook for Meta Quest
- 🔄 React Native allows for code reusability across different platforms and provides powerful animation capabilities, performance, and shared platform benefits
- ⚙️ React Native allows specialized people to build reusable Primitives for the platform and has performance on par with Meta's mobile social apps
- 🛍️ The Meta Horizon store development includes the use of React and React Native, server components, cross-platform code sharing, and the introduction of the Meta spatial SDK and spatial Editor
- 🖥️ React Native is being used directly in Windows 11, enabling native integrations, fast UI updates, and a great developer experience, benefiting all React products
Q&A
In what capacity is React Native being utilized in Windows 11 at Meta?
React Native is used in Windows 11 for native integrations. A custom 3D rendering engine is integrated using React Native. Developers with a C++ background are impressed by the React Native developer experience. Improvements in memory usage and performance benefit all React products, and Meta shares these improvements with the open-source community.
What technical aspects are discussed regarding the Meta Horizon store's development?
The Meta Horizon store runs on a fork of Android, allowing the running of apks. Performance improvement is achieved through initiating network queries earlier. Server components are introduced for optimizing network requests. React and React Native are used for faster feature rollout and experimentation. Cross-platform code sharing, reuse of internal router for React apps, transition to StyleX for consistent styling across platforms, and the announcement of Meta spatial SDK and spatial Editor for immersive experiences on Meta Horizon OS are also discussed. The spatial Editor is developed with React Native for desktop.
What are the key benefits of using React Native for app development at Meta?
React Native allows specialized people to build reusable Primitives for the platform. Time saved and reusability gained from React Native results in better apps. React Native performance for Meta's apps exceeded expectations and is on par with their mobile social apps. Usage of static Hermes for React Native apps contributes to better performance. There is collaboration between the Horizon team and React team to improve application performance using debugging tools.
How does React Native enable code reusability and platform-specific focus?
React Native allows for code reusability across different platforms, enabling developers to reuse their mental model and focus on platform-specific differences. It provides powerful animation capabilities, performance, and shared platform benefits. Facebook and Instagram leveraged React Native for rich animations, seamless transitions, and code sharing from their desktop experience.
What are the differences between React and React Native components?
React Native uses 'view' and 'text' instead of 'div' for native mobile development. It allows for platform-specific implementation through writing bindings for different platforms. React Native has been used to build apps like Instagram and Facebook for Meta Quest.
What is the relationship between React and React Native at Meta?
React and React Native are essential for product development at Meta, enabling the creation of high-quality experiences. They power a variety of technologies at Meta, including VR, AR, gaming interfaces, and more. React Native expands the scope of React beyond web development, allowing for diverse applications across platforms.
- 00:00 React and React Native are fundamental to product development and innovation at Meta, powering a wide range of experiences from VR and AR to gaming interfaces. The use of React Native expands the capabilities of React beyond web development. Zephyr Cloud is a sponsor of the episode.
- 03:47 React Native uses different components like 'view' and 'text' instead of 'div' for native mobile development. It allows for platform-specific implementation and has been used to build apps like Instagram and Facebook for Meta Quest.
- 07:39 React Native allows for code reusability across different platforms, enabling developers to reuse their mental model and focus on platform-specific differences. It provides powerful animation capabilities, performance, and shared platform benefits. Facebook and Instagram leveraged React Native for rich animations, seamless transitions, and code sharing from their desktop experience.
- 11:04 React Native allows for building better apps with specialized people in the group to build the best native stuff and expose it to everyone else more efficiently. The performance of React Native apps for Meta exceeded their original expectations and is on par with Meta's mobile social apps.
- 14:39 A discussion about the development and improvements in the Meta Horizon store, including the use of React and React Native, server components, cross-platform code sharing, and the introduction of the Meta spatial SDK and spatial Editor.
- 18:25 React Native is being used directly in Windows 11, enabling native integrations, fast UI updates, and a great developer experience. Meta's engineers use React on multiple platforms, with improvements benefiting all React products.