Thuta Learning
React Native
IntermediateMobile Developmentintermediate

Offline, Timeout, Retry & Network Resilience

React Nativeသင်ခန်းစာ 14

ဒီခန်းပြီးရင် ဘာတတ်သွားမလဲ

  • Offline, Timeout, Retry & Network Resilience ရဲ့ React နဲ့ native platform behavior ကိုရှင်းပြနိုင်ရန်
  • Accessibility, failure နဲ့ lifecycle cases စမ်းနိုင်ရန်
  • Maintainable, testable နဲ့ performant React Native code ရေးနိုင်ရန်

Offline, Timeout, Retry & Network Resilience ကို permission, loading, empty, offline, timeout, cancellation, retry, app background/foreground နဲ့ stale-data behavior ပါသော lifecycle-aware flow အဖြစ်တည်ဆောက်ပါ။ Subscription, timer နဲ့ request cleanup ကိုမမေ့ပါနှင့်။

ပိုပြီးနားလည်ထားရမယ့် အချက်

Offline, Timeout, Retry & Network Resilience ကို permission, loading, empty, offline, timeout, cancellation, retry, app background/foreground နဲ့ stale-data behavior ပါသော lifecycle-aware flow အဖြစ်တည်ဆောက်ပါ။ Subscription, timer နဲ့ request cleanup ကိုမမေ့ပါနှင့်။

လက်တွေ့မှာ ဘယ်လိုအသုံးချမလဲ

Offline, Timeout, Retry & Network Resilience example ကို Android/iOS, small/large screens, font scaling, dark mode, keyboard, screen reader, slow/offline network, denied permissions နဲ့ app background/foreground cases ဖြင့်စမ်းပါ။ DevTools, tests နဲ့ release build ကိုလိုအပ်သလိုအသုံးပြုပါ။

ဒီသင်ခန်းစာပြီးရင်

ts
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));
You should see
နှေးသော request ကို ၈ စက္ကန့်အကြာ cancel လုပ်ပြီး failure ကို retry လုပ်နိုင်မည်။

ကိုယ်တိုင်စမ်းကြည့်ရန်

Offline, Timeout, Retry & Network Resilience example ကို Android/iOS, small/large screens, font scaling, dark mode, keyboard, screen reader, slow/offline network, denied permissions နဲ့ app background/foreground cases ဖြင့်စမ်းပါ။ DevTools, tests နဲ့ release build ကိုလိုအပ်သလိုအသုံးပြုပါ။

Platform/Lifecycle သတိပေးချက်

Simulator တစ်ခု၏ happy path မှန်ရုံဖြင့် real devices, release builds, permissions, accessibility, offline နဲ့ lifecycle paths အားလုံးမှန်ပြီဟုယူဆခြင်း။

NetworkingReact Native

ဒီနေရာမှာ လူအများမှားတတ်တယ်

  • Simulator တစ်ခု၏ happy path မှန်ရုံဖြင့် real devices, release builds, permissions, accessibility, offline နဲ့ lifecycle paths အားလုံးမှန်ပြီဟုယူဆခြင်း။
  • Web CSS/DOM assumptions ကို React Native တွင်တိုက်ရိုက်သုံးခြင်း၊ subscription မပိတ်ခြင်း သို့ platform differences ကို condition အများကြီးဖြင့် component ထဲရောထည့်ခြင်း။

လက်တွေ့လေ့ကျင့်ခန်း

Offline, Timeout, Retry & Network Resilience example ကို Android/iOS, small/large screens, font scaling, dark mode, keyboard, screen reader, slow/offline network, denied permissions နဲ့ app background/foreground cases ဖြင့်စမ်းပါ။ DevTools, tests နဲ့ release build ကိုလိုအပ်သလိုအသုံးပြုပါ။

You'll know it worked when: နှေးသော request ကို ၈ စက္ကန့်အကြာ cancel လုပ်ပြီး failure ကို retry လုပ်နိုင်မည်။

Offline, Timeout, Retry & Network Resilience | Thuta Learning