Kenneth Brattli

react native dev. built MobyLity and Auroracle
4000 monthly downloads

[Kenneth Brattli @KennethBrattli]

@betomoedano By 500 being restored they are admitting they are terminating people by mistake as well. And considering their customer service, id guess the number is a lot higher

[Kenneth Brattli @KennethBrattli]

Got tired of app-showcase products wanting $20/month, so I built a free one.

Put your screen recording into Claude, say something like “make a showcase, iPhone 15 Pro”, and you get this:

By no means perfect but hey.. it’s free

https://t.co/oU82UstL1C

[Kenneth Brattli @KennethBrattli]

@jeff_okoli Im amazed it was possible without deferring my weather background like they did, and it was by far my most expensive component

[Kenneth Brattli @KennethBrattli]

My tips for faster mount times:
1. Defer off-screen components
2. Use less expensive UI alternatives (e.g. RN Nano Icons)
3. Don’t block the JS thread (e.g. run heavy math and render loops on Worklet Runtimes)
4. Use RN Teleport to move mounted views instead of remounting them

[Kenneth Brattli @KennethBrattli]

@lowkhieyed @audenwww Id try double check that api calls are not blocking any threads and run concurrently (not wait for eachother). If they do heavy data transformation, consider run on a new worklet runtime. If they modify reactive state, check that the re-renders are small and rare as possible

[Kenneth Brattli @KennethBrattli]

@audenwww With Claude + argent it’s not too bad 😛. For me when it comes to what i prefer debugging: JS thread > UI thread > GPU

[Kenneth Brattli @KennethBrattli]

@dorian__mazur It would be really cool for it to be used in a library like yours, so if you consider it and it lacks any features please let me know. So far it supports stuff like Core Animation, Squircle, boxShadow. But the API is a bit of a mess 😅

[Kenneth Brattli @KennethBrattli]

@dorian__mazur Im using my own library, ive added the animation here in the example app of the project if you are curious. Its not really a screen transition library but instead a primitive to make resizing views as performant as possible for screen transitions:
https://t.co/UxLQ9UUkiZ

[Kenneth Brattli @KennethBrattli]

@ziusko But i couldnt find any mount benchmarks of the exact same screen in Swift and RN to see how much the RN render pipeline adds to confirm this. Considering making one myself 😄

[Kenneth Brattli @KennethBrattli]

@ziusko My personal belief is that the JS overhead is super small. So the fastest language is whatever makes it easier for you to make smart render optimizations

[Luke @luke_h1__]

Open source Friday

I’ve open-sourced a small part of Tightlog: the sync API.

It handles local (expo-sqlite) <> remote SQL synchronisation, Apple attestation, media uploads, RevenueCat entitlements, rate limiting, and more.

source code 👇
https://t.co/5p9nkwEr4E

[Kenneth Brattli @KennethBrattli]

If you’re going to learn c++ you might as well do it in Italy

[Kenneth Brattli @KennethBrattli]

@margelo_com Do you know how it compares to victory native xl? Its also built on top of skia

[Kenneth Brattli @KennethBrattli]

Thanks for shoutout :D , for anyone interested this is the library i created: https://t.co/UxLQ9UUkiZ
It can resize views without any js thread, and on ios: zero ui thread with Core Animation.

[Ed @trpfsu]

native clip is a small native view im experimenting for screen-transitions. On android it uses canvas.clipPath and iOS CAShapeLayer.

The idea was to animate the clipping boundary while keeping the content's layout fixed avoiding per frame layout resizing which we currently do for zoom transitions which makes android suffer a ton. Super excited to see how this pairs with longer zoom flows

https://t.co/G0gx2pkR2J

But also creds to @KennethBrattli for bringing this up and motivating me to start working on this

[Kenneth Brattli @KennethBrattli]

@iwoplaza Well deserved

[Kenneth Brattli @KennethBrattli]

@ziusko Nice this is much better and also works if the component is changing visually during the transition

[Kenneth Brattli @KennethBrattli]

@ziusko Here you go :D, the only difference is react-native-teleport v1.2.0 vs v1.1.12

My previous workaround was screenshotting the map and overlaying the screenshot during the flicker

[Kenneth Brattli @KennethBrattli]

@tivollem UGC IA

[Ed @trpfsu]

family tray achieved in react native screen transitions 🤨🤨🤨🤨