Hacker News Reader

Comment by martin_bigio | Hacker News Reader

@martinbigio here in case anyone has questions

Probably OT but a bug that's been driving me crazy for a while now. When I open Instagram it reloads the feed every time as if the app had been purged from memory. This means if I accidentally close the app and reopen it my scroll position is lost and thanks to the sort algorithm the feed order has changed and I can't get back to where I was.

See this every time. Also on iOS if you have the app open, lock the phone, and then unlock you will be at the home screen. Almost as if the app ran out of memory or crashed in the background.

Side effects of RN?

Wow, sounds like they've really managed to bring a web-quality experience to native.

Excellent work.

Same issue with Facebook web when I use the browser's back button to view my newsfeed.

I'll see a post which interests me for a few seconds and then it's gone. Happens often.

To me it seems like the feed is deterministic, that is, even between refreshes it stays the same, and when there are new posts on the top the old ones are still in the same order.

huge pet peeve of mine too, it just started happening a few months ago. hope he responds to this.

i'm on iOS but today's IG update just got rid of this problem. been suffering this problem for the past week or so.

Not surprised to see no mention of UWP (Windows app dev) but I would figure that Instagram for Windows 10 Mobile would also be similar to the iOS/Android apps because UWP supports React Native?

What would be the biggest hurdling block to rewrite the main feed into React Native? As a follow-up, do you think there's a performant enough ListView implementation in RN to build the feed with?

I'll be more blunt: please fix ListView :)

You may be interested in https://github.com/facebook/react-native/commit/a3457486e39d.... It's likely not production-ready yet but hopefully will become really good soon.

Brace yourself, FlatList is coming :)

When can we expect this in production?

Thanks, Martin, for appearing here. I've read a few times that apps developed in React Native have an odd look-and-feel, or had noticeable touch latency, or aren't performant enough or native-quality. Every time I tried an app built using a hybrid framework, it felt second-tier.

Has that been your experience? When you moved any UI from UIKit or native Android views to React Native, was it worse in any way? Did it require a lot of work to get back to native-quality UX?

I've only seen such thing on infinite non-optimized listviews on old Android crappy phones, but, new listview infra that solves this is coming up soon :)

Did you guys use any other libraries from the React ecosystem to implement these features? (redux, normalizr, redux-saga, etc.)

Also, what approach did you use for testing the RN flows? (unit testing, e2e testing, etc).

BTW, thanks for sharing your experiences!

No, we didn't use any of those. For unit testing we used Jest <3 and for e2e an internal library developed by FB

Are you considering to build the camera part with react or keep it native cause react wont add the needed functionality?

No plans for powering camera using React Native for now. We already have great native infra for that and regardless, IMHO RN might not be the best technology to implement those kind of immersive ultra-performant flows.

We see space for React Native to grow inside of Instagram on flows similar to the ones mentioned on the blog post.

Great article Martin. Do you have any performance figures or tips that you learned when porting the save feature?

Specifically how was performance across Android/iOS?

Great question. First off, worth mentioning there are many performance metrics you might want to measure. On one hand start up times, but since you specifically mentioned Save, I assume you want to learn more about scroll perf (i.e.: dropped frames, memory usage, time to render next pages, etc).

We don't have numbers we can share but but the React Native team is working on further improving this. Check out Spencer's commit (https://github.com/facebook/react-native/commit/a3457486e39d...) for a sneak peek of what's coming up :).

Awesome, thanks for that link! So far I have been pretty happy with react native. On Android myself and another developer I have been working hit some issues around images on Android.

Part of the issues were our own fault: overlaying a transparent image provided by our designers instead of asking for a non transparent one, not using flags like renderToHardwareTextureAndroid.

Others were due to our use of the navigation library, react-native-router-flux, which on Android is backed by fragments. This caused a bunch of overdraw issues (i.e previously pushed views, which were not visible were being rendered in the background). We are planning on migrating away from this routing library to another one.

I'd love to read more articles about react native and performance based on real world examples at scale so please keep publishing them.

To what extent is React Native performance on iOS limited by the fact that an iOS application using JavaScriptCore outside of a WKWebView can't use the JIT compiler, but only the interpreter?

Thanks for the post, very interesting! The post talks about the percentage of the code shared between iOS and Android. Is there any shared code with the web as well, or is that a completely separate react app?

Although the Instagram website is a React App we are not reusing any code atm. This is something I personally want to explore at some point though.

How much code can be shared between React (web) and React Native?

Edit: Answered in other comment below. Share logic, no UI.

thoughts on React Monocle? https://github.com/team-gryff/react-monocle

Reply on news.ycombinator.com