Reacting to React Native

This week at the React.js Conf 2015, Facebook presented React Native. A revolutionary solution to build native mobile apps using JavaScript. Sound familiar? Let’s go over some quotes from the keynotes.

Introducing React Native

We’ve tried in the past to just build web-apps that we could wrap in thin native wrappers, but it doesn’t work. [..] People have tried to clone this [Facebook Paper] on the web, but no one gets even close. Anytime somebody tries to reimplement a native widget using HTML, CSS and JavaScript it always feels like shit.

Tom Occhino

Couldn’t agree more.

Everything on screen was native. No HTML. No Browser. No WebViews. Completely powered by JavaScript.

Tom Occhino

Get used to repeating that over and over again.. like we do.

There are other frameworks that exist today that script native API’s in JavaScript. But [..] Dropping frames in the UI because we’re waiting on JS to do some work [..] like Garbage Collecting. [..] By putting the JavaScript in a background thread we can make it so that all of your application logic, including your rendering is always [..] off of the main thread.

Tom Occhino

Other frameworks like Appcelerator you mean? Which also uses background threads?

Write once, run anywhere
Learn once, write anywhere

Tom Occhino

Sound very familiar to what Appcelerator has been saying for over 5 years:

Write once, adapt everywhere.

Kevin Whinnery, 2011

A Deep Dive into React Native

As you can see this is just JavaScript [JSX] There is no Objective-C here, but this component is actually a native one:

<View style={styles.row}>
  <Image [..] />
<View>
Christopher Chedeau

Wow! Like Alloy has been doing since 2012?

<View class="row">
  <ImageView [..] />
<View>

Let’s open up Xcode and look at RKView, which is a native one and as you can see it extends from UIView. So this is actually a real native view that we’re instantiating:

@interface RKView : UIView
Christopher Chedeau

Hey, that looks familiar! Where have I seen this before?

@interface TiUIView : UIView<TiProxyDelegate,LayoutAutosizing> 

Have you looked at the time it takes to reload? [..] It takes like multiple dozen of seconds to do any small changes. And we really do want to fix this.

Christopher Chedeau

Don’t worry, try Appcelerator’s LiveView or the community’s TiShadow.

Unfortunately CSS has some issues. [..] We believe that there is a better solution and this is writing CSS in JS. [..] There’s a couple of differences like you have to use commas instead of semicolons, but nothing like really big.

Christopher Chedeau

Hey, wait a minute.. that sounds like Alloy’s TSS!

".movieTitle" {
  color: '#999999',
  backgroundColor: '#FF000'
}

If you have an exception [..] we are going to show it in your face and internally we like to call it the Red screen of death

Christopher Chedeau

You’re so funny!

Unknown

It’s compatible with Node modules, so If you want to use Underscore [..] if it doesn’t have a dependency on the browser it should just work.

Christopher Chedeau

Underscore? Is that the one that Alloy uses next to Backbone?

Don’t get me wrong

I can’t wait to use their JS version of CSS-layout with flexbox in Titanium and there’s always something to learn from other frameworks. But if there’s one thing Appcelerator and we as community should learn is that it looks like we have to do a better job at getting the word out. The word that Appcelerator has been doing this for years!

App imagineer: Imagining, Engineering & Speaking about Native mobile Apps with Appcelerator Titanium & Alloy • Meetup organizer • Certified Expert • Titan


Comments

  • emanuele.decup.is (@balanza)

    IMHO one thing Titanium should improve is the way it handles UI creation. In my experience, it often takes minutes to work on business logic, while it takes hours to get elements laid out properly. As Titanium turned community-driven, let’s see what React guys come out with, let’s get inspired (as they were) and let’s go for a better UI workflow.

  • aaronksaunders

    ” But if there’s one thing Appcelerator and we as community should learn is that it looks like we have to do a better job at getting the word out. The word that Appcelerator has been doing this for years!”

    I agree with the final comment more than anything else!! it is my personal opinion that Appcelerator can and must do a better job evangelizing how great the platform is. I can still walk into a room and people wont event know what Appcelerator is, and I am willing to bet they will know ReactJS, Phonegap,Cordova, even Xamarin.

  • Steve

    At the risk of being ‘flamed’ for my comments, here goes.

    I have seen a lot of negative, even sarcastic comments regarding React Native over the last few days, especially from the ‘Appcelerator’ community. To me this is not a good thing and only shows ignorance, and to para-phrase “me thinks they do protest too much..’

    There is a great article by Forbes on ‘5 reasons competition is good for you business’, to quote the article “Competition leads to innovation. If you’re the only player in your field, it can be difficult to improve. And if you’re working in a crowded market, you won’t succeed by doing what everyone else does. Healthy competition encourages change which will distinguish your company from others.”

    Appcelerator Titanium is an outstanding platform, React Native is a very interesting idea, and personally I look forward to what comes next in both camps, I think the opportunity for innovation just got interesting.

  • Fokke Zandbergen Post author

    @Steve I’m totally with you. Re-read the first line of the last paragraph.

  • Wesley

    Just a question that I honestly just want to understand.

    The one thing that React Native say is that the js logic is run in a background thread and is accessed asynchronously where it is my understanding that in Titanium it is run in the main thread and is synchronous. This is especially problematic for android as it constantly misses frames. So learning time for me, is that how Titanium works compared to React Native?

    Thanks.

  • Conny Svensson (@connysvensson)

    There are many players trying the native JS angle, showing that people want to use JS when writing apps even if the language is not the most elegant language. I haven’t seen too much mentioned or discussed about NativeScript from Telerik (The Kendo UI guys). It looks a lot like what Hyperloop i supposed to do. You write your class wrappers in JavaScript, not native, in a small JS core. Check out http://www.telerik.com/nativescript

  • Fokke Zandbergen Post author

    @Wesley Titanium also runs in a separate (background) thread but indeed, does (more) in sync.

  • Wesley

    Thanks @Fokke. Really looking forward to Hyperloop and what it brings to the table.

  • Alexandru

    Why would someone pick react native for a simple app instead of using reactjs to render everything on mobile ?

  • Mateusz Charytoniuk

    Masters win races because of inches so Titanum should not be surprised that someone came up with similar concepts.

  • Aravan

    Appcelerator is working hard at engineering, pushes marketing at front, I see a gap in developer friendliness, compared to other frameworks & eco system. Alloy and Titanium frameworks lacking examples, best practices, code spinets. We get tons of advises while using Ionic, Xamarin & their forums are generally helpful, where as Appcelerator Q/A site is not serving its purpose. Even we have much better support with Lua binding with XCode, Java. Appcelerator platform is neither fully native, nor equally behave well, but parity between two/four platforms kills developer time. Appcelerator must provide as many code snippets on common UI patterns, to encourage the community.

  • Fokke Zandbergen Post author

    @Aravan, thanks for your feedback. I don’t get all of it, but I do agree we need to become better at guides and examples. And rest assured… we are on it!

  • Luis Pedro

    @Aravan I also agree with you. Titanium needs to work a bit more on documentation, keep examples and best practices updated with the latest SDK features but this comes to a cost … people, time and money. I already made a few apps in Titanium which I didn’t pay single euro, in the other hand I’ve tried to start with Xamarin and the ‘free’ account only lets to build small apps which means that if I want start with multi-platform (like Titanium) on Xamarin I have to pay a minimum of $50/month … maybe this is one of the reasons Xamarin (for example) have more money to … hire more people to … write and update documentation. But I believe Titanium is going a good job, not my favourite type of documentation platform, but I think it does the job.

  • Oscar Brito (@aetheon)

    @fokke there’s something that is troubling me. When I go to the showcase page after trying some of the apps I can’t believe they’re using titanium because normally you can tell by just opening the app. That said I must add that the ListView an TiShadow are very buggy and alloy does not use MVCs patterns.

    How can you explain the lack of integrated tooling like unit tests,…?

    I don’t want to sound very harsh because there is a lot of good stuff on titanium. After reading this article I think this had to said.

  • Fokke Zandbergen Post author

    @Oscar I don’t fully get your first comment. It’s unclear to me if it’s a compliment that Titanium apps are as good as a native (that is: tools) app or that you don’t believe they’re Titanium because your personal experience is that it is buggy?

    In the article I merely wanted to show the many similarities between React Native and Titanium. I’d be the first to admit Titanium has both flaws and strong points.

  • Ben Ceglowski

    “Underscore? Is that the one that Alloy uses next to Backbone?”

    It feels like a core point is missed here. It’s not that Underscore can be used; rather than any library without explicit browser DOM implementation dependencies can be used. Underscore is just an example.

  • IBadlyNeed ToVent

    Imagine Google-ing Match.com and finding articles like this for every free dating site that was started after it? It’s articles like this with this unprofessional attitude that’ll keep Appcelerator small and irrelevant. Stop whining. Grow a pair.

  • Fokke Zandbergen Post author

    I love some of the concepts RN brought to the JavaScript2Native world! I don’t think the article was a rant, but just wanted to point out some striking similarities. IMHO commenting under a false name and email address is less professional ;)

  • IBadlyNeed ToVent

    Professional isn’t what you do in private, anonymously. It’s what you display publicly. I definitely don’t want to be professional in my private life. I’m professional when I need to be.

    If this article wasn’t a rant, you wouldn’t have needed a “don’t get me wrong” section. You tried hard to play it off as an informational article, but you slipped.