Offline, Timeout, Retry & Network Resilience

Build Offline, Timeout, Retry & Network Resilience as a lifecycle-aware flow covering permission, loading, empty, offline, timeout, cancellation, retry, foreground/background transitions, and stale data. Clean up subscriptions, timers, and requests.

Build a Complete Mental Model

Build Offline, Timeout, Retry & Network Resilience as a lifecycle-aware flow covering permission, loading, empty, offline, timeout, cancellation, retry, foreground/background transitions, and stale data. Clean up subscriptions, timers, and requests.

Apply It in Production React Native

Test an original Offline, Timeout, Retry & Network Resilience example on Android and iOS with small and large screens, font scaling, dark mode, keyboard and screen reader use, slow/offline networking, denied permissions, and background/foreground transitions. Use DevTools, tests, and a release build where relevant.

After This Lesson

• Explain the shared-code and platform boundary
• Build an example with loading, error, and accessibility states
• Verify one Android/iOS behavior with a test or profiler

export async function loadTasks(signal: AbortSignal) {
  const response = await fetch('https://example.com/tasks', { signal });
  if (!response.ok) throw new Error('HTTP ' + response.status);
  return response.json();
}

const controller = new AbortController();
const timeout = setTimeout(() => controller.abort(), 8000);
loadTasks(controller.signal)
  .catch(error => console.warn(error.name === 'AbortError' ? 'Timed out' : error))
  .finally(() => clearTimeout(timeout));

Slow requests cancel after eight seconds and failures remain recoverable.

Networking — React Native