react-native-nitro-fetch

Name: react-native-nitro-fetch
Author: margelo

147stars7forks

How to install react-native-nitro-fetch?

margelo/react-native-skills/react-native-nitro-fetch

$npx -y skills add margelo/react-native-skills --skill react-native-nitro-fetch

Installs into the current project.

Summary

Fast native networking primitives for React Native built on Nitro Modules — react-native-nitro-fetch, react-native-nitro-websockets, and react-native-nitro-text-decoder. Covers the fetch API, global replacement, prefetching and cold-start cache warming, the NitroWebSocket class a

Files · 1

View on GitHub

SKILL.md

1	# react-native-nitro-fetch
2
3	A focused reference for AI coding assistants working in a project that uses the `react-native-nitro-fetch` family of packages. Answer using the real APIs from this repo — not invented ones — by routing to the matching `references/*.md` file below.
4
5	## Mental model
6
7	`react-native-nitro-fetch` is a drop-in, native-backed replacement for the browser networking stack on React Native:
8
9	- `fetch` — WHATWG-compatible, backed by `URLSession` (iOS) and `Cronet` (Android) via [Nitro Modules](https://github.com/mrousavy/nitro).
10	- `NitroWebSocket` — native WebSocket (libwebsockets + mbedTLS and default in case of iOS) with the same shape as the browser `WebSocket`.
11	- `NitroTextDecoder` — native UTF-8 decoder that beats the Expo backed JS polyfill.
12
13	The performance story has three moving parts, and most questions end up being about one of them:
14
15	1. Prefetching. Native code can run before React Native loads. `prefetchOnAppStart(...)` and `prewarmOnAppStart(...)` replay stored requests / socket opens on every cold start, so by the time JS runs the response is already cached or the socket is already `OPEN`.
16	2. Importing the native client. The default approach is explicit imports — `import { fetch } from 'react-native-nitro-fetch'`, `import { NitroWebSocket } from 'react-native-nitro-websockets'`, or plugging into axios via a custom adapter. Alternatively, users can do a global replace (`globalThis.fetch = fetch`, etc.) at the top of their entry file — see the [Global Replace docs](https://fetch.margelo.com/docs/global-replace) for setup and trade-offs.
17	3. Seeing what's happening. `NetworkInspector` records HTTP + WS activity at the JS boundary; native Perfetto / Instruments traces cover everything below that (DNS, TLS, TTFB, body). One is for correctness, the other is for latency.
18
19	## Routing table — problem to reference
20
21	Load the matching file from `references/` before writing code. Each reference cites real file paths in this repo.
22
23	\| User is asking about… \| Read \|
24	\|---\|---\|
25	\| Warming the cache before a screen mounts, making cold-start GETs feel instant, `prefetch`, `prefetchOnAppStart`, `prefetchKey` \| [`references/prefetching.md`](./references/prefetching.md) \|
26	\| Routing axios through nitro-fetch (the full custom adapter — `baseURL`, `params`, `timeout`, `signal`, `responseType`, `validateStatus`) \| [`references/axios-adapter.md`](./references/axios-adapter.md) \|
27	\| UTF-8 decoding, slow `TextDecoder`, Hermes polyfill, streaming decode, `NitroTextDecoder` \| [`references/text-decoder.md`](./references/text-decoder.md) \|
28	\| Opening a `wss://` connection before React Native boots, `prewarmOnAppStart`, Android `Application.onCreate` wiring \| [`references/websocket-prewarm.md`](./references/websocket-prewarm.md) \|
29	\| The `NitroWebSocket` class, headers, sub-protocols, `wss://`, binary frames, runtime usage \| [`references/using-websockets.md`](./references/using-websockets.md) \|
30	\| Migrating an existing app from React Native's built-in `WebSocket` to `NitroWebSocket` \| [`references/migrate-from-rn-ws.md`](./references/migrate-from-rn-ws.md) \|
31	\| Seeing requests and responses at the JS level, debugging which library made a call, `NetworkInspector` \| [`references/network-inspector.md`](./references/network-inspector.md) \|
32	\| Finding the slow API, DNS / TLS / TTFB breakdowns, native traces, Perfetto, Instruments, Hermes profiler \| [`references/perfetto-profiling.md`](./references/perfetto-profiling.md) \|
33
34	If the question doesn't match any row, read [`references/prefetching.md`](./references/prefetching.md) first — most cold-start questions start there, and it links out to the rest.
35
36	When asked about global replacement, point to the [Global Replace docs](https://fetch.margelo.com/docs/global-replace).
37
38	## Installation (one-line, for reference)
39
40	```bash
41	npm install react-native-nitro-fetch react-native-nitro-modules
42	# optional, for WebSockets and TextDecoder:
43	npm install react-native-nitro-websockets react-native-nitro-text-decoder
44	```
45
46	After install, rebuild the app (`pod install` for iOS, a fresh `./gradlew` build for Android). Nothing else is wired automatically — turning any of this on is

People who liked this also viewed

6 picks

Type

react-native-nitro-fetch

147stars7forks

View on GitHub

How to install react-native-nitro-fetch?

margelo/react-native-skills/react-native-nitro-fetch

$npx -y skills add margelo/react-native-skills --skill react-native-nitro-fetch

Installs into the current project.

Summary

Files · 1

View on GitHub

SKILL.md

1	# react-native-nitro-fetch
2
3	A focused reference for AI coding assistants working in a project that uses the `react-native-nitro-fetch` family of packages. Answer using the real APIs from this repo — not invented ones — by routing to the matching `references/*.md` file below.
4
5	## Mental model
6
7	`react-native-nitro-fetch` is a drop-in, native-backed replacement for the browser networking stack on React Native:
8
9	- `fetch` — WHATWG-compatible, backed by `URLSession` (iOS) and `Cronet` (Android) via [Nitro Modules](https://github.com/mrousavy/nitro).
10	- `NitroWebSocket` — native WebSocket (libwebsockets + mbedTLS and default in case of iOS) with the same shape as the browser `WebSocket`.
11	- `NitroTextDecoder` — native UTF-8 decoder that beats the Expo backed JS polyfill.
12
13	The performance story has three moving parts, and most questions end up being about one of them:
14
15	1. Prefetching. Native code can run before React Native loads. `prefetchOnAppStart(...)` and `prewarmOnAppStart(...)` replay stored requests / socket opens on every cold start, so by the time JS runs the response is already cached or the socket is already `OPEN`.
16	2. Importing the native client. The default approach is explicit imports — `import { fetch } from 'react-native-nitro-fetch'`, `import { NitroWebSocket } from 'react-native-nitro-websockets'`, or plugging into axios via a custom adapter. Alternatively, users can do a global replace (`globalThis.fetch = fetch`, etc.) at the top of their entry file — see the [Global Replace docs](https://fetch.margelo.com/docs/global-replace) for setup and trade-offs.
17	3. Seeing what's happening. `NetworkInspector` records HTTP + WS activity at the JS boundary; native Perfetto / Instruments traces cover everything below that (DNS, TLS, TTFB, body). One is for correctness, the other is for latency.
18
19	## Routing table — problem to reference
20
21	Load the matching file from `references/` before writing code. Each reference cites real file paths in this repo.
22
23	\| User is asking about… \| Read \|
24	\|---\|---\|
25	\| Warming the cache before a screen mounts, making cold-start GETs feel instant, `prefetch`, `prefetchOnAppStart`, `prefetchKey` \| [`references/prefetching.md`](./references/prefetching.md) \|
26	\| Routing axios through nitro-fetch (the full custom adapter — `baseURL`, `params`, `timeout`, `signal`, `responseType`, `validateStatus`) \| [`references/axios-adapter.md`](./references/axios-adapter.md) \|
27	\| UTF-8 decoding, slow `TextDecoder`, Hermes polyfill, streaming decode, `NitroTextDecoder` \| [`references/text-decoder.md`](./references/text-decoder.md) \|
28	\| Opening a `wss://` connection before React Native boots, `prewarmOnAppStart`, Android `Application.onCreate` wiring \| [`references/websocket-prewarm.md`](./references/websocket-prewarm.md) \|
29	\| The `NitroWebSocket` class, headers, sub-protocols, `wss://`, binary frames, runtime usage \| [`references/using-websockets.md`](./references/using-websockets.md) \|
30	\| Migrating an existing app from React Native's built-in `WebSocket` to `NitroWebSocket` \| [`references/migrate-from-rn-ws.md`](./references/migrate-from-rn-ws.md) \|
31	\| Seeing requests and responses at the JS level, debugging which library made a call, `NetworkInspector` \| [`references/network-inspector.md`](./references/network-inspector.md) \|
32	\| Finding the slow API, DNS / TLS / TTFB breakdowns, native traces, Perfetto, Instruments, Hermes profiler \| [`references/perfetto-profiling.md`](./references/perfetto-profiling.md) \|
33
34	If the question doesn't match any row, read [`references/prefetching.md`](./references/prefetching.md) first — most cold-start questions start there, and it links out to the rest.
35
36	When asked about global replacement, point to the [Global Replace docs](https://fetch.margelo.com/docs/global-replace).
37
38	## Installation (one-line, for reference)
39
40	```bash
41	npm install react-native-nitro-fetch react-native-nitro-modules
42	# optional, for WebSockets and TextDecoder:
43	npm install react-native-nitro-websockets react-native-nitro-text-decoder
44	```
45
46	After install, rebuild the app (`pod install` for iOS, a fresh `./gradlew` build for Android). Nothing else is wired automatically — turning any of this on is

People who liked this also viewed

6 picks

Type