All bites
The whole library, newest first. Filter by what you are here for, or pick a topic if you already know.
4330 bites
Page 58
GraphQL versus REST data fetching
One endpoint, client-specified fields avoid over- and under-fetching; Apollo's useQuery returns loading, error, and data while caching results.
Optimistic UI updates for actions
Update UI immediately on the assumption of success, send the request, then confirm or roll back on failure.
Offline data persistence and mutation queue
Persist reads to local storage, store mutations in a durable queue with client ids and status, drain and reconcile on reconnect via NetInfo.
Apollo's normalized cache
Apollo flattens query results into entities keyed by type plus id, so one object is stored once and shared, updating everywhere at once.
Platform-specific file extensions
Name files Component.ios.js and Component.android.js; import without the extension and the bundler picks the right one per platform.
Cross-platform shadow with Platform API
IOS uses shadowColor/Offset/Opacity/Radius, Android uses elevation; merge both via Platform.select inside a style.
Platform files versus Platform.OS checks
Use platform files for large divergence and platform-only deps, use Platform.OS for small inline tweaks.
Conditional logic with Platform.Version
Platform.Version is a number on Android (API level) and a string on iOS; gate features by version to use new APIs only where supported.
Designing a native map UI component
Wrap each platform's native view, expose props mapped to native setters and events as bubbling callbacks, unify behind one JS API.
Responsive layout across form factors
Drive layout from dimensions and breakpoints via useWindowDimensions, react to orientation changes, avoid hardcoded OS checks.
useNativeDriver in the Animated API
Native driver runs animations on the UI thread so they stay smooth even if JS is busy, but only supports non-layout props like transform and opacity.
Build a mount fade-in with Animated API
Create an Animated.Value(0) in a ref, drive it with Animated.timing inside useEffect, bind it to opacity on Animated.View.
Animated.sequence versus Animated.parallel
Sequence runs animations one after another in order, parallel starts them at the same time.
Animated API versus Reanimated architecture
Animated declares animations that the native driver runs, but logic and gestures cross the bridge; Reanimated runs worklets directly on the UI thread.
Shared values and useAnimatedStyle in Reanimated
UseSharedValue holds a mutable .value readable on both threads, useAnimatedStyle derives styles as a worklet, mutate .value with withTiming or withSpring.
Animated.event for scroll-driven parallax
Animated.event maps an event path to an Animated.Value, wire it to onScroll with useNativeDriver, then interpolate the value for header transform.
What is a worklet in Reanimated
A worklet is a JS function marked to run on the UI thread runtime with a captured snapshot of its scope, enabling synchronous per-frame work.
Shared element transitions with Reanimated
Wrap both views in Animated.View with the same sharedTransitionTag, use a native-stack navigator so Reanimated interpolates between source and target.
Persisting key-value preferences across launches
AsyncStorage for simple non-sensitive key-value, MMKV for speed, SecureStore or Keychain for secrets.
Requesting runtime permissions on iOS and Android
Declare permissions in Info.plist and AndroidManifest, then check status and request at runtime just before use, handling granted, denied, and blocked.