For over 5+ years we help companies reach their financial and branding goals. oDesk Software Co., Ltd is a values-driven technology agency dedicated

Gallery

Contacts

Address

108 Tran Dinh Xu, Nguyen Cu Trinh Ward, District 1, Ho Chi Minh City, Vietnam

E-Mail Address

info@odesk.me

Phone

(+84) 28 3636 7951

Hotline

(+84) 76 899 4959

Mobile App

The history of React Native: Facebook’s Open Source App Development Framework

React Native is one of the most popular mobile app development frameworks designed and developed by Facebook. Facebook open sourced its codebase in 2015. React Native’s claim to fame is that it enables execution of JavaScript codes in smartphones, which is a contradiction in itself, and hence interesting. 

In this article we will try to trace the history of React Native from the moment the idea was born within Facebook. However, to appreciate the concept behind React Native, we need to go a bit further back and understand why the React framework was needed by Facebook.

Why Facebook developed React for Web

React was born in Facebook’s Ads Org. As Tom Occhino, the then React  team lead at Facebook, said in his keynote address in the first-ever React.js conference in 2015, it all started very simple and fast and straightforward. The typical MVC approach was used for developing and deploying the Facebook ads platform. But as new features were added, things started to get complex.

The codebase became larger and as more engineers were added to the team to handle the ever-expanding codebase, things started to slow down. The code became unpredictable because of the cascading updates and re-rendering of the application due to even the smallest of changes in the view. The code became so unwieldy that the engineers were no longer confident of which data change was updating which part of the application.

You don’t need to be a programmer to realize that if you do not have the cause-effect control over your system, it can only spell doom for the product. One of the engineers in the team, Jordan Walke, decided to do something about it. Because it was not only making the system inefficient but also playing havoc with user experience. Despite having a model that not only “sounded” right but had been proved right in real time.

In 2011 Jordan built a prototype to make the system efficient and user experience awesome; he called it FaxJS.

He later worked on the prototype to create the React framework in 2012. 

React decoupled from Facebook stack

The same year, in 2012, Instagram was acquired by Facebook. When Instagram developers looked at the Facebook web development stack, they wanted to use React for some of the applications they were planning to develop. However, at that point of time, React was tightly coupled with Facebook development stack.

One of the devs, Pete Hunt, felt it was worthwhile to decouple React from the Facebook stack. React was successfully decoupled and then open sourced in 2013.

Facebook goes mobile first and challenges begin

In 2012 Facebook decided to become a mobile first company. That was a course changing event for a company that was full of career web developers. The first major challenge was to render the web applications to mobile. Facebook tried to use HTML5 for rendering applications on mobile web but failed miserably.

Mark Zuckerberg said in a 2013 TechCrunch event that continuing with HTML5 was the worst decision they had taken.

Facebook engineers had tried to put the WebView inside a mobile native container, thus reusing the WebView already available on their servers. But it did not work to anybody’s satisfaction.

Mobiles and computers have some fundamental differences, which started creating problems in rendering the mobile web application:

  • Lack of keyboard API — The WebView had no keyboard API, which is the most essential for mobile web to detect availability of on-screen keyboard.
  • Gestures and touch events – Mobile OS overloads all applications with gestures and touch handling, which is much faster than any onClick event. Sometimes the gestures are very rich events like two- or three-finger gestures. The WebView did not have the necessary code to handle this.
  • Lack of image management capability — Unlike computer browsers, mobile browser cache cannot be queried to see whether the image has been loaded or not. The WebView being used inside the mobile native container could not handle image management.

That was when the developers realized they needed to have native apps for awesome user experience. But native development has its own problems:

  • The iteration process for native apps is very slow because each prototype has to be approved by the Playstore before being developed and tested and launched.
  • Coding is imperative, which makes the apps more complex and difficult to manage.
  • Each platform needs its own codebase. So, each app would require at least two code bases for iOS and android.

React Native is born

Christopher Chedeau was a young developer who joined Facebook Photos team in 2012. When he saw the fix the company was in, to transform mobile first applications, he decided to do something about it.

Jordan Walke had already managed to generate a UILabel in iOS from JavaScript. He teamed up with Jordan, Ashwin Bharambe and Lin He to perfect the prototype and get something working within 2 days. And they were successful.

At the end of those 2 days, they could generate native UI elements from JavaScript thread running directly on the user device. This could be the solution to the iteration delay problem of native apps.

Facebook internal hackathon

An internal hackathon was organized at Facebook in summer of 2013 and by the time it ended, the engineers where convinced that the prototype could be used to develop a framework for mobile app development using JavaScript. Jordan and Christopher dedicated a full team for building this technology and they came up with what we call React Native.

React Native open sourced

The bare bones React Native framework was released at the React.JS Conf in January 2015. In March of the same year, React Native was open sourced and made available on GitHub.

In September, React Native for android was also made available.

In 2016 React Native framework’s Facebook developers announced that the React Native framework could support Windows and Tizen platforms as well.

Problems that React Native has solved

The two major mobile OS companies – Apple and Google – would never have come together to provide a unified platform for app development. Facebook has provided the next best option — a Framework that allows mobile app developers to use JavaScript to develop applications and compile it into codebase for any platform. And in the process solve the most head scratching problems faced by native app developers.

Whenever any changes need to be done in the code, developers need to do it just once in the JavaScript code. On compilation, each codebase gets updated automatically and released to the respective play stores as well.

Future of React Native

React Native has been adopted by millions of developers to create products that provide awesome user experience rapidly and cost-effectively. As of September 2, 2020, these are some of the GitHub figures for React Native repository:

Watches3.1k
Stars89.9k
Forks19.9k
No. of pull requests in past 1 month61
No. of closed issues237
No. of open issues119

In its 2019 F8 conference, Facebook engineer Eli White said that they have been concentrating on product owners who develop and maintain products using React Native. Facebook itself has been using React Native for developing the user experience and quality of its marketplaces.

TechAhead and React Native

By the time React Native was open sourced in 2015, TechAhead was an established mobile app company. Its team of mobile app development experts recognized the potential of the framework and adopted it quickly. Till date we have built 100+ mobile apps using the React Native framework.

Summary

React Native is a mobile app development platform developed by Facebook for its internal app development. It was open sourced in March 2015 for iOS mobile app development. By September, an Android version was released too. Later, it provided support for Windows and Tizen platforms as well. React Native enables developers to write code in JavaScript, which can then be complied into iOS, Android, or any other supported platform as required. Using this approach for app development makes iterations faster, enabling developers to release versions to play stores quicker.

Source: techaheadcorp

Author

oDesk Software

Leave a comment