Small is big. Introducing PrestoUI, a 35KB alternative to React Native

PrestoUI is a lightweight, native UI builder inside Juspay’s payments SDK. It powers more than 100 million devices for payments and more than 20 million devices with the BHIM app.

We wanted a UI builder for our SDK, but the usual suspects, React Native and NativeScript, were not suitable. Their HelloWorld apps were ~7MB each. Too big. This is why we started building PrestoUI. Since our main product is an SDK inside other apps, we have size constraints(<150kB) and we also wanted the ability to dynamically update the UI so that we didn’t need SDK updates for every small change.

Like React Native, PrestoUI allows you to build cross platform apps using Javascript or Purescript. However, it differs from React Native in the following ways:

Size Overhead

We achieved an incredibly small size — 35KB compared to React Native’s 5MB footprint — by using the inbuilt WebView as the JavaScript execution engine and minimizing the native code by using Reflection. The performance issues of Reflection were overcome by memoizing functions and intelligent caching of the UI view tree.

Markup Syntax

Another interesting feature that emerged was that Android’s UI language turned out to be the right balance of simplicity and generic nature for cross platform — iOS and Web.

While designing the user interfaces we found that Android’s UI language was surprisingly simple and powerful enough for cross platform views — Android, iOS, Progressive Web. We think this is because Android was designed to support varied device sizes from the start. This also enabled Android developers to start on PrestoUI with ease. Also the resultant web and mobile web UI has small footprint and low page load time.

Support For Types

In pursuit of higher quality of code with a team of freshers, we wanted a language or framework for rapidly building bug free and scalable apps. We looked at Elm, Purescript, Clojurescript, Haskell and various Javascript frameworks. We found Purescript, a strongly typed pure functional programming language inspired by Haskell, to be a good match for our requirements. Purescript’s typesystem gave us various compile time benefits and made it very easy to refactor our code base. In fact, we believe that functional programming gives us 5 years extra experience!

Sketch Design to Code generation

To enable designers to prototype and to directly generate production UI, we also developed a Sketch plugin with hot reload. This eliminates the designer-to-developer handover process and creates pixel perfect implementation by default — yay, happy designers!

If you are looking for a lightweight yet powerful cross platform library to create apps give PrestoUI a spin. Everything you need to get started is in PrestoUI quick start.

Check out PrestoUI or any of our other open source projects at https://github.com/juspay and feel free to contribute.