Applied to Potions - The BIG POC

An example of the implementation of Potions framework to a real client
profile photo
Julien Vinckel
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
Image without caption
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
Image without caption
Image without caption

experiences$

Experiences is an array of observables.
Each observable is created by a factory extracted from the Experience library.
Image without caption
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
Image without caption

Remains to-do

Explicit the store singleton
include Objection.js to parameterize eveything
pure JSON parameters
Improve sources
Related posts
post image
The actor model - trick to never complete the channel
post image
Reactive framework
Example
Potions Store
Potions ComponentStore
We are creating store/actor factories that will behave a certain way
post image
Creating a new query language specialized in event processing
Powered by Notaku