Reactive Programming
What is reactive programming?
The programming paradigm allows us to manipulate steams of data using functions. Everything needs to happen asynchronously.
Ex:
- In the java programs, it executes line by line. Until one line executes, the next line won’t execute. It’s synchronous programming or imperative (procedural) programming.
- But reactive programming mean to work asynchronously. It’s not waiting for an order. (using functional programming)
- In reactive programming, data should come as a stream.
- You can use this with HTTP backends.
- You can do different tasks, separately( asynchronously ) without bothering or depending on other tasks.
What is Functional Programming?
Use functions to create expressions rather statements. Focus on What is the objective (what to solve).
- Java,.Net or most of the languages do not support Reactive Programming. So we need some external support for converting these languages to support reactive programming.
- reactivex.io is the official framework that governed reactive programming. They have separate libraries for each language.
Java = RxJava
Javscript = RxJS
(RxJS (Reactive Extensions for JavaScript) is a library for reactive programming using observables that makes it easier to compose asynchronous or callback-based code.)
.Net = Rx.Net
Scala = RxScala
- For Angular, they have an RxJs converting version called, NgRx.
(NgRx is a framework for building reactive applications in Angular. NgRx is inspired by the Redux pattern — unifying the events in your application and deriving state using RxJS. At a high level, NgRx stores a single state and uses actions to express state changes)
Let’s go for a practical example:
- Use JS Bin for this testing.
- First, add Rxjs library and create a button.
- Inside the Javascript section, write the below code.
- Click on the button and observe the results in the console.
- When you keep trying this, you can see multiple values are coming in the same second.
- Now change the code with RxJS.
- Here you can use Observable pattern but you have to subscribe to this. (Subject is emitting data, but you need to subscribe to get data.)
- But here also you get the same result.
So what we can do with RxJS? Why do we use it???
- Change the code like below.
- Here you use throttleTime(1000). That means 1 second.
- How much you click doesn’t matter. It’s only executed it only per second. You just add one line and do it with RxJS.
Thank you and Happy Learning!