Building a Resilience Layer for Mobile AI: How I handle 429s, Provider Fragmentation, and Streaming in React Native

#ai #reactnative #expo #opensource

Most React Native AI integrations I've seen share two failure modes:
they're locked to one provider, and they have no strategy for rate limits.

After rebuilding the same glue code across multiple projects, I packaged
it into react-native-ai-hooks v0.6.0.

The Core Problems

Provider Fragmentation
Anthropic, OpenAI, and Gemini all return structurally different responses.
Building UI on top of that means your components need to know which
provider they're talking to — which is the wrong abstraction layer.

providerFactory.ts normalizes all three into one AIResponse object.
Your hooks never see raw provider responses.

Rate Limit Handling
HTTP 429 on mobile is worse than on the web. Users have unstable
connections, background/foreground cycles, and no visibility into
retry behavior.

fetchWithRetry.ts implements exponential backoff with jitter:

const delay = Math.min(
  baseDelay * Math.pow(backoffMultiplier, attempt) * (1 + Math.random() * 0.3),
  maxDelay
);

The jitter matters. Without it, clients recovering from a rate limit
simultaneously create a second spike at the same interval.

Streaming
React Native's fetch implementation handles chunked transfer encoding
differently than browsers. useAIStream accounts for this specifically.