Introduction to React Native for Web
React Native for Web is a compatibility layer between React DOM and React Native. It can be used in new and existing apps, web-only and multi-platform apps.
React Native for Web is made with modern React APIs including function components and hooks. It builds upon React DOM, making it straight-forward for React DOM apps to incrementally adopt the framework (as was done by Twitter and Flipkart.) The project aims to provide broad compatibility with React alternatives, but will continue to evolve with React as APIs like Concurrent Mode and Server Components are introduced.
React Native for Web makes direct use of native DOM APIs to implement specific features. As the Web platform improves, so does React Native for Web. Although certain APIs in the project have remained unchanged since inception, the implementations have become smaller and faster by migrating to new DOM APIs as they became broadly available in browsers.
React Native for Web provides all the core components you’d expect from React Native. You will mostly work with
ScrollView. The core components include props for working with interactions, including the advanced gesture responder system. Each component’s documentation contains live and editable examples to try out.
React Native for Web exports many different modules to support a variety of use cases. Your application can use as many or as few of these modules as needed. The babel plugin will help you to only bundle the modules that you are using.
React Native for Web is thoroughly unit and production tested. Significant changes are first published as canary releases to limit regressions and gather feedback from partners. Pull requests record changes to the compressed file size of each module in the library.