Built to take advantage of modern web features, reactive web applications are a powerful way of developing web apps. Unlike server-side rendered apps that need expensive round-trips, reactive web quickly reacts to any user interaction. The pressure on the backend servers is also decreased, making these apps scale much better under heavy loads, all leading to a smoother user experience.

Table of contents:

• How Did We Get Here?
• Why Reactive Web?
• What are Reactive Web Applications?
• What Kind of Apps Can I Build With Reactive Web?
• Start Taking Advantage of Reactive Web Today

It’s a way to expand your app portfolio with the next generation of web apps, but  if you're already an OutSystems user, you can also convert your existing traditional web apps built with low-code to reactive web. Learn how to make your web apps more responsive, more flexible, and better positioned to meet modern demands with this Tech Talk.

How Did We Get Here?

Back in 2016, we released OutSystems 10, giving our customers the capability to build mobile apps with a native look and feel, all with low-code. This means there is no need to resort to custom Android or iOS development or assembling distinct teams with specific skills.

Four years have passed and we couldn’t be happier. We’ve had customers build all sorts of mobile solutions, from customer banking apps to mission-critical apps for employees that run the business, to field service apps that have to work without network connectivity.

We made this possible by doing all the heavy-lifting of producing specific Android and iOS native code, and by introducing a new front-end architecture based on ReactJS that gives freedom to developers to build new engaging apps.

We introduced new capabilities like support for apps that work under poor network conditions or completely disconnected, asynchronous data loading, and complex design and interaction patterns. We learned a great deal along the way, which has allowed us to evolve the product and extend these concepts to web apps.

Why Reactive Web?

The reactive web model ensures you don’t need highly skilled front-end developers and a multitude of code frameworks to create complex, data-rich interfaces that adapt to changes in real-time. Additionally, your team only needs to develop the front-end once for both mobile and web. This means you’ll be able to get your apps to market faster and deliver experiences that match those of the leading apps your users have fallen in love with.

Take advantage of the talent within your organization to build multi-channel experiences across mobile and web by sharing and reusing logic and components between channels. With a state-of-the-art stack, your apps will be future-proof, built on top of industry-standard architecture and best practices.

What are Reactive Web Applications?

Reactive web is more than an architectural and technological revamp. It brings a lot of additional value to the apps you build with OutSystems. Let’s get through the main features to get a clearer picture of everything that reactive web has to offer.

1. Unparalleled Performance

We’ve revisited the way data is handled, allowing it to be asynchronously fetched and bound to the UI in parallel with the page rendering. This means you can easily create interfaces that work well when data latency is an issue.

From observing how developers use our platform, we also added features to increase the performance of your apps. For example, we’ve optimized the fields and variables being exchanged between server and client, ensuring that only data that is being used is sent to the browser or device, dramatically reducing the payload when fetching data.

On top of that, we’ve made sure you can design your app to store information on the client-side, reducing how often you need to make roundtrips to the server.

2. Great UX/UI With No Limits

We’ve analyzed the market and user expectations to optimize and add to our existing widgets and patterns, providing better coverage for the types of apps companies are looking to build. Patterns were optimized for the new client-first development paradigm, ensuring an incredible experience from the get-go. And all of this can be done using low-code, without having to orchestrate complex logic or jump into traditional code to update the UI of these patterns.

3. A Unified Development Experience

We’ve closed the gap between mobile and web development by allowing you to build apps in the same way for any channel, easily reusing components between them. You’ll be able to leverage the talent you have in-house to create multi-channel experiences with a single development language and paradigm, which means faster apps at a lower cost.

4. State-of-the-Art Framework

The JavaScript ecosystem is always changing with libraries and frameworks such as jQuery, React, Angular, and Vue constantly evolving. This forces developers to learn and change frameworks from project to project, or even from month to month to follow the latest trends.

OutSystems generates code based on state-of-the-art frontend architectures so you don’t need to worry about selecting and learning the latest JavaScript framework. With reactive web, we’re abstracting away this complexity so you can focus on building what your users need.

What Kind of Apps Can I Build With Reactive Web?

Reactive web allows you to build any kind of app, even those used by millions of users simultaneously. There are, however, some types of apps that will especially benefit from this new model as they are particularly reliant on data-intensive and dynamic interface patterns.

For instance, consider your bank’s self-service portal where lots of different types of data are presented to you in different ways. Balances across multiple accounts, recent transactions, statements–all of this needs to be presented elegantly and intuitively without lag as you drill into the details.

Customer service apps such as contact center apps also benefit from a reactive web interface. To better serve customers, call center agents gather different types of information from multiple sources and systems. An app that allows them to do this quickly and in a single pane of glass can mean the difference between a happy customer and a lost business opportunity.

Finally, internal apps - usually deployed at a departmental level - can also benefit from a reactive web approach. These range from simple employee apps, like vacation scheduling or timesheet input and approval, to mission-critical apps for managing projects or planning budgets. These apps can increase employee productivity and positively impact employee satisfaction.

Start Taking Advantage of Reactive Web Today

If you’re already on OutSystems 11, all you need to do is ensure you update to the latest version to start creating a new generation of web apps. Then, when creating a new app in Service Studio, just select the Reactive Web App option from the New Application wizard and you’ll be working in this new model immediately.

If you’re still on OutSystems 10, this is a great opportunity to consider upgrading to this new version.

You can reach out to us with any feedback or suggestions using our ideas page or engage with our incredible community. We look forward to seeing the apps our customers create using this runtime!