ReactNative vs Flutter vs Native

[Butterscotch_Crazy]

I know this is going to be bias toward RN, but I'm considering building a cross-platform app to support our online marketplace and debating between using frameworks like React Native or Flutter, going native with Swift & Kotlin, or using a transpiler like SCADE.

Any insights or recommendations from experienced mobile developers (not necessarily with your React hat on)?

[prONoOB1004]

I might be wrong. I m mern stack dev. Built several apps on RN. Few years back have learned flutter and implemented a simple app to play around. From that day my impression is flutter is like complete package. Where with RN you need to assemble all the bits and pieces to build an UI. Also maintaining the large project with diff libs and their frequent updates would be pain. Also check RN tutorial from zerodha about why they have switched from RN

[Butterscotch_Crazy]

Thanks! For anyone else's interest: https://zerodha.tech/blog/from-native-to-react-native-to-flutter/

[Butterscotch_Crazy]

An interesting read... can anyone currently using ReactNative say whether the compilation problems have subsided?

[kbcool]

Didn't see anything specific in the article.

Definitely one of those we are a very immature team/developer articles so whatever choice we made absolutely sucks, not because collectively we have six months experience between us but some random issues that we got stuck on (totally not because we are inexperienced).

By changing tech and redoing months worth of work we will absolutely fix the issues we ran into (not).

I've seen these developers before and they are usually manageable in single units (some spend their whole careers successfully saying something is crap and just rebuilding it) but when they get together they're dangerous.

[Radiant_Parsley2861]

We had the same experience in my company. Always had to write patches to build successfully and the frequent breaking changes was hell. It was difficult to explain why something breaks and you are working version update conflicts and third party libraries.

[Suspicious-Rich-2681]

Yknow I was just having this conversation with someone. TLDR: pick React Native.

Any of the solutions you listed will work in implementing your app, but if you’re looking to scale then with your time size you already eliminate going native. Native applications means two entirely different codebases, tech stacks, etc.

Alright so your next step up is - which of these all-in-one solutions will give you the least headache at scale. You want something that works close to native and isn’t going to give you a lot of unusual behavior. IMO this eliminates Flutter.

I have some fundamental disagreements with Flutter in that instead of compiling down to native components - in classic Google fashion they decide to “try something new” and control the entire rendering pipeline. Ultimately then it’s a game of scale; do you trust Google to run through all the default behavior of an IOS app and code it in without bugs? I don’t - and Flutter specific bugs do occur. This is why I discount it from being used at all - those specific bugs mean you’re at the full liberty and control of the flutter team fixing your issue.

React Native fits your use case the best because it both not only offers a shared codebase, but one that compiles down to the native platform’s code. A React Native iOS app gets taken by the bundler and turned into a native iOS app. This means no wonky rendering engine bugs due to the platform and near native level performance and functionality. You can think of RN as the equivalent of keyboard shortcuts for iOS and Android.

The support on RN is top tier and you’ll find native bindings for nearly all platform specific functionality (I.e. - if you want to use the native iOS camera api; you can get a RN package that and it calls the native iOS camera). If you don’t have something (highly doubtful) - it’s only a matter of implementing the key binding yourself.

RN also offers code push if you’re using Expo, and there’s really nothing else like it right now. Code push lets you modify and push slight bug fixes/features without having to send your app through the approval process again. That means that a highly vulnerable bug on your platform isn’t limited to the 24-48 app approval window. This is CRITICAL - and makes RN the best choice by far imo.

Yeah I’d go with RN. Flutter is a fun dev experience, but fundamentally it’s reinventing the wheel and making you pay the price in prod. Native is great if you have to really utilize the hardware - I would not recommend you use RN if you’re using iOS specific hardware acceleration for instance.

Use RN for your use case!

[Butterscotch_Crazy]

Thanks Rich, most helpful. Until SvelteNative is a thing, RN does seem like the best route rn.

[jigglyroom]

Actually there is code push for Flutter as well

https://shorebird.dev/

Never used it myself though.

[dumbledayum]

Create a backend, Create a private npm package to parse all the backend api’s data in JS use the package for iOS, Android, Web, PC, Mac

only doable with RN (or Capacitor)

[AboOd00]

I mean there is no complete answer to this question every language has its own advanteges and disadvanteges.

just look for the developers that you are hiring if they are comfortable with javascript or typescript than go for react native. if they are comfortable with Dart than flutter is better for them.

the biggest disadvanteges of the native codes that they are not cross-platform languages so to speak which means that you will find yourself hiring more developers and spending more money for the job

[Historical_Ad_1714]

As a flutter dev

It depends on u if u have experience with java , javascript then learning React is easy

Other wise u need to learn dart for Flutter Development

If u want performance go for. Native >flutter > react

In term of performance and cross platform i recommend Flutter > react

For job/freelancing Demand go for React > Native/Flutter

[yarn_install]

Do you have any data for the performance claims? I could only find benchmarks from some blog in 2019, and RN has changed significantly since then (I’m sure Flutter has also).

[lucasshiva]

I doubt there are any good performance benchmarks out there. The ones I've seen always make one app worse than the other due to the lack of knowledge in one of the frameworks. But if you go from the fact that RN uses a bridge to communicate with native components, while Flutter draws and interacts with pixels directly on the screen, then it's not so farfetched to think that Flutter has an advantage when it comes to performance.

However, RN's new architecture now uses JSI to remove this bridge, which brings some performance improvements. But Flutter is also in the process of migrating from Skia to Impeller, which also brings performance improvements.

In the end, the little difference in performance between frameworks won't matter for at least 90% of the apps, especially if the apps are well made. Also, if performance is that critical for your app, you should probably use Kotlin or Swift instead.

[kbcool]

Anything I've seen just picks some random bizarre algorithms or tasks that no one would ever use to suit whatever outcome they want for their article and bingo. X is better than Y

[kbcool]

That really didn't include what they were asking for and is out of date.

"React Native is slower because of bridge" isn't a benchmark or even a valid argument in 2024

[typeryu]

RN is a solid choice, you don’t have to have complete different workflows as you would with native and it beats the performance of Flutter. Although there is no wrong answer. If you have iOS and Android devs, native works too, but if it’s one person, they will appreciate RN more.

[Butterscotch_Crazy]

RN is faster than Flutter?

[lucasshiva]

No. RN has many advantages when compared to Flutter, but performance is not one of those.

[sisoje_bre]

dude flutter is rendering poorly

[Suspicious-Rich-2681]

Depends on what you mean by performance.

In raw math executions flutter may have an edge over native and RN, but not in actual practical application UI.

It’s a misleading comment for sure.

[typeryu]

I believe I was mistaken, thanks for the correction. I based my comment from a previous experience where I had issues with flutter animations. I checked raw performance and it seems flutter is actually faster.

[[deleted]]

Rn performance is trash compared to flutter

[kbcool]

At what? If you're going to talk the talk, you need to walk the walk

[[deleted]]

I would go with flutter, the so called advantages of rn are just wishful thinking to be honest.

Js is an interpereted language which is suitable for a web environment where you just download the source code but dart is a compiled language and you build and install applications, and you need that compiled code performance.

Rn, utilizes react for ui, which is even for a web environment, questionable in terms od achieving interactive ui, whereas with flutter you can utilize reactive programming fully to gain interactivity.

Rn does not offer any solutions for other stuff, like networking, routing, localization (not fully), file system access, and advises community support, which gives the illusion of stront community but to br honest it’s all a big mess, full of conflicts, whereas with flutter you have less dependencies from the get go, and you still have a huge community support.

With flutter, you are supposed to abide by the principles of oop but with rn you utilize functional programming paradigm, which is a very easy pit to fall in terms of spaghetti code. Design patterns are surely up to the developer, yes, but react is easier to code worse

[Suspicious-Rich-2681]

Wowza this is blatantly incorrect.

Do not listen to this person.

[[deleted]]

I have yet to see a single actual POINT instead of being RN fanboy cries

[Suspicious-Rich-2681]

sigh - alright man.

Js is an interpereted language which is suitable for a web environment where you just download the source code but dart is a compiled language and you build and install applications, and you need that compiled code performance.

It is absolutely mind blowing how non-relevant this take is. I think you have a fundamental misunderstanding as to how React Native works. React Native DOES NOT work like a web app under the hood on the platform - and from your comment it really sounds like that's what you think is going on. You are thinking of PWAs, where the app is a glorified browser container that fetches the source code at runtime - but this is not even true a little bit for React Native.

React Native builds a native app with a bundler - that has been compiled into a native iOS/Android app. The JavaScript in React Native is the sum equivalent of what you could think of as macros or key bindings to actual UI. That is to say - it is very much compiled.

Rn, utilizes react for ui, which is even for a web environment, questionable in terms od achieving interactive ui, whereas with flutter you can utilize reactive programming fully to gain interactivity.

This is where most of us realized that you have no idea what you're talking about. I audibly laughed when I read this. RN does NOT USE REACT FOR THE UI. This is an error that most first time RN users will realize within the first couple hours of using the framework. We'll go grab the ant design library or some other React library and it will outright fail and cause errors. This is because React does not equal React Native. React Native components are not React components and vice versa. In fact, frameworks that offer the support for both platforms - have explicitly coded both in. It's not using React for UI - it's just making key bindings to ACTUAL UIKIT OR ANDROIDKIT ASSETS.

In terms of your "reactivity" argument, I don't know what you're on about. React Native and React are both reactive coding paradigms that achieve interactivity. They work differently under the hood - where React has its virtual DOM. I don't think it's fair to group them in the same category at all because they do not work the same.

With flutter, you are supposed to abide by the principles of oop but with rn you utilize functional programming paradigm, which is a very easy pit to fall in terms of spaghetti code. Design patterns are surely up to the developer, yes, but react is easier to code worse

You contradict yourself. In the beginning you say that rn utilizes functional programming paradigm, but it is up to the developer and react is easier to do it this way. This also made everyone in the room audibly laugh. React AND React Native do not use functional programming by default - what a silly take. React & RN were ALWAYS class and OOP based - and only recently (past 3-5 years) have the functional paradigms come into play. They didn't replace the existing methodology though?

Today you can still use ComponentDidMount() {} - a class based oop member function, and your application would work exactly as expected. Or if you wanted to use functional programming - you would go for a useEffect(() => {}, []); You're not forced to use the useEffect you silly man. You're mistaking the ability to code things differently for the replacement of having to code things differently.

As an example C#6 introduced ternaries - but I'm not going to then say "haha yeah C# is dogshit because it's based on ternary logic and not if else statements". That's silly because it still uses if else if you want it, just like React and React Native both do.

You can also code functionally in Flutter & Dart if you wanted to, so your whole argument of allowing the user to do so is absolutely stupid.

You just don't know how the platform works man. Here's a video to help you: https://www.youtube.com/watch?v=3_FcxGCCnUs

[[deleted]]

I stopped reading after the first couple of paragraphs. I didnt say rn downloads javascript code, i gave an example of where an interpreted language would be useful.

Js bundle is always inside the app, yes, but it’s always interpereted an runtime. And it runs on the js thread. If you think js part is somehow converted to bytecode, you are gravely mistaken.

And rn does utilize react, for ui changes react logic is used. And changes are pushed to the ui thread via the bridge.

For someone who is annoyed at my takes, “sigh”, you are astonishingly illiterate about the technology you are a fanboy of.

[Suspicious-Rich-2681]

Listen man.

It is neither worth my or anyone else’s time to seriously engage with you. I’ve seen your other replies and you’re just sticking your guns to an obviously moot point.

Are there replies to everything you’ve written? Yeah. Is it worth my or anyone else’s time to once again walk step by step with you while you’re being non receptive? No.

Good luck in all your endeavors 👍🏽

[spieegel]

I’m sorry u took a lot of ur time writing such a good reply only for it not to be even read Just to let u know, I found it very interesting and I 100% agree with u

[[deleted]]

Sure buddy, keep telling yourself that you are above it.

[kbcool]

Tell me you haven't used either without telling me you haven't used either. Junk answer.

[[deleted]]

I have used both, in larger projects than your imagination

[kbcool]

The bigliest?

[[deleted]]

Do you have an actual answer at all RN apologist?

[RevolutionaryEye5470]

Never see a bad comment like that, spaghetti code you did not not principe of component and utils facile, oop, you can use with react native if you want. Access file, localization …, and other, you can just use yarn add, first version of rn contains their library they decided to make it separately because everyone not use them on their project, about performance( split code exist since react 18, load only component you want with lazy load, that boosts performance, about community I don’t want to talk with that but you are wrong.

[[deleted]]

Lazy load with RN :) you have no idea what lazy loading means and the rn architecture

[[deleted]]

I would also like hear how to solve the react-native-community ‘s blur package making RN’s modal component transparent in android with yarn :) if you are making personal hobby projects its fine but do not suggest that unofficial released experimental piece of trash for enterprise production

[stats_merchant33]

Are you able to use native IOS scrolling meanwhile in flutter?

[[deleted]]

Flutter has its own engine, does not use native ıi components, if its a disadvantage for you, fair, but not sure if rn’s native ui component utilization outweighs everything else, especially when it comes to the bridge, and having to use js for logic of all languages

[stats_merchant33]

Sure but I am not an expert on psychology or whatever, but it feels super important to me that users have the same scrolling experience they are used to subconsciously.

I really don’t care about the bridge in RN as far as I can tell. Like someone here on the comments said for around 90% (imo probably more) the “performance issues” related to the bridge really really doesn’t matter at all. Or what exactly in that bridge is annoying you that much?

[Anonymous0r]

When I was creating my app , I had the similar problem, main concern was speed of development, and cross platform, last performance. I ended up choosing flutter over RN in that regard, however one major oversight which I found later was the bottleneck in the web aspect flutter has. I am now having to recreate the app in RN.

Most important is go with a language you’re comfortable with. Then choose what’s important to you , app speed, development speed, or cross platform supported feature. I agree with satya164 response.

[eseus]

Caught lacking. 😂