Following yesterday’s announcement of releasing ComponentKit, a framework for creating native UIs declaratively on iOS, Facebook has released a number of other projects as open source during their annual F8 developer conference: React Native, Year Class, Network Connection Class, Fresco, and Nuclide.
Having already experience building components for their website with React, Facebook has decided to bring it to iOS and Android in order to speed up development on these platforms. With React Native, code runs on iOS in an embedded instance of JavaScriptCore and then is rendered using native UI components. The calls between JavaScript components and native ones are performed asynchronously, enabling some operations to be performed in separate background threads without blocking the UI. Developers can use Chrome DevTools to debug the app in the emulator or on the device. React Native uses Flexbox for laying out components and can be extended with various JavaScript libraries and polyfills.
Currently, the framework is available for iOS with support for Android coming soon. React Native will have separate components and implementations on the two major mobile OSes, developers still having to write separate applications. Since an application can support a mixture of purely native views and React ones, porting an existing application to React Native can be done gradually. Such is Facebook’s application Facebook Groups while Facebook Ads Manager has been built only with React Native.
Year Class is an Android library that can be used to decide a device’s year class, or the year when its hardware specifications were considered high-end. This enables developers to change the behavior of the application based on the device’s specifications to make sure the app performs properly on all devices. The year class is determined based on the following table:
| Year | Cores | Clock | RAM |
|---|---|---|---|
| 2008 | 1 | 528MHz | 192MB |
| 2009 | n/a | 600MHz | 290MB |
| 2010 | n/a | 1.0GHz | 512MB |
| 2011 | 2 | 1.2GHz | 1GB |
| 2012 | 4 | 1.5GHz | 1.5GB |
| 2013 | n/a | 2.0GHz | 2GB |
| 2014 | n/a | >2GHz | >2GB |
Network Connection Class is another Android utility used to determine the quality of a device’s network connection informing when there is a change in quality. This can also be used to throttle the app in using more or less network intensive resources to make sure the user has a good experience with the app. According to the ConnectionQuality.java class, the library uses the following thresholds to determine the quality of a connection:
| Min kbps | Quality | Max kbps |
| 0 | Poor | 150 |
| 150 | Moderate | 550 |
| 550 | Good | 2000 |
| 2000 | Excellent | - |
Fresco is an Android image loader and manager that uses Android’s ashmem to store the images. Facebook opted for a custom image manager because their app used to run out of memory on some low end devices due to the large number of images needed to display their news feed. The library will display a placeholder until the image is loaded and processed asynchronously. Fresco knows how to deal with progressive JPEGs and animated GIFs/WebPs. More information o using Fresco can be found in this post.
Facebook has also announced Nuclide, an IDE for web and mobile development with Hack, React, React Native, and Flow. The IDE is based on Atom. This is just an initial announcement, Facebook planning to open source Nuclide some time this year.