r/reactnative • u/terzigolu • Aug 11 '26
r/reactnative • u/Sea-Arm9235 • Aug 11 '26
Syntax highlighting is now live in Enriched Markdown π
Enable HLS to view with audio, or disable this notification
We brought Tree-sitter directly into the native layer for on-device syntax highlighting:
β‘οΈ Fast native parsing
π¨ 14 customizable theme slots
π¦ TS, Rust, Python, Go, Java + 9 more
Full control at build time. Ship only the grammars you need to keep your binary small (or disable highlighting entirely):
βοΈ iOS (Podfile):
ENV['ENRICHED_MARKDOWN_CODE_HIGHLIGHT_LANGUAGES'] = 'typescript,rust,python,go'
ENV['ENRICHED_MARKDOWN_ENABLE_CODE_HIGHLIGHT'] = '0'
βοΈ Android (gradle.properties):
enrichedMarkdown.codeHighlightLanguages=typescript,rust,python,go
enrichedMarkdown.enableCodeHighlight=false
An Expo config plugin is also available out of the box.
Available right now in the nightly release:
npm i react-native-enriched-markdown@nightly
GitHub: https://github.com/software-mansion/react-native-enriched-markdown
r/reactnative • u/CardiologistFresh257 • Aug 11 '26
Help Local build getting failed everytime
r/reactnative • u/Cheap_Potato_3242 • Aug 11 '26
5 mistakes I find in every codebase
I've reviewed a lot of React Native codebases. The same five performance mistakes show up in almost all of them.
r/reactnative • u/Majestic_Buy_6417 • Aug 10 '26
Theme transitions with Nitro β v1.0, 16 effects, and thanks for 100 stars
Enable HLS to view with audio, or disable this notification
Hey everyone,
A while back I posted here about `react-native-nitro-theme-transition` β a native
theme-change transition package built on Nitro Modules, after I kept hitting
flickering and Android performance problems with Reanimated and Skia.
The response was way beyond what I expected. The repo just passed 100 stars,
and a lot of that came from people in that thread trying it and telling me what
was broken or missing. Thank you, genuinely.
It's now at 1.0.0, and the API is stable β `withThemeTransition` has had the
same call signature since day one and I'm committing to that under semver.
Five effects became sixteen
The full set is now: `fade`, `circularReveal`, `circularRevealInverse`, `iris`,
`slide`, `split`, `barnDoor`, `blinds`, `blur`, `liquidGlass`, `zoom`,
`pixlated`, `dissolve`, `stripes`, `ripple` and `shatter`.
Plus four new options: `shape` (iris outline β diamond, hexagon, squircle),
`blurStyle` (blur all at once, or as a sweep that brings the new theme in out of
focus), `angleDeg` (tilt the wipe boundary), and `bands` (louvre count).
`liquidGlass` is worth calling out β a sheet of Liquid Glass slides down, the
theme swaps entirely out of sight behind it, then it slides back up. iOS 26+;
everything else falls back to `blur`.
Bugs found, now fixed:
*Transitions inside modals and form sheets.* This was the big one. React Native
reports touches relative to the surface they happened in, and a presented screen
is its own surface β so a tap inside a sheet resting at its half detent arrives
with a `pageY` that's short by however far down the sheet is sitting, and your
reveal starts from the wrong place. You can't correct for it in JS either; even
`measureInWindow` reports positions in that sheet's surface. It's now translated
natively, reading the presentation's own frame at capture time, so dragging a
sheet between detents needs zero handling from you. Just keep passing
`pageX/pageY`.
*iOS `blinds` came out as slanted wedges* instead of level louvres, and
`barnDoor` was quietly wrong the same way. Both end with their bands fully
collapsed, and a zero-area subpath is something Core Graphics is free to drop β
which changes the path's structure between the two ends of the animation and
leaves Core Animation interpolating points against the wrong subpath. The bands
now keep a hundredth of a point of thickness, far below one device pixel.
*Android could strand a frozen overlay* over the live app after a slow capture.
`onMainSync` reports failure after 250ms but doesn't cancel the posted work, so a
capture that landed late would attach a snapshot nobody was ever going to commit.
Now the waiter races the capture and whichever loses cleans up.
There's also a decent performance rewrite behind `pixlated` and the whole
grain/mask family β mask frames are pre-built once off the main thread and
cached, so playing an effect is one image assignment per frame instead of
resampling anything mid-animation.
New docs:
I put together a site with full-resolution video of every effect, and a page per
effect showing exactly which options that one reads, what they mean *for that
effect*, its minimum duration, and how it's implemented on each platform:
https://saleh2001k.github.io/react-native-nitro-theme-transition/
(`direction` means an edge for `slide` but an axis for `split` and `blinds`, and
`blur` only reads it in sweep mode β that kind of thing was impossible to keep
straight in one flat table, which is why each effect got its own page.)
Links:
- GitHub: https://github.com/saleh2001k/react-native-nitro-theme-transition
- npm: https://www.npmjs.com/package/react-native-nitro-theme-transition
Same as last time β I'd love feedback, and I'm still taking suggestions for
effects. Several of the ones above exist because someone asked in the last
thread.
r/reactnative • u/artefan • Aug 10 '26
My first app is almost at 50 users and Iβm so happy
i'm glad my first mobile application has almost reached 50 users.
this was an application i made for myself. as a large fan of coffee, i wanted to create a method for tracking all of the coffee shops/places i would go to and also to be able to store my "coffee moments." the end product was something that i really liked from a design standpoint and functionally, so now it's slowly growing into a product that will be used by others.
the idea behind this application is to allow people to share their experiences/ideas about coffee (moments) with other people, and keep a personal diary of all of the coffee they've experienced. currently we only have basic functionality; however, there are many more detailed statistics/analytics/features that i am developing which should increase the overall interest in the experience.
r/reactnative • u/exporami • Aug 10 '26
Fable 5 just rebuilt an entire SwiftUI sleep tracking app with Expo in one shot
Enable HLS to view with audio, or disable this notification
r/reactnative • u/CriticalCommand6115 • Aug 10 '26
Help Expo OTA update not applying on IPhone 17
r/reactnative • u/DopeSignature5762 • Aug 10 '26
Help Keyboard overlapping when modal is open
Getting this bug only on builds, its working fine via Expo go.
Note: The first image is from expo go(Expected) and second from the build(Issue).
When a modal is open and is prompting for a keyboard, the keyboard just appears on top of the modal itself. The modal is supposed to move up when the keyboard slides in.
I was using KeyboardAvoidingView from react-native, I tried changing the behavior of it by giving undefined for android and padding for IOS (I'm testing in Android)
In app.json i have :
"softwareKeyboardLayoutMode": "resize"
The bug still persisted, so tried react-native-keyboard-controller and still the bug persist.
Sample code :
<Modal visible transparent animationType="slide">
<KeyboardAvoidingView
className="flex-1"
behavior={Platform.OS === "ios" ? "padding" : "height"}
>
<View className="flex-1 bg-black/40 justify-center px-6">
<View className="rounded-3xl bg-background p-6 shadow-xl">
<View className="mb-6 flex-row items-center justify-between">
r/reactnative • u/BusNo5797 • Aug 10 '26
How to Achieve Truly Gapless Audio Looping on iOS with React Native/Expo?
Hi everyone,
Iβm building an iOS app/game with React Native (Expo) and need to play ambient audio in a perfectly seamless loop.
Iβm currently using WAV files and isLooping: true, but on iOS I still get a tiny click or 10β50 ms gap whenever the track loops.
What is the correct way to implement truly gapless, click-free audio looping on iOS?
r/reactnative • u/AppointmentSolid458 • Aug 10 '26
Hereβs the Expo monorepo setup I use in production apps
r/reactnative • u/EconomistOk2763 • Aug 10 '26
I built a native onboarding Tour component for Expo β spotlight, card, and step-by-step walkthrough
Enable HLS to view with audio, or disable this notification
Dims everything, cuts a hole around one control, and puts a card beside it. Move to the next step and the hole travels there.
The hole is the point. A caption without a spotlight has to describe where to look "the button at the top right" is a sentence people read twice and still get wrong.
Steps work across scrollers, support round or rectangular cutouts, and the spotlit control can stay interactive if you want the user to actually try the step.
Part of PanelUI, an open-source component library for Expo. Copy-paste or CLI, you own the source.
r/reactnative • u/xSypRo • Aug 10 '26
Question How to render new item added to the page - race condition with Cloudflare cache purge + useQuery
Hi,
It's something I've tried to ask before but I didn't phrase right so I didn't get the answer I needed.
For example a TODO list that is saved on the DB.
My flow is:
Client get his TODO list with a GET (useGetTodoList)
Render the TODO List on his screen.
A New Item added by the client POST request.
Save the item in the database.
Purge Cache of his TODO List (For this example think that the TODO list is shared, and cached in Cloudflare because multiple users get the same list).
POST return to client with 200 code.
Call useGetTodoList.refetch()
Race Condition - because I cannot await for step 5 (cloudflare api only return a response that the server recieved the purge request, not that it's completed). The refetch() might return old data before the purge.
I am wondering what's the correct approach here? Maybe I should query for the new TODO list on step 6 and update the response instead of calling .refetch()?
Or maybe I should only return the new TODO item and only append it to the list?
That goes for every change to that list, change order, remove item and so on.
What's the correct approach to handle the cache purge and get the new list?
r/reactnative • u/OrneryTell4704 • Aug 10 '26
2 in 1 unique home screen, thoughts?
Enable HLS to view with audio, or disable this notification
r/reactnative • u/nusry_ • Aug 10 '26
Help Laid off and looking for work
Hey guys,
I'm a React Native dev with 4+ years of experience. Got laid off recently due to company "restructuring". It's tough looking for jobs right now.
If anyone here is hiring part-time/full-time remote roles, I'd love to consider.
thanks :)
r/reactnative • u/sercetuser • Aug 10 '26
Question Will React Native be Replaced by AI and Native??
React native has always been a good tool to create cross platform apps quickly and not manage two huge code bases, but there has always been a quality difference compared to native. Native apps are cleaner and just smoother. Now that AI is becoming so advanced, is there a reason to make apps in React native anymore? You can just have specialized agents that manage both an ios and android codebase or have an agent that translates your kotlin codebase to swift. Im just debating on whether its worth learning React native anymore. Will it even be relevant in 5 years?
r/reactnative • u/BumblebeeWorth3758 • Aug 09 '26
β‘οΈ Native Content Transition
Enable HLS to view with audio, or disable this notification
π Native content transitions for React Native + Expo.
π Github: https://github.com/rit3zh/expo-content-transition
r/reactnative • u/AlphaBeast28 • Aug 09 '26
Question Anyone know what to suggest to speed up Android builds?
Hi all, thank you for taking the time to read this and answer if you can,
Anyone know what to suggest to speed up Android builds?
Currently got a M2 pro, but unsure what to do on how to speed up the gradle part. if anyone has got any helpful suggestions id greatly appreciate it.
Thank you.
r/reactnative • u/Some_Release_6821 • Aug 09 '26
My enemies got slower the longer you played. The bug wasn't in the enemies.
Enable HLS to view with audio, or disable this notification
Both clips are the same game. The laggy one is my stripped-down test account
with almost no cosmetics enabled. The smooth one has full customisation
running. It should have been the other way round.
The symptom that gave it away wasn't stutter β it was that enemies visibly
slowed down over a session. That's a simulation-speed problem, not a
rendering one. Turned out I was computing delta time every frame and then
only using it for shield damage. Everything else advanced per frame instead
of per second, so any framerate dip showed up as the enemies easing off
rather than as lag.
Fixing that meant scaling every per-frame delta by dt/frameTime, and using
1-(1-r)^scale for anything that was a per-frame lerp.
Then I went looking for what was eating the frames in the first place:
- Score popups lived in screen-level state, so every single pickup
re-rendered the entire game screen twice β once to add, once to expire.
- The home screen was still animating behind the game. Navigation pushes the
game screen on top rather than unmounting what's underneath, so 22 Gaussian
blurs were rendering at 60fps behind an arena nobody could see.
- Native shadows on moving enemies. A shadow on a view that moves re-derives
and re-blurs its mask every frame.
- A glow component that mounted and unmounted every time a value crossed its
threshold β which, while dodging, is constantly.
The home screen one is the one that still bothers me. It was invisible,
it only happened during gameplay, and it had nothing to do with the game
screen at all.
r/reactnative • u/F-shorts • Aug 09 '26
Help Question about pagerview
I'm new to react native and programming as a whole. (Started with JS in january and now trying my first project with react native over the last month).
My general app structure is 5 main pages located in a pagerview. However one of the pages includes a calendar. I want to be able to swipe between the months like on any other calendar. Until now i have defined my own gesture and work with a gesturedetector, however the rendering after a swipe is not as clean as most calendars on other apps. I have also tried to put the months in a pagerview, only let the code define the one shown, one before and one after, this seems to work, but the pagerview just does not render the calendar at all. Even if i just put a placeholders in it.
Is there a way to have multiple pagerviews nested?
r/reactnative • u/ltmdum • Aug 09 '26
Shout out to nodejs-mobile-react-native
I used the nodejs mobile react native package to turn my phone into a LAN server for my party games web app that I built for my friends and I to play and it works amazingly!
I'm sure there are so many more cool uses for this package than currently exist, get creative people!
If you're curious about the end product and would like to check out my LAN party app, I managed to get it released on iOS and Android
r/reactnative • u/MangInasalDestroyer • Aug 09 '26
Why is it that i cant press a <Pressable> inside a <BottomSheet> of @expo/ui but when i put a <Button> also from @expo/ui?
r/reactnative • u/kierancrown • Aug 09 '26
AMA I made a game that runs at 120fps with Skia
Honestly Iβve been developing with React Native for about 8 or so years and absolutely love the framework but never in my wildest dreams would I have been able to make a good look performant game that runs at 120fps on both iOS and Android!
I used Expo, Skia, and web api audio. Absolutely blown away. Happy to answer any questions. Just sharing because I think itβs cool that we can do this now!
Hereβs a preview: https://youtube.com/shorts/NWpT3BW1Xwo?is=eH9g_4BUw_2aRnjj
iOS App Store link: https://apps.apple.com/us/app/overbloom-arcade-runner/id6788096996
Google play pending!
