In this episode the crew, joined by our friend Hodeem Miller, revisits some older common complaints about React Native to see if those critiques are still true today.
In this episode the crew, joined by our friend Hodeem Miller, revisits some older common complaints about React Native to see if those critiques are still true today.
This episode brought to you by Infinite Red! Infinite Red is a premier React Native design and development agency located in the USA. With five years of React Native experience and deep roots in the React Native community (hosts of Chain React and the React Native Newsletter), Infinite Red is the best choice for your next React Native app.
Helpful Links:
Connect With Us!
Todd Werth:
Welcome back to React Native Radio podcast. Normally I get about six seconds to make these stupid jokes, but because of inflation I'm going to require eight. Episode, 247, revisiting common complaints about React Native. Five years later with Hodeem Miller
Jamon Holmgren:
The other day. My tractor actually had a weird bug and I'm wondering if it's something that... Can I do a weird bug about my tractor on this program? Or is it built in JavaScript? Isn't everything these days? I mean, I feel like it is. It's a 2012 tractor.
Robin Heinze:
I'm pretty sure everything is.
Jamon Holmgren:
Maybe it's in JavaScript.
Robin Heinze:
I think you need an upgrade.
Mazen Chami:
You should get the Tesla tractor.
Jamon Holmgren:
It's probably in ECMA-3.
Robin Heinze:
You should get the M2 tractor.
Jamon Holmgren:
Let me tell you about the weird bug. So I was having this weird thing where, well, okay, it all kind of coincided all at once. So it really confused me. Because you know how the worst bugs are where there's two bugs that are interacting with each other and that was what was happening.
Robin Heinze:
Yes.
Jamon Holmgren:
So first off, I had a hydraulic leak, so it was leaking underneath my tractor and I had my buddy come over because all the tractor repair places were just jammed. They couldn't... It was like six weeks out. So my buddy who is pretty handy, pretty good, he's not a mechanic, but he works on his own stuff. He came over and he replaced all the hoses and stuff and got it working again. When I went to use it was working fine for a few minutes and then all of a sudden the bucket, the front loader just started going really slow, super slow.
It would still work, it still had plenty of power, but it was just in super slow motion, which made it really, really awkward to use. I was trying to move some dirt back and forth, fill my flower gardens and get things kind of leveled out and stuff. And it was so awkward because I just have to sit there with the lever forward waiting for the bucket to come down. I was like, "What is going on with this thing?" And then I would leave it sitting for a while, not running and then I'd come back and start using it. It'd be fine, it would just worked just fine. And then a little while later it would all of a sudden immediately just go really slow. It was slow motion. I'm like, "I don't know what's going on with this." Such a weird bug. So I was just kind of like, "Well..." I asked my buddy, he didn't know what was going on.
He was like, "I don't know, are there any leaks?" Check... He had me top off the hydraulic fluid, make sure it was all... Nothing worked. So I was like, "Okay, I need to do this project." Because I needed to... I've got these French drains and I needed to clean them out and get ready for winter because basically they've been a little bit slow to drain. So I was using my tractor and it was working pretty well, but going kind of slow to dig these things out. Then I left it for a while and then I came back and it was working fast. I was like, "Okay, cool, maybe I can go for a while." And I was going for a while with it working just perfectly. And then I looked behind me. I noticed that the three point hitch, which three point hitch is the thing on the back of the tractor that can lift the implement on the back of the tractor up and down.
It's like three arms that go up and down. It was lower, it was drooping. And I'm like, "Oh shoot. Well I got to lift that up." So I just reach over to the lever I do all the time and I pulled it up and it came... Pulled it up so it's not dragging in the dirt or anything. And immediately my bucket's slow. I'm like, "Ooh, wait a minute here. This seems related." And what I figured out was that the three point was going up to the top and then continuing to try to go up, which was taking a lot of the hydraulic power away from the loader. So just by dropping it by one inch, it stopped doing that. It was just like, "Okay, I'll just sit here." And everything worked fine. So, that's my weird bug. I can't lift the three point all the way to the top. I have to leave it an inch down so that my loader will work, how it's supposed to,
Robin Heinze:
You really put your debugging skills to work.
Jamon Holmgren:
This is like... It's been happening for two weeks and I just noticed that every time that it would go slow, it was because I was lifting that three point, which tends to kind of droop down because it's old like me. And things tend to droop when you get old. Why are you laughing like that, Robin?
Robin Heinze:
Todd's going to have fun with that one.
Jamon Holmgren:
I guess I should get to intros. I'm Jamon Holmgren, your host friendly CTO of Infinite Red Tractor Driver, all those other things. I'm located just north of Portland, Oregon and Vancouver, Washington. And I live there with my wife and four kids on three acres. I'm joined today by my first class co-host.
Mazen Chami:
Ooh, I've always wanted to travel first class.
Robin Heinze:
Not business class?
Jamon Holmgren:
Business class. It says first class here, so I got to roll with it. Robin and Mazen, we do have a guest as well who I will introduce in just a bit here. Robin Heinze is a senior software engineer at Infinite Red. She's located west of Portland, Oregon with her husband and two kids and has specialized in React Native for the past five years. Mazen Chami lives in Durham, North Carolina with his wife and baby boy. He's a former pro soccer player and coach and is a Senior React Native engineer. Also, here at Infinite Red. Our guest today is Hodeem Miller. Hodeem is the Jamie Fox of JavaScript, according to his Twitter bio. I love that. He's from Kingston, Jamaica and is a software developer at Smart Mobile Solutions. Before that, he was a mechanical engineer. And it says here that you blew things up for two years. Apparently you did demolition of some sort.
Hodeem Miller:
Yes, I did. Blasting in the quarries. Yes.
Jamon Holmgren:
In the quarries. Yeah. That is an interesting job.
Robin Heinze:
That just sounds like the...
Jamon Holmgren:
No kidding. Yeah, just blowing things up. This episode is sponsored by Infinite Red. Infinite Red is a premier React Native design and development agency located fully remote in the US and Canada. If you're looking for React Native expertise for your next React Native project, hit us up at infinite.red/reactnative. By the way, did you know that we have a new sponsor coming? We do.
Robin Heinze:
What?
Mazen Chami:
Are we going to leak it?
Jamon Holmgren:
Nah, I'm not going to leak it.
Robin Heinze:
Are we going to tease it?
Jamon Holmgren:
No.
Robin Heinze:
Come on, tease it.
Mazen Chami:
Do it.
Robin Heinze:
Oh, this is kind of teasing it. Make sure to keep tuning in to see who the new sponsor is.
Mazen Chami:
Gets the credits at the end.
Jamon Holmgren:
You got to listen all the way through. That's mean, Mazen. That's mean. But there is a cool thing after the credit, so you should still listen. But yeah, there is going to be a new sponsor. I can't leak it, I really want to leak it, but I can't. Yeah, just stay tuned. Keep listening. Hit that subscribe button. Go hit that. What, review. Give us a review. Hey, I never asked for reviews. I never asked for reviews. Everybody has to acknowledge that you have to go give us a review though.
We don't have enough reviews on iTunes, on Spotify, other places like that, lets do that. Don't forget to mention that you heard about us through the React Native Radio podcast. Okay, let's get into our topic for today. The title is Revisiting Common Complaints about React Native, Five Years Later, Hodeem wrote an article called What's Hindering React Native now. And he kind of went through and found a bunch of common complaints from four or five years ago and wrote them out into an article. First off Hodeem, what sort of caused you to write this article? I'd love to hear what the impetus was behind that?
Hodeem Miller:
Okay, well for me, I've been using React Native for some time now and I really liked it because who doesn't? And I was wondering "What is it that is stopping this thing from becoming more popular?" Right? So I went all the way back as far as I could and I dug up every complaint that I could find. And as I was going through the complaints, I recognized two things. One, that there were common patterns among the complaints, and two, that I really could not relate to many of the complaints.
So for me, this was an experience. When you're talking to friends of your parents and they're telling you stories about your parents and what your parents used to do. And it's really confusing because it's like, "Are we talking about the same person? This sounds like a complete stranger. I've never met this person in my life." And I was just having this experience with React Native. So I was saying, "Okay, if I'm going through this list of complaints and I'm not connecting with many of them, then what are the issues that are stopping teams and developers from using React native today?" So, that was the motivation behind the article.
Mazen Chami:
So I know you mentioned that you were a mechanical engineer when you shifted into software engineering. Can you give us a little bit more about your background? What led you into React Native? Did you start off with React Native?
Hodeem Miller:
Okay, so I fell in love with software development by accident, right? So what happened was I was getting some agricultural data by email in Excel sheets and PDF documents and they were coming each week in discrete samples. And I didn't want to pull up every single Excel document and extract all the values manually. And then do you know calculations?
So I said, "You know what, computers are pretty smart and they're fast. So I'm going to get my computer to do this for me." So my first project was actually based in Python, but then after a while, you stumble around, you say, "Okay, I want to make this into our website, then I want to make this into a mobile application." But when I said, "Okay, let me make this into a mobile application." Java for me just looked way too bulky. So I was like, "No, there's no way I'm going to be using this." I knew some JavaScript and after doing some Google searches that came across React Native, never heard of it, but they said you could use JavaScript to write a mobile app for both Android and iOS, now to me that was the coolest thing ever. So, that's basically how I came across React Native.
Mazen Chami:
That's cool.
Robin Heinze:
That's such a common experience that a lot of software developers have, is that they had a problem that they needed to solve and they're like, "Why am I doing all of this when a computer could do this for me?" And that's how they got bitten by the software bug as it were.
Jamon Holmgren:
That's awesome. And it sounds like one of the things that surprised you was reading through these complaints, you were like, "This doesn't sound like the React native that I know."
Hodeem Miller:
Exactly.
Jamon Holmgren:
I'd love to get into it. Let's just go ahead and dive into some of the things that you wrote and they do... I read through these, they do hit these do feel... I mean we were around back then and I remember this. So the first one is that knowledge of three platforms is sometimes required to implement custom features. So give me a little kind of your thoughts on that? And then I'll ask Mazen and Robin as well.
Hodeem Miller:
Okay. Well these developers were saying that sometimes to implement custom features, they would have to know about Android, they've to know about iOS and React Native, which seemed like a lot of work to just implement one custom teacher. Now, personally I could not relate to this because I have never had to drop down into Native since I've started using React Native.
Jamon Holmgren:
Never once? Wow.
Hodeem Miller:
I have never had to do it. Which, to me speaks of the maturity of the ecosystem.
Robin Heinze:
I have a similar experience, I'd say, there's so many A, so libraries that dip down into Native for you that just plug into your app and you don't even have to think about what's happening on the Native side beyond installing Coco pods or whatever. I mean there are some, depending on your desire to very finely mimic what you can do on the Native side, then you may be dipping into Native more. But it's really optional. There's so much you can do without touching Native. It's amazing.
Mazen Chami:
Yeah, I agree. I think the only time that comes to mind that I had to dip into Native, there was an app I was building and we needed to pull Apple Health, Get Data, and for some reason workouts were never pulled and every PR that did pull it for some reason was naming workouts as samples. So it just seemed a little bit off for me. So that's one times when I dipped in, got my feet wet with objective C and I think it was a little bit of swift at the end and got workouts pulled into my own branch, my own fork of the Apple Health kit workouts. And that was probably the only time I had to do that. And I think if that package had actually, maybe we just merged that PR could have just gone with get samples as my workouts and gone from there.
Robin Heinze:
We had a client where our primary job was to rebuild. They had an app that was in Android and iOS natively and our primary job was to duplicate it. Exactly, in React Native, do exactly what it did, including all of the really subtle animations and gestures and they wanted everything to be exactly the same. And that's where we sort of had to get into Native more because maybe the React Native library for a particular feature didn't behave exactly like their iOS app had. And that's kind of where you start to have to get your feet wet with Native. But if you're building an app and you have control over what it looks like and you are flexible maybe and will accept what a library does, then yeah, if there's no need.
Jamon Holmgren:
So I ran a Twitter pole because I was really curious about this one and I asked React Native developers, what percentage of your code is writing or editing native code, Java Kotlin, objective C Swift, c++ versus JavaScript or type script, 72% said less than 1% native coding. I think that basically means none. I said less than 1% because sometimes someone will go in and tweak one little thing that I don't really count that, but 72%, 20% less than 10%. So, that means that 92% were less than 10% of their time was spent in any native code at all. It was just JavaScript and type script. And then 8% more than 10% of native coding. So I purposely kept those percentages very low. Because I knew it was going to be low. I just wanted to see where the line was 92% being below that very low line. I was like, "Okay. Yeah, clearly. Yeah, it has changed quite a bit over the years."
Mazen Chami:
And that all goes to what you said, Hodeem, where you never had to do it. And that is a very low number for an ecosystem that requires and needs a lot of Native items. So speaks to the maturity like you mentioned, React Native has come a long way and there are a lot of people that probably touch it more than 10% and those might be the maintainers of these big libraries that we use on a daily basis. So we have them to thank for that.
Jamon Holmgren:
Let me jump to the next one. It is heavy investment in bridging infrastructure, maybe necessary to implement custom features. So this one sounds pretty related to the previous one, Hodeem, but give me your thoughts on this one?
Hodeem Miller:
To be honest, I'm not sure what exactly the complaint was referring to because I believe pulled this one from an article written by someone from the Airbnb team.
Jamon Holmgren:
Oh yes. Okay.
Hodeem Miller:
So I'm not sure if they were referring to the work that was done to implement the legacy architecture or the work done to implement and integrate Native modules. So I'm not really sure what exactly they were referring to here.
Jamon Holmgren:
To me it sounds a lot like the previous one, which is basically having to write some Native interfaces to be able to allow custom features within React Native.
Robin Heinze:
And at this point Airbnb is pretty infamous for the issues that they had with React Native. And as time has passed, it's become pretty clear that they're pretty unique in the experience that they had. And a lot of other companies have had success despite Airbnb's experience.
Mazen Chami:
I don't know if they'll disagree with me on this and take this the wrong way, but I think if they gave React Native a second chance, I think they would come back and be okay with all the issues they had. And that's just my... I don't know. I just think they should give it a chance if they really are interested. I don't know that's on them, but I think if they were to come back, that article would probably just go away.
Robin Heinze:
Well and they've admitted that it was more like the internal structural issues at Airbnb that made React Native not the right solution for them. Not necessarily things inherently wrong with React Native.
Jamon Holmgren:
We've talked about this before, for sure that whole Airbnb thing. Did we do a whole episode on it?
Robin Heinze:
I don't remember if we did a whole episode...
Mazen Chami:
I wasn't on the podcast.
Robin Heinze:
Maybe we did, I can't remember now.
Jamon Holmgren:
I don't remember if we did or not. Maybe I was pre-us on the podcast, I don't remember. But we did talk about it in Chain React and in a panel. And there was definitely a lot of... The reality is that you do need organizational buy-in from people and the technical issues. There are technical complaints about InfiniteEARTH. I was going to say Infinite Red.
Mazen Chami:
There are no complaints about infinite Red Tape.
Jamon Holmgren:
No complaints. Why would I say that?
Robin Heinze:
None.
Jamon Holmgren:
Let's move to the next one then. The animation and gestures tend to be non performant. I've heard this one myself, but go ahead and kind of give your background on that one. Hodeem?
Hodeem Miller:
Okay, so I feel like within that category there were two things that were mentioned frequently. One, was how difficult it was to implement animations and gesture handling and how non performance it was. And for me, I can't relate to the part about the difficulty because even though animations were daunting to me at first, I found great libraries out there such as React Native, Reanimated, React Native Gesture Handler, I think even React Native's own animated API, had made things fairly easy as well. So as far as the ease of use, I would say implementing animation are fairly easy these days. So I'm not sure what you guys went through, but for me it's the delightful experience. As for it being non performant, I have not experienced that in my day to day work with React Native. I find that React Native does a fabulous job when it comes to creating performant animations.
Jamon Holmgren:
Yeah, and I think potentially the new architecture will help with this and we don't know for sure yet, but it seems like it will. We've talked about React Native skia before. I did a live stream on React Native Live rn.live, where we went through some React Native skia stuff, which was really cool. There's other stuff like lottie where you can do animations. I think a lot of that was caused by the bridge and getting rid of the bridge is going to be helpful. But there have been a lot of solutions that have been kind of created throughout the years to deal with this. And we don't really deal with a situation where the performance of animations and gestures is really top of mind. It seems like most of the stuff we do, it doesn't seem to get in the way.
Mazen Chami:
Yeah. I think I've mentioned it on the podcast a lot.
Robin Heinze:
Yeah.
Mazen Chami:
I'm a huge fan of React Native Reanimated and I feel like if you follow the docs correctly, I think won't run into any of these performance issues.
Jamon Holmgren:
We had Christoff Magiera come on, React Native Radio 236 to talk about Reanimated two and three. And that's a good one to go listen to if you are interested in more on the animation side of things. All right. Another thing on your article Hodeem was, Implementing In-app Navigation Isn't Easy. So give me a little more context on that one?
Hodeem Miller:
Well the essence of the complaint that I saw was that, it was not easy to build a fluid and maintainable navigation flow for both iOS and Android. I'm going to sound like a broken record. I cannot relate to this complaint, right?
Jamon Holmgren:
Yeah.
Hodeem Miller:
So whether it's using React navigation or React Native navigation, I have not had problems with implementing navigation in React Native applications.
Robin Heinze:
Five years ago when we first started doing React Native apps, we were still using React Native Router Flux.
Mazen Chami:
Yeah, I remember.
Robin Heinze:
If I remember right and React Navigation was the new kid on the block. And in the past five years, React Navigation has basically become the default and it's the gold standard and it itself has come a long way since v1 it's on v6. No, something like that. And the API has changed a lot come so far and I really don't find Navigation to be a pain point anymore. But it is true that it was a pain 0.5 years ago, but we've really settled into React Navigation is the default and it works well and it does everything.
Jamon Holmgren:
And a shout out to React Native screens and the people over in Software Mansion who are working on this stuff because that kind of enables that Native experience that we've been looking for. Navigation is something that I think it really does need to feel really good. It needs to feel awesome because navigation is like...
Robin Heinze:
Oh yeah, it does.
Jamon Holmgren:
One of the most frustrating thing is when-
Robin Heinze:
It's the backbone of the app.
Jamon Holmgren:
I had this app for checking in and checking out of hockey games, so like, "Hey, am I going to be there or am I not?" They kind of need to know, because I play goalie if I'm going to be there. And the navigation is so janky, it's so weird. It makes no sense at all. I've learned it over the past three years of using this app. It's called Bench App, but just swipe from left is not... It doesn't work how you expect it to, it doesn't work. You can't go back. You have to go up and hit a button.
Robin Heinze:
So at first when you first said that, I thought it was going to be an app that you built for your hockey team because that is exactly something that he would do.
Jamon Holmgren:
Ouch.
Mazen Chami:
In a good way. I could see that.
Robin Heinze:
In a good way.
Jamon Holmgren:
I would implement a horrible navigation.
Robin Heinze:
No, no. That you would build an app for your hockey team.
Jamon Holmgren:
I have thought about.
Robin Heinze:
To solve a problem, I mean you built an app for your family, you built an app for your church that's you do though until, you said the navigation was bad. Then I was like, "Wait."
Jamon Holmgren:
Okay, maybe it was nicer than I thought, it was horrible.
Robin Heinze:
It was.
Jamon Holmgren:
And you're like, "Oh, that's exactly what you would do."
Robin Heinze:
I thought that until you said it was bad. And I was like, "No, no, no, there's no way." Well, do you know what it's built in? Is it some kind of...
Jamon Holmgren:
Its Native for sure, it's got to be.
Robin Heinze:
So how did someone do that?
Jamon Holmgren:
It's possible to write bad apps in Native. It is, people...
Robin Heinze:
It really is.
Jamon Holmgren:
People don't realize this. I've thought about it wouldn't be that difficult. I don't think it's just checking in and out. You do have to have a way to notify people. And so all that stuff.
Robin Heinze:
Firebase.
Jamon Holmgren:
I can totally write something using Firebase or Super Base or something. It'd be kind of fun. So many projects. So I think we can cross this one off as well in app navigation it's fairly easy now. It's not that hard. So yeah. Your next one was that there tends to be a slow initialization and first render time. Hodeem, give me your perspective on this?
Hodeem Miller:
In my opinion, this sounded like a very general statement. So I don't think it's fair to say that every React Native app is slower than every Native app, but I think the key metric that this person was highlighting was the time to interact with the TTI, right? So they were saying that TTI or React Native application tend to be larger than average native app. I think upon doing some research, it looked like the Facebook team took this personal because in 2019 they introduced the Hermes engine. They stated right off the bat what this engine would build to address. They wanted to cut the TTI, they wanted to cut the mimic consumption and they also wanted to cut the bundle size. So I think the community will agree that upon using Hermes they have seen considerable improvement in time of React Native applications. So...
Robin Heinze:
I definitely agree.
Hodeem Miller:
If we're not all the way there as yet, we have made significant progress in the last few years to tackle this issue.
Robin Heinze:
Issue. I would also say it also just really depends on the app. There's so many factors that go into your TTI and it can be due to things that aren't related to React Native at all. I mean it could be your API is slow, it could be your components aren't performant and there's tons of tools out there, Flipper and React Native dev tools for one, give you a lot of visibility into maybe what your slow components are and you can swap out things like React Native fast image for your images, there's a lot of tools to help improve that metric as well.
Jamon Holmgren:
I think that Turbo Modules is going to help with this as well because they have the lazy initialization, instantiation. So instead of before what happened with native modules, custom native modules is everything would have to be initialized no matter if it was going to be used for an hour later, it would have to be initialized as soon as you started the app. Where Turbo Modules, lazy initialization allows you to delay that until you're closer to whatever it is that you need to do. If there's a screen in your app that only gets used very rarely, but you need a native module for that, it gets initialized once you kind of navigate to that screen. So I think that's another piece of this. So it is getting better, but I do think that it's probably a valid concern. There's a lack of parallel threading or multi-processing support. I think that is a reasonable complaint. Hodeem, what are your thoughts on that?
Hodeem Miller:
To be honest, I have no thoughts on this story.
Jamon Holmgren:
I mean I think from my perspective, obviously you can drop down into the native layer to get parallel thread, multi-processing support, but that's not how the JavaScript engine works, how it's designed. So now there are some libraries out there that allow you to do this and I think that the non-blocking nature of JavaScript makes this pretty good. Not only that, but do the JavaScript environment itself runs in a background threat so you're not blocking the main UI. So I think there's some ways around this for sure, but it is something to keep an eye on. Another one, I'm going to have to move a little quicker here because we're burning through time. It can be difficult to debug errors because Stack Traces don't jump between React Native and native. Hodeem, what are your thoughts on debugging errors like that?
Hodeem Miller:
I guess for me debugging is not a very frustrating experience because I came onto the scene probably close to two years ago. So when I came, LogBox was already there, it was introduced in 2020. The Facebook team said that they redesigned the red box, they redesigned yellow box and they really made steps to improve the login experience. So for me, debugging is not a frustrating experience.
Mazen Chami:
I agree with you. I think LogBox and the red screen have been helpful for me. Usually my first inclination is get something in Firebase Crashlytics, use your dSYM, get down to the root Firebase Crashlytics with dSYM kind of literally will give you Stack Trace, JavaScript errors specifically and also anything potentially down native that you may have. So with that being said, you do have the visibility there. There's some effort that needs to go in there to get that set up for you. But essentially you can get to the root of the issue.
Jamon Holmgren:
I actually think this does need to be improved. I feel like with a lot of the LogBoxes that I get, I rarely get useful back traces.
Robin Heinze:
Just yesterday I was pairing with Jamon and I got the least useful...
Jamon Holmgren:
Yeah, RN view.
Robin Heinze:
Errors there ever.
Jamon Holmgren:
I appreciate it. Yeah, we're on our own. So I do think this needs to be improved. It's actually one of my biggest complaints about React Native. I don't feel like I get useful back traces, now we have plenty of old school debugging ways to get around that for sure. But it would be nice if it would say, "Hey, here's your crash, here's where you're crashing." Instead of-
Robin Heinze:
Sometimes I think about when I was a Rails doing Rails and the error reporting in Rails was so good. You would get this full screen error and it would give you this helpful but exactly to the right line. And then there was an interactive console where you could see what your variables were. Yeah, that's the standard that I'm measuring it against.
Jamon Holmgren:
I think that's the big thing is... It depends how much you've used other systems, how much this bugs you because there are other systems that do a better job I think. But it is improving. There's a lot more tools now than there used to be, but I think this is actually a fairly accurate complaint. All right, here's the next one. "JavaScript is un-typed, if only we had a solution for them."
Mazen Chami:
There's a solution?
Jamon Holmgren:
There's a solution.
Robin Heinze:
We have a whole episode about this solution.
Jamon Holmgren:
Hodeem, what are your thoughts on JavaScript design?
Hodeem Miller:
Well, the two main themes were, one, native developers just did not like dynamic languages. They just had a preference for type languages. But then there were also, I think are more valid concern about type safety. As, you're writing in your native code type T becomes a very big issue when it comes to using JavaScript. So I guess as Type Script becomes more widely adopted, this should become less about an issue as time goes on.
Robin Heinze:
Absolutely. I couldn't go back to playing JavaScript. It's laughable how much my productivity has increased. I remember when I was first developing React Native apps type script hadn't really come on the scene yet. There was so much time that I would waste trying to be like, "Why is this not working? Why what?" And then I would remember to go run our linter and it would find like, "Oh, I made a typo in this variable name or something." And I was like, tax script matches that as you're typing. Yeah, type script is amazing.
Jamon Holmgren:
The next one is React Native apps can have trouble rendering long lists performingly. And I don't think it's out as of this recording, but we have an episode coming talking about a solution for this very... It's probably the one published right before this or a couple before this. So go take a look at that. I would refer to it specifically, but I don't actually know the exact timing on that. But long list. Hodeem, what are your thoughts?
Hodeem Miller:
Well, I think this really came down to the AC communication between the JS and Ui threads. That's what it really boiled down to. But when I was digging into this issue, I came across a dinosaur component called List Views. It was replaced by Flat List and section it like in 2017. And I've been using Flat List up until point, but I think earlier this year, Shopify open source Flash List, we just saw generating a lot of bones in the community. So I just can't wait to use that component.
Robin Heinze:
Oh yeah, everybody's talking about it.
Jamon Holmgren:
Yep. So we did that episode about Flash List with one of the creators. So definitely check that out. It's going to be a good one. And the last one in the article that you have is that the Android bundle size can be large. Give me your thoughts on that. Hodeem?
Hodeem Miller:
Okay. I think this came down to the fact that Android does not have JavaScript core. I think that's what it's called. So JavaScript core had to be bundled in under applications when they were written in Native and that made the application side much larger. So I think that this is an issue that is also being tackled by the Hermes engine because the Facebook team said that they wanted it to be small and lightweight. Plus I think they gave developers the choice to implement whichever engine they so choose when they implemented the GSI.
Mazen Chami:
Yeah, and one thing is Pro Guard pretty much helps with this big time. We did an episode R and R 239 Shrink Your App with Pro Guard where we interviewed James Hamilton. And in that episode you'll see a lot of stuff there. So Pro Guard does a good job in shrinking your bundle and then also as part of that episode it kind of go runs through and eliminates all the unwanted fluff that's in there. Tree shaking.
Robin Heinze:
It's probably also worth noting, this isn't React Native specific, but the Android app bundle publishing format is fairly new. I'm not sure if it was around five years ago, but it's a lot more streamlined than APKs. So it's worth using that instead.
Jamon Holmgren:
We did an episode actually just before this one as well, that where we talked with the Gas Buddy team, which we've been helping. And there's one incident where we were looking at the bundle size and say the actual Android APK size we're like, "Wow, this is really big." And then we realized that it was mostly native code, that was making it big and it was also not really our native code, it was like Gradle stuff. So there's a lot of factors there and it's rarely just as simple as, well, React Native itself is huge because when you first start a Bear React Native project, it's actually pretty small. But yeah, it's still something that can be improved. I do think Pro Guard helps whatever it is that-
Robin Heinze:
Well they're also working on Lean Court to try and reduce the size of React Native itself as much as possible.
Jamon Holmgren:
So to kind of sum all this up, there were a few complaints here where it's like, "Yeah, we're still working on that, but there're some solutions." But for the most part it's like, "Well this isn't really an issue anymore." And these were the most common complaints. One of the ones that I think probably could have been mentioned as well is the upgrading experience, which is a little hit and miss though. There's still sometimes where upgrading can be a chore, but it's a lot better than it used to be. I remember when the core team asked what sucks about React Native, they got the top reply was upgrading and when they ran that same poll again a year later after they'd addressed a bunch of stuff, I don't think it was on the top 10 anymore. So they really worked on the upgrade experience.
So it's much better than it used to be. Still, could be better, but for the most part seems to be improving quite a bit. I think that's it for our episode. If you'd like to nerd out more about React Native, check out my Twitch stream@rn.live. You can also join our Slack community, community.infinite.red. We have over 2000 React Native developers in there. Check out the new Twitter community rntwitter.infinite.red. You can find Robin online @Robin_heinze. You can find Mazen @mazenchami. You can find Hodeem @hmcodes. Thanks so much Hodeem for coming on and talking with us about this. It was a fun journey to look at the last five years.
Hodeem Miller:
Thanks for having you guys. I really enjoyed it.
Jamon Holmgren:
Yeah absolutely. You can find me @jamonholmgren and React Native Radio @reactnativeradio. As always, thanks to our producer and editor, Todd Werth, our assistant editor and episode release coordinator, Jed Bartausky, our designer Justin Huskey and our guest coordinator, Derek Greenberg. Thanks to our sponsor, Infinite Red, check us out at infinite.red/react native. Make sure to subscribe, go give us a review on your podcasting platform. Really appreciate it. Robin, do you have a mom joke to finish things off?
Robin Heinze:
Did you hear about that new band 923 megabytes?
Jamon Holmgren:
No.
Robin Heinze:
They're good, but they haven't got a gig yet.
Jamon Holmgren:
Cut. See y'all next time.