We can see how fast is our code compared to existing recommendation in the following viddeo
Our POC is written in Typescript and the main.js is as simple as a few subscriptions :
- the core$ observable
- each experience$ observable
One of the huge advantages of FRP is that the code is very readable.
You just have to follow the pyramid (and not the flow !!!)
core$
So let’s check the core$
In our case it is very simple as the only subscription we want to activate is the link between a PotionsContainer and the data contained in the store
experiences$
Experiences is an array of observables.
Each observable is created by a factory extracted from the Experience library.
In our case we only have one experience : the “basketModal” recommendation banner.
This factory merge two observable :
- one responsible to store the HTML of the recommendation in the store.
- another in case the recommendations needs to be appended dynamically that will add a recommendationBanner
Remains to-do
Explicit the store singleton
include Objection.js to parameterize eveything
pure JSON parameters
Improve sources