News

New Open Source Database, Rich Text Editor Framework for React Ecosystem

• By David Ramel
• February 22, 2016

Facebook said there were no major news announcements emanating from the just-started React.js Conf 2016 like last year's introduction of React Native, but nevertheless there is news today of a new database for React Native and a tool for building rich text editors in React for Web -- both open source.

Lacking any new product announcements rivaling that of last year, keynote presenter Nick Schrock said Facebook's strategy for the coming year had three main strategies: "execute, execute and execute."

That didn't stop start-up Realm from announcing Realm React Native, "an easy, fast database with live objects, change events and support for unidirectional data flows."

Realm previously targeted its mobile-first database for Java, Objective-C and Swift. Today it added the React Native platform, used to create iOS and Android apps -- rivaling native apps in performance and "look and feel" -- with just JavaScript.

"Realm is not an ORM, and is not built on top of SQLite," the company said in a statement. "Instead we’ve built a full database for mobile app developers, one that uses native JavaScript objects that are dynamically mapped to a full, custom database engine (not just a key-value store). This allows us to provide a simple API while preserving performance. With Realm, you can model complex data, link objects in a graph, and compose advanced queries."

While not yet up to par with its Java/Objective-C/Swift counterparts, the Realm React Native database is already being used in production and will continue to evolve, the company said. "Expect the API to improve significantly over the next few weeks, especially as we polish advanced features like migrations and queries."

According to the GitHub site, Realm React Native boasts the following features:

• Mobile-first: Realm is claimed to be the first database built from the ground up to run directly inside phones, tablets and wearables.
• Simple: Data is directly exposed as objects and queryable by code, removing the need for ORMs riddled with performance and maintenance issues.
• Modern: Realm supports relationships, generics and vectorization.
• Fast: Realm is faster than even raw SQLite on common operations, while maintaining a rich feature set.

Also announced today was Draft.js from Facebook itself, for creating text editors.

"Draft.js is a framework for building rich text editors in React, powered by an immutable model and abstracting over cross-browser differences," Facebook said. "Draft.js makes it easy to build any type of rich text input, whether you're just looking to support a few inline text styles or building a complex text editor for composing long-form articles."

According to its GitHub site, Draft.js features:

• Extensible and Customizable: We provide the building blocks to enable the creation of a broad variety of rich text composition experiences, from simple text styles to embedded media.
• Declarative Rich Text: Draft.js fits seamlessly into React applications, abstracting away the details of rendering, selection, and input behavior with a familiar declarative API.
• Immutable Editor State: The Draft.js model is built with immutable-js, offering an API with functional state updates and aggressively leveraging data persistence for scalable memory usage.

"Plain text is boring," reads the description for a presentation on "Rick Text Editing with React" scheduled for today by Isaac Salier-Hellendag. "At Facebook, we want to give our users the ability to add mentions, emoticons, hashtags, styles, and embedded media within the content they share. The result is that nearly every input on Facebook requires rich text features.

"As UI engineers, we want to provide our product teams with the tools to implement and expand upon these features without pushing them into the contentEditable pit of despair. This talk will dive into the details of how we used React, ImmutableJS, and yes, contentEditable, to create an editor framework that enables engineers to build and customize rich text composition experiences across Facebook."

Even in the absence of ground-breaking announcements like the introduction of React Native last year, Schrock said Facebook is moving ahead with the technology, investing in the project and putting more React Native components into the main Facebook app, described as the most-used mobile app in the world.

"We are expanding the ecosystem around React Native," Schrock said. "If we are successful, we are really on the cusp of redefining mobile development."