These are chat archives for jdubray/sam

20th
Mar 2018
Jean-Jacques Dubray
@jdubray
Mar 20 2018 01:26
The only optimization I ever needed on the front-end was for "slow rendering" components like DataTables and C3 Charts. Otherwise, I feel there is a lot of room to render the state representation as directly as possible.
Otherwise I divide the state representation in sections { header, section1, section2, footer} and I let the model provide hints as to whether each section needs to be recomputed.
I use a hash of the state representation's content to decide whether I need to redisplay each section, but you don't need that with Angular.
devin ivy
@devinivy
Mar 20 2018 04:47
haven't unravelled it, but came across this and thought you all might be interested (cc @foxdonut) http://vieux.io/
Daniel Neveux
@dagatsoin
Mar 20 2018 06:50

Otherwise I divide the state representation in sections { header, section1, section2, footer} and I let the model provide hints as to whether each section needs to be recomputed.

@victornoel could be efficient for you ?

Victor Noël
@victornoel
Mar 20 2018 07:12
@jdubray my application is mostly made of tables and charts :P
so not really @dagatsoin, and anyway I'm doing angular, so I'm using template and rxjs to to transmit the state representation (as a js object) to the view
my problem is more about computing the state representation from the model in an intelligent way
Victor Noël
@victornoel
Mar 20 2018 07:19
By the way, the other day I described the architecture I realised to instantiate SAM in an angular app, but I had to change things, now it is like this:
  • model is a ngrx store (aka you send events to it with a payload, one or several functions, reducers, are triggered to update, atomically, the internal datastructure, and the new data is pushed into an rxjs observable)
  • actions is a service (i.e. just a class instantiated once) with methods that trigger mostly asynchronous operations and then send events to the model store
  • state is a service that listens to model changes (well, it gets the full model, but other ideas like having the diff could be used, as @dagatsoin was proposing yesterday) and then : 1) triggers new actions and 2) if desired, compute a new state representation based on the model and push it to an rxjs observable that the view can listen to selectively (so they only get changes that concerns them)
Daniel Neveux
@dagatsoin
Mar 20 2018 07:19

Ok it lacks of explanation. I mean, can you prepare some hints into the model for the State to be able to do some cherry peak ?

For exemple:

model.staleUserData: boolean
model.staleWhatEverSetOfData: boolean
Victor Noël
@victornoel
Mar 20 2018 07:22
I can do that, or listen to the diff of the model, or etc, but I feel like it is sad that I have to add all those extra things for SAM to work with complex problems :/ I'm sure I'm doing something wrong somewhere maybe, or expecting for something too good to be possible
but yes, that could be an option, thanks for re-explaining :)
Daniel Neveux
@dagatsoin
Mar 20 2018 07:28
De rien :)
Your implementation is close of what can be done with other libs like Mobx.
The thing is SAM is just a pattern. So the implementation complexity depends on the possibilities of the language we use.
It works with vanilla JS for sure, but at scale (for exemple in a game with hundreds of game object/models) you will always finish with additional libraries which make computation more efficient.
Note that in years, when SAM will be natively implemented in a few javascript function in all browsers (I am sure it will), all this boilerplate will be an old nostalgic story.
SAM is the new Promise()
Victor Noël
@victornoel
Mar 20 2018 07:30
^^
Jean-Jacques Dubray
@jdubray
Mar 20 2018 13:43
@victornoel there is no free lunch as we say here. Yes SAM is a pattern and describes what happens and hopefully why it needs to happen that way, but the how is completely open. Excel doesn't automagically work, or React/Angular change detection mechanism or even GraphQL. Someone had to code it. I my case I value code correctness over boilerplate, any day.
Jean-Jacques Dubray
@jdubray
Mar 20 2018 14:07
I really encourage you to think about the following questions:
  • what is a clock (bonus points if you can also answer the question what is time)
  • How do you introduce one or more clocks in your code
  • Compare IFTTT and FSM approaches to Temporal Logic (as defined by the three operators, prime, always and existantial quantification)
Temporality with IFTTT and FSM is achieved with strong coupling and low cohesion.
RayoGundead
@RayoGundead
Mar 20 2018 14:14
@dagatsoin how will a native version of SAM in the browser work?
there are so many ways to wire up the pattern
also, has anyone seen this already? https://staltz.com/why-we-need-callbags.html
it's like the trends are heading towards vanilla
Janne Siera
@jannesiera
Mar 20 2018 14:20
@jdubray I prefered when you used the term Petri-Net instead of FSM to highlight the difference with a TLA+ style state machine. TLA+ can be used to describe both infinite state machines and finite state machines. The only difference between an FSM and infinite state machines is that the finite version has an ending state. (or to quote Leslie Lamport: "If the behavior is finite, then it ends in a state s for which there is no
state t with hs, ti ∈ N .")
I think SAM is more concerned with how to express the state machine in a way that's easy to reason about (where the program's steps are made very explicit) but it can describe any kind of state machine (behavior)
Including finite ones
And you'll find many examples of finite behaviors in UI programs. One would be a simple "e-mail signup" site, where you enter your e-mail, click send and get shown a "submitted" page.
The "submitted" page is the final state of the program, because there is no transition to any other state.