When your WebSockets hit the Nitro boost 🏎️💨

npm install react-native-fast-ws --save

This library implements the WebSocket Web API and is meant to be a drop-in replacement for React Native's WebSocket implementation.

import { WebSocket } from 'react-native-fast-ws';

// Create a new WebSocket instance
const ws = new WebSocket('wss://echo.websocket.org');

// Using event listeners (recommended)
ws.addEventListener('open', (event) => {
  console.log('Connected to server');
  ws.send('Hello Server!');
});

// Or using event handlers
ws.onopen = (event) => {
  console.log('Connected to server');
};

// Listen to messages
ws.addEventListener('message', (event) => {
  console.log('Received:', event.data);
});

// Send different types of data
ws.send('Plain text message');
ws.send(new Uint8Array([1, 2, 3, 4]));

// Close the connection when done
ws.close();

For more detailed information about the WebSocket API, check out the MDN WebSocket documentation.

• Can create Blobs from ArrayBuffer, ArrayBufferView too. With React Native, you can only create Blob from string or another Blob
• Each Blob has text(), arrayBuffer(), and stream() methods. With React Native, you can only access the contents of Blob via custom data field
• Blob does not depend on a native module. Uses ArrayBuffers natively, thanks to Nitro Modules. With React Native, Blob uses RCTBlobManager under the hood to create and hold references to the data.
• Blob is automatically deallocated when no longer in use. You don't have to close() it manually
• You can send Blob, ArrayBuffer, and ArrayBufferView objects directly. With React Native, they are serialized and sent as base64 strings
• Uses direct callbacks per WebSocket instance. React Native broadcasts all events to JS and filters by connection ID, which is less efficient
• It will throw when attempting to close WebSocket connection with a code other than 1000 or outside of range 3000-4999. This is spec compliant behavior and something not supported by React Native's WebSocket implementation

These benchmarks are provided to demonstrate theoretical performance benefits and should be used as a general reference rather than absolute performance indicators.

You can browse the benchmark code here and check each message payload here.

All tests were performed with local WebSocket server to minimize network variance. Each test was run enough times to have 10 samples, after removing outliers.

In the future, we would like to add benchmarks for:

• CPU usage during message processing
• Memory footprint during large transfers
• Connection establishment time
• Concurrent connection handling
• Message latency under high load

Your contributions are welcome! Check out our contributing guidelines to help improve these benchmarks.

React Native FastWS is an open source project and will always remain free to use. If you think it's cool, please star it 🌟. Callstack is a group of React and React Native geeks, contact us at hello@callstack.com if you need any help with these or just want to say hi!

Like the project? ⚛️ Join the team who does amazing stuff for clients and drives React Native Open Source! 🔥