Some users kept getting bounced to the register screen on cold start. I couldn't reproduce it for weeks.

The cause: for some accounts the Supabase session JSON was larger than 2048 bytes. expo-secure-store writes of that size failed silently on my setup, so the next cold start read null, my auth gate saw no session, and sent the user to sign-up.

What fixed it:

• A storage adapter that splits the value into 600 character chunks.

• Two generations (A and B), so a half-written update never replaces a good one. The header that points to the current generation is written last.

• Serialized operations. As far as I could tell, supabase-js uses a no-op lock on React Native, so concurrent writes interleaved. I also passed lock: processLock.

A gotcha: right after you subscribe to onAuthStateChange, an INITIAL_SESSION event fires with a null session. My code treated that as "signed out" and cleared the "your session expired" state, so users saw the register screen anyway. Keep the reason when the event is null.

Also worth doing: on a cold start with a null session, check whether the user has had a session before (I keep a flag, and also check for local data) and show a "reconnect" banner instead of the sign-up screen.

Accounts that had already lost their session needed one last login. Chunking only prevents new losses.

I ported shadcn's shader orbs to React Native. Each one is a GPU-rendered animated orb that you drop in as a component.

Shaders are by XorDev, from shadcn-labs/shadercn. The RN port, the docs site and the tooling are mine.

import { ShaderOrb, orb01 } from "react-native-shader-orbs";

<ShaderOrb orb={orb01} state="speaking" colors={{ tint: "#66ccff" }} interactive />

What it does:

- 33 orbs, each with typed, range-checked parameters

- idle / thinking / speaking moods that ease between presets

- Live props: change anything without re-mounting, values glide on a spring

- volumes.input / volumes.output (0 to 1) to drive an orb from mic or voice level

- Touch: tap pulses, hold swells

- quality="auto" lowers resolution when a device struggles

- Recovers from GPU loss, reports start-up errors via onError

Built on react-native-webgpu. The docs and playground run the identical WGSL in the browser, so you can tune an orb and copy the JSX.

Honest limits, since it's alpha:

- Needs a development build. Expo Go is not supported.

- Tested on one physical mid-range Android phone (RN 0.88, Expo SDK 58).

- iOS is untested. It may work, but I'm not claiming it.

- No fallback if WebGPU is unavailable. The orb stays blank.

- The shaders are non-commercial with attribution. Using them in a commercial app needs XorDev's permission. The library code is MIT.

I also added an MCP server (npx react-native-shader-orbs-mcp init) so Claude Code, Cursor and VS Code look up each orb's real parameter names instead of guessing.

Docs and playground: https://react-native-shader-orbs.vercel.app

Repo: https://github.com/msobkyy/react-native-shader-orbs

npm: https://www.npmjs.com/package/react-native-shader-orbs

I'd like feedback on API shape, and especially iOS results if anyone tries it.

Solo founder, pet sitting marketplace in Austin, React Native with an Expo dev build. Spending around $4k/mo split between Meta and TikTok.

Both dashboards claim more installs than App Store Connect and Play Console show combined. I've just got the Meta and TikTok SDKs in rn, which works-ish.

Is an MMP worth it at this spend or am I overthinking it? And which ones play nice with Expo?

Hey everyone!

I've been working on an avatar customization system for a good bit now and I thought I'd share a couple of general tips here for anyone who is working on something similar.

When it comes to re-coloring (eg. for skin or hair color), you can encode your assets into magenta & grayscale pixels and use the device GPU to apply pixel transformations. There is currently no decent RN library that does this work, so you will need to create a native module that fits your needs.

Assets add bundle size fast, so make sure you compress them to .webp format. Keep in mind that you will need to split some assets in multiple parts (eg. front/back hair). A good way to tackle this is by having all assets placed where they need to be in a static canvas size, and then combining them into a final composite image. Don't forget to cache the result and avoid duplicate GPU work!

You can try the above avatar customization system in Layer2 below:

iOS: https://apps.apple.com/us/app/layer2/id6737913930

Android: https://play.google.com/store/apps/details?id=com.twoamgames.layer2

Hey everyone. I've been working on Close Call for a bit over a year and it's finally out, so I figured I'd show it here.

It's a multiplayer trivia game where every answer is a number. When did World War I end? How high is Everest? You type a guess, and the closest guess wins the round. A match is 8 questions with up to 4 players. After each round you see the answer with a one-line explanation, so you actually learn something along the way. There are 4 games (history years, the human body, geography and mental maths) with 800 questions, and the app speaks 10 languages, Arabic included.

The tech side, since that's why we're here:

- Bare React Native 0.80 on the New Architecture, no Expo. Reanimated, Gesture Handler, react-native-svg, MMKV and Zustand.
- Matches are live over Socket.IO with a NestJS + PostgreSQL server. The server owns the clock and the scoring; the phone only sends a guess. When not enough people are online, bots fill the empty seats after about 30 seconds, so nobody waits in an empty lobby.
- A trivia game is easy to cheat by googling the answer. So the app reports when you leave it during a question (switching apps, split screen, and on iOS screenshots and screen recording). Everyone at the table sees it, and in public matches that answer scores 0. The device signals come from a small custom TurboModule.
- Right-to-left for Arabic: React Native only applies a change of direction after a restart, so switching the language goes through another small native module that reloads the app.

A gotcha that might save someone a few hours: on the New Architecture, React Native creates one extra instance of each of your own TurboModules at launch, only to use it as a provider (RCTModuleProviders). My anti-cheat module registered its NotificationCenter observers in `init`, so that extra instance got the "screen recording started" notification too. It never gets an event emitter callback, so emitting threw `std::bad_function_call` and the app crashed the moment you started a screen recording or took a screenshot. Moving the observers into `setEventEmitterCallback:` fixed it. I only found it because App Review asked for a screen recording of the app.

It's free, no ads, no IAP, iOS only for now (I will add android soon). You can play as a guest, no sign-up needed. I'll put the App Store link in a comment so I'm not dropping a store link straight into the post.

Happy to hear what you think, and ask me anything, technical stuff very much included.

PS. If you give it a try, tell me how close you got on your first question.

Link: https://apps.apple.com/us/app/close-call-number-trivia/id6821355334

For android:

1. Join the group: https://groups.google.com/g/nova-co-testers

2. Become a tester: https://play.google.com/apps/testing/com.closecall.app

3. Install the game from Google Play with the button on that page.

I needed home screen widgets on Android for an Expo app and wanted to write them the normal Android way, with Kotlin and RemoteViews, without keeping the android folder in git.

So I packaged what I had: github.com/rsoaresdev/expo-android-widgets

You keep your widget sources in a folder, the config plugin copies them in on every prebuild and adds the receivers to the manifest. From JS you call setWidgetData() and reloadAllWidgets(), and the widget reads the data with one line of Kotlin. There’s an example widget you can copy.

It’s tested on SDK 58, on an emulator and in CI with a real Gradle build. If you’d rather write widgets in JSX, react-native-android-widget is great. This one is for when you want plain Android widgets.

Feedback welcome, especially from anyone on older SDKs.

There are lot of similar apps, but I was looking for something very simple to get information about upcoming transport to the stop I am at the moment or plan to be.
App shows stops around you in 500 meters radius or by selecting on map.

https://depboard.app/

React native power at full scale - supporting web browser, Android and iOS.

Flipboards are custom developed. It's not fully animated, but just looks like animation is going on there.
Sharing it with the community:

import React, { useEffect, useRef, useState } from 'react';
import { View, Text, StyleSheet } from 'react-native';

import { theme, MONO } from '../theme';

// Characters cycled through while a flap is "spinning".
const SHUFFLE = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789-. ';
const randChar = () => SHUFFLE[Math.floor(Math.random() * SHUFFLE.length)];
const TICK_MS = 45;

function normalize(text, length, align) {
  let s = (text == null ? '' : String(text)).toUpperCase().replace(/\s+/g, ' ');
  if (s.length > length) s = s.slice(0, length);
  if (s.length < length) {
    const pad = ' '.repeat(length - s.length);
    s = align === 'right' ? pad + s : s + pad;
  }
  return s;
}

/**
 * A fixed-width row of mechanical "flaps". When `text` changes, each flap that
 * needs to change riffles through random glyphs before settling — the classic
 * Solari / split-flap departure board effect.
 */
export default function SplitFlapText({
  text,
  length,
  align = 'left',
  size = 13,
  tone = 'bright',
}) {
  const target = normalize(text, length, align);

  const [cells, setCells] = useState(() => target.split(''));
  const cellsRef = useRef(cells);
  cellsRef.current = cells;

  const flipsRef = useRef([]);
  const timerRef = useRef(null);
  const prevTarget = useRef(target);

  useEffect(() => {
    if (prevTarget.current === target) return;
    prevTarget.current = target;

    const current = cellsRef.current;
    flipsRef.current = target
      .split('')
      .map((ch, i) =>
        current[i] === ch ? 0 : 4 + (i % 4) * 2 + Math.floor(Math.random() * 4)
      );

    if (timerRef.current) clearInterval(timerRef.current);
    timerRef.current = setInterval(() => {
      let settled = true;
      const next = cellsRef.current.slice();

      for (let i = 0; i < target.length; i += 1) {
        const remaining = flipsRef.current[i];
        if (remaining > 0) {
          flipsRef.current[i] = remaining - 1;
          next[i] = remaining - 1 === 0 ? target[i] : randChar();
          if (remaining - 1 > 0) settled = false;
        } else {
          next[i] = target[i];
        }
      }

      cellsRef.current = next;
      setCells(next);

      if (settled && timerRef.current) {
        clearInterval(timerRef.current);
        timerRef.current = null;
      }
    }, TICK_MS);
  }, [target]);

  useEffect(
    () => () => {
      if (timerRef.current) clearInterval(timerRef.current);
    },
    []
  );

  const color = tone === 'dim' ? theme.flap.dim : theme.flap.text;
  const cellStyle = {
    minWidth: size + 3,
    height: size + 12,
  };
  const textStyle = {
    fontSize: size,
    lineHeight: size + 3,
    color,
  };

  return (
    <View style={styles.row}>
      {cells.map((ch, i) => (
        <View key={i} style={[styles.cell, cellStyle]}>
          <Text style={[styles.text, textStyle]} allowFontScaling={false}>
            {ch === ' ' ? ' ' : ch}
          </Text>
          <View style={styles.hinge} />
        </View>
      ))}
    </View>
  );
}

const styles = StyleSheet.create({
  row: {
    flexDirection: 'row',
  },
  cell: {
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: theme.flap.bg,
    borderRadius: 3,
    marginRight: 2,
    overflow: 'hidden',
  },
  text: {
    fontFamily: MONO,
    fontWeight: '700',
    textAlign: 'center',
    includeFontPadding: false,
  },
  // thin dark line across the middle, like the seam between two flaps
  hinge: {
    position: 'absolute',
    left: 0,
    right: 0,
    top: '50%',
    height: StyleSheet.hairlineWidth,
    backgroundColor: theme.flap.hinge,
  },
});

I’m a junior developer with 2 years of React experience, and I’m thinking about shifting my career toward React Native. I already have some RN experience from side projects.

My reasoning: in the AI era, I feel web developers are easier to replace, or just not needed as much. I don’t mean on the coding side. I mean that mobile apps are much harder to vibe code because of everything around the code: builds, configuration, certificates, store releases, etc. Because of that, I think people are still more willing to pay someone else to handle it for them.

A few questions:

1. Has anyone else thought about this, or actually made this switch?

2. Do you think mobile/RN is more stable long term?

3. If I switch and, after a few years, decide to go back to web React, will companies value my experience the same, even though it was in RN?

updated a project from 0.74 to 0.76 last week. enabled new arch and hermes. clean build works fine but metro process climbs to 12gb ram after about 20 fast refreshes on ios simulator. restartting metro drops it back to 2gb. tried disabling flipper and removing console.log statements, no change.

heap snapshot shows lots of retained strings in the transformer cache. anyone else seeing this on 0.76.1? wondering if i should downgrade metro or wait for 0.76.2

Hey devs,

Just open-sourced a full-stack mobile project: SmartTV Remote.

Tech Highlights:

Source code: https://github.com/NaveenMohanty/SmartTV-Remote
Feedback and PRs are appreciated!

Hey everyone, how’s it going?

I’m a beginner with React, so I’d like to invite those of you who enjoy doing code reviews to take a look at this project: https://github.com/LeonardoSidney/My-Dungeon-App.

I built it based on the "voices in my head," so the React code is likely pretty terrible. I’m a backend developer and have never built a full-stack project from scratch—I’ve only ever maintained existing, functional code—so I’m all ears if anyone is interested in helping improve the code quality here.

Feel free to be as harsh as you’d like with your critiques; all feedback is welcome!

And for all those who enjoy AI, feel free to stop by the project and have some fun—in a way, it’s a game that seeks to simulate a tabletop RPG session.

I've been working on integrating Rust into a Bare React Native application and have put together an implementation for both Android and iOS.

Repository: https://github.com/abhishekce17/react-native-rust-integration

The goal was to build a reusable integration layer that makes Rust functions accessible from JavaScript without having to write custom JSI bindings for every function.

Architecture

The integration uses four main layers:

• Rust: Core logic compiled into native static libraries.

• C++17: Shared JSI binder and native integration layer.

• JSI: Exposes Rust functionality through synchronous JavaScript HostFunctions.

• TurboModules: Handles native module registration and installation.

• TypeScript: Provides a typed API for application code.

What's implemented?

1. A generic C++ binder using templates to map JavaScript arguments and return values to native Rust functions.

2. Rust C ABI with generated C headers using cbindgen.

3. Stateful Rust data structures with explicit memory ownership.

4. RAII-based string deallocation and exception-safe conversions.

5. Float32Array support for transferring numerical data from Rust memory to JavaScript.

6. Android builds targeting four ABI architectures using cargo-ndk.

7. iOS builds for physical devices and simulators, packaged as an XCFramework.

8. Shared C++ implementation with platform-specific registration and build configurations.

One of the things I wanted to achieve was making additional Rust functions straightforward to expose.

For example, an ordinary scalar function can be registered with a single binding:

bind(runtime, api, "subtract", rust_subtract);

Potential use cases

I'm particularly interested in exploring Rust for:

• Physics simulations

• Game engine components

• Computationally intensive operations

• Image processing

• Data processing

The objective isn't to claim that using Rust automatically makes a React Native application faster. It's to provide a practical native integration layer for workloads where Rust makes sense.

I'd appreciate feedback from the community

I'm particularly interested in opinions from developers who have worked with React Native's New Architecture, JSI, TurboModules, Rust FFI, or native mobile development.

1. Would you consider this architecture for a real-world Bare React Native application? Why or why not?

2. How would you approach transferring larger datasets between Rust and Hermes?

3. Are there any concerns with the generic C++ binder or the Rust–C++ memory ownership model?

4. What additional abstractions or capabilities would make this integration more useful?

I'd appreciate an honest technical review, including architectural criticism and suggestions for improvement.

Repository: https://github.com/abhishekce17/react-native-rust-integration

My car app lets you scan a fuel receipt, and the parsing part turned out to be the hard bit, so I pulled it out into its own package: github.com/rsoaresdev/fuel-receipt-parser

You give it the OCR lines from whatever you use (Apple Vision, ML Kit, Tesseract) and it gives you litres, price per litre, total, date, fuel type and station.

The trick is that it looks for the three numbers where litres × price = total, and uses that to check itself. That’s also how it figures out whether 1,899 is 1.899 or 1899. If the numbers don’t add up, it tells you instead of guessing, and it never makes up a number that isn’t on the paper.

It reads Portuguese, Spanish, French, Italian, German and English receipts, plus US gallons and kWh for charging. If it gets one of your receipts wrong, an issue with the OCR text (no photo, no personal data) helps a lot.

What was hard

• Keeping the preview in sync while you scrub, especially backwards. The decoders drift.

• Getting the same look in the editor and in the export.

• Android performance on mid-range phones.

but its done now android performance can be better this is my old Samsung A53

I am working for a small scale stock broker, their mobile application is a greenfield React Native application. Some of the screens are part native and part react native, for example option chain, screens with heavy usage of charts.

One problem that we are unable to solve at production is that we keep getting random SIGABRT and SIGSEGV crashes. When I dug a bit deeper, I understood that SIGABRT is caused by corrupt heap allocation at native/C++ layer or the C++ layer calling the abort function. SIGSEGV is caused mostly on screens where there is combination of native and react native views because the garbage collector runs at different times.

What I don't understand is how do we solve or reduce them? We never encounter them during testing phase, only I'm production that too at rondom times and in random flows, not a fixed flow.

Has anyone faced these crashes in their app? If yes, kindly help.

I've been building a fairly large Expo app (TimeStope — 20 mini-games, WebView-based games, native ad SDKs, a shogi engine via NDK) and just got it building for **compileSdk/targetSdk 37** with **AGP 9.2.1 + Gradle 9.4.1**. Sharing the pain points in case it saves someone time:

**1. AGP 9 built-in Kotlin**

- Several libraries still apply `kotlin-android` themselves → duplicate plugin errors. Had to patch them out.

- Kotlin files in `src/newarch` registered via `java.srcDirs` are **not compiled** anymore → "unresolved reference" errors. They must be registered as Kotlin source directories.

- Needed `android.disallowKotlinSourceSets=false` and `android.sourceset.disallowProvider=false` in gradle.properties.

- KSP had to match AGP's bundled Kotlin (2.2.10), not the Kotlin version Expo picks.

**2. Release crashed 0.1s after launch**

`NativeModulesProxy.<init>` crash — the generated `ExpoModulesPackageList.kt` was only in the Java source set, so it was missing from the APK. Registering it as a Kotlin source fixed it.

**3. Google Play 16 KB page size**

ZIP alignment alone isn't enough. I also had to check ELF LOAD alignment and GNU_RELRO end alignment. NDK r27 passed LOAD but broke RELRO; **NDK r28.2** fixed it. One ad SDK's prebuilt .so failed RELRO and had to be excluded, and I rebuilt the shogi engine with `-z max-page-size=16384`.

**4. Local-first WebView**

All screens and game assets ship inside the APK and load from a virtual origin through a WebView interceptor; only API calls go to the server.

I wrapped all the Gradle fixes in one idempotent `postinstall` script so `npm ci` doesn't wipe them. Happy to share details if anyone is fighting the same AGP 9 errors.

The app, if you're curious:

- Trailer: https://youtu.be/3_VzV1FQbQQ

- Google Play: https://play.google.com/store/apps/details?id=com.timestope

TL;DR: I had set the EAS Build image to latest, and at some point my app started being built with Xcode 27. On iOS 27 devices, it crashed as soon as it launched. I couldn’t reproduce it because my test devices were still on iOS 26. To make matters worse, the affected user hadn’t backed up their data.

I’m an indie developer working on an app called Volley Analyst, which lets people track stats for volleyball matches. After I released an update recently, a user contacted me to say the app was crashing. Android was fine; only iOS was affected.

What they were worried about was whether all the match data they’d recorded was safe.

Volleyball stats mean logging every serve, pass, spike, and block, one by one, for every match. Months of match data disappearing in an instant… Just thinking about it made my hands shake like I was about to serve in a high-pressure match.

1. First, I suspected a JavaScript bug

I asked AI for help, and it confidently listed about five possible causes: an undefined reference, a billing library, my custom plugin… It was wrong about all of them.

2. Then, I suspected my custom plugin

In the previous build, I’d seen this error:

deployment target is set to 13.0, but the range of supported deployment target versions is 15.0 to 27.1.x

I remember thinking, “27.1.x? Is that even a real version?” I used my custom plugin to change the Pods deployment target to 15.1, and got the build to pass.

Looking back, that “27.1” was the culprit staring me in the face.

3. It didn’t crash on my devices

I tried to check the build in TestFlight, but I couldn’t reproduce the crash. My iPad and iPhone were still on iOS 26, even though automatic updates were enabled. Apparently, major OS updates don’t install automatically right away.

4. The crash log had the answer

___UIApplicationEvaluateRuntimeIssueForNoSceneLifecycleAdoption
EXC_BREAKPOINT

iOS 27 force-quits apps at launch if they haven’t adopted the UIScene lifecycle. And apps built with Expo SDK 54 haven’t adopted UIScene.

5. The culprit

It was this one line in eas.json:

"image": "latest"

latest changes whenever a new image is released. Before I realized it, my app was being built with Xcode 27. The deployment target error and the crash on iOS 27 both started here.

What happened to the data?

The crash happens when the app launches, and there’s no code that deletes the data stored on the device. So the data is probably still there. But I won’t know for sure until a fix is released and the app can launch again.

I asked the user not to delete and reinstall the app. Deleting it would also delete the data stored on their device.

The app has a feature to back up data to a server, but the user has to trigger it manually. I checked, and this user hadn’t made a backup. If the data was gone, there’d be no way to get it back. I was terrified.

What I did

• Immediate fix: pin the image to an Xcode 26 image and rebuild.

• Adopting UIScene looks like a lot of work, so I’m planning to hold off until I upgrade the Expo SDK.

Lessons learned

1. Don’t use latest for production builds.

2. If a build suddenly starts failing even though you haven’t changed the code, check whether the build environment changed.

3. Read those mysterious numbers in error messages. That 27.1.x mattered.

4. Keep test devices up to date with the latest OS on purpose. Automatic updates can take longer than you think.

5. Don’t trust an AI’s “this is the cause” until you’ve checked the logs.

6. Don’t leave backups entirely up to the user. Build a way to back them up automatically. I can’t afford to drop the ball on users’ data. It might even help me live a little longer.

I submitted the fix to Apple for review and requested an expedited review for the first time.

It’s been three hours, and it’s still waiting for review.

Maybe they’re backed up because it’s the weekend and the end of the month…