Facebook has open sourced Litho, a framework for creating user interfaces in Android applications using a React-like declarative style with scrolling performance in mind.
With Facebook Litho one can create immutable UI components using a declarative API. Since the components are immutable, they can be prepared for rendering and layout in a different thread, then passed to the UI thread for the actual rendering on the screen. Litho uses code generation and optimizes the components for rendering, reducing the number of Android ViewGroups by grouping components and generating flatter interfaces with a smaller view hierarchy. This is supposed to reduce memory consumption and increase scrolling speed, according to Facebook.
Litho uses Yoga to layout the components, a process that can be done synchronously or asynchronously. Yoga is a a cross-platform layout engine also open sourced by Facebook. Because the components are immutable, and creating a large number of components can be expensive, Litho permits components to be reused in other views after being discarded from the current one.
Defining a "Hello, World!" Text component in Litho looks like this:
public class MyActivity extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
final ComponentContext c = new ComponentContext(this);
final LithoView lithoView = LithoView.create(
this /* context */,
Text.create(c)
.text("Hello, World!")
.textSizeDip(50)
.build());
setContentView(lithoView);
}
}
LithoView corresponds to Android ViewGroup, making the connection between components defined in Litho and Android Views. Text is a Litho widget and has a number of properties such as text, textColor, textSize, and textStyle, among others.
The Litho API is pretty large, containing a couple of dozens of packages with over 300 Java classes and interfaces. Litho includes support for custom layouts, unit testing, event handling, RTL (right-to-left) text, accessibility, and others.
Facebook has put Litho at work in some of their Android applications, such as Facebook, Facebook Lite, Messenger, and Workplace. Facebook claims that Litho is faster than Android RecyclerView for scrolling surfaces, noting a 35% speed improvement for their applications. It obtains that by "moving the heavy work to a background thread and spreading the rendering work across multiple frames." Also:
Litho breaks down complex views into smaller pieces such as text, images, and videos, and renders them incrementally, spreading the work that needs to be done across multiple frames. It also recycles those smaller pieces and can recombine them in a virtually infinite number of ways, reducing the total number of views that need to be created and stored in memory.
The framework is available on GitHub and those interested in more details can go through the Tutorial and the Documentation.
