Getting Started

Introduction

React Native Boost consists of two pieces:

• A Babel plugin that statically analyzes your source code and replaces safe Text and View components with their direct native counterparts, leading to significant performance improvements compared to the JS-based wrapper components.
• A runtime package used internally by the plugin for cross-platform-safe imports and helper utilities.

The analyzer is intentionally strict and skips any optimizations that may lead to user-facing bugs and behavioral changes.

Compatibility

Getting Started

1. Install React Native Boost:

npm install react-native-boost

pnpm add react-native-boost

yarn add react-native-boost

bun add react-native-boost

2. If you use Expo and do not have a babel.config.js yet:

npx expo customize babel.config.js

3. Add the plugin:

// babel.config.js
module.exports = {
  plugins: ['react-native-boost/plugin'],
};

If you're using Unistyles or Nativewind in your project, refer to these additional setup instructions:

4. Restart the development server and clear cache:

npm start -- --clear

pnpm start -- --clear

yarn start --clear

bun run start --clear

Platform Support

React Native Boost supports all platforms. Optimizations are performed on iOS and Android, while falling back to the default components on all other platforms.