Reactive Programming is not a recent concept, introduced in 1997, and it has been used widely in many systems. In Mainstream languages, Microsoft released RX 1.0 for .Net in 2009. We base reactive programming roughly on dependency as a concept. Continuously broadcasting the changes that occur in data to all its registered dependents in an asynchronous way.
Why Reactive for UI?
All the users are expecting a very fast and responsive UI in the mobile apps. Reactive programming plays a major role which helps a lot with a near-second update of UI. It runs asynchronous for heavy work in different threads and updating the UI in the main thread. This helps in a seamless experience for the user.
Every day developers are looking for solutions where the UX/UI logic stays in a separate layer. Reactive UX supports modularity by observing data structures instead of logic. It helps in testing the different modules as they are very abstract; we don’t need mockups or dependency injections. The most advanced feature in reactive programming is event sourcing, which allows the screens to have an update history that can be replayed and reverted.
Advancements in Reactive UI
Web applications have been using reactive UI for many years now. Many frameworks like React.js, CycleJs, angular, Elm, etc., have been providing reactive UI out of the box. As hybrid mobile applications are based on these web technologies, they support reactive applications out of the box. Native mobile applications are slowly adapting reactive along with declarative syntax.
Jetpack Compose and Swift UI are being pushed by the respective platforms as the next big thing. The declarative syntax allows the developer to describe the design in simple and elegant ways. The components have two ideas in particular states and events.
States are the data which the reactive UI observes upon and events are emitted when there is a UI action involved. The best practice is to keep States and Events separate. States when observed by declaratively coded UI redraw the entire screen on changes. This can lead to extra usage of computing power, but this is mitigated by redrawing certain parts of the screen where changes are needed to be shown. States can be global as well within a widget(Ui component).
Conclusion
Reactive UI is the future of native UI designing as it provides significant features that help in fast and quality designing. Few key points to take away from this
- Easy testing — because of segregation of UI and logic
- States and Events — UI observes a state and creates an event
- Time Travel — the ability to store events and go back to previous states
Hope you enjoyed the blog. Please get in touch with us for all your Digital Transformation needs.
