Just shipped iOS Home Screen & Lock Screen widgets in React Native. š
Most people say it can't be done cleanly. Here's proof it can š
The widget updates live golf scores directly on your Home Screen ā no app open, no refresh needed.
Here's what made this tricky:
Widgets are completely sandboxed. No JS bridge. No fetch(). No React state. The only way to pass data from React Native to the widget is through App Groups + UserDefaults ā and if your provisioning profile doesn't match exactly, the widget shows blank. No error. No warning. Just silence.
What you're seeing in the code:
ā PlayerScore model shared between app and widget extension
ā TimelineProvider controlling exactly when the widget refreshes
ā loadGameData() reading live data from UserDefaults with the App Group suite name
ā Full SwiftUI rendering ā inside a React Native project
3 things that will burn you if you try this:
App Group ID must be identical in both targets ā one character off = silent failure
.never refresh policy means YOU control updates, not WidgetKit
Always test on a real device ā simulator caches stale widget data constantly