As more and more of our code is written in an asynchronous manner, managing the flow of our code becomes more challenging. Event broadcasting and subscriptions is a common pattern for controling the flow of an application. Unfortunetly, that can become unmanageable and difficult to follow or debug when applications grow large.
Additionally, when thinking about interactive content, we often have multiple controls in a single interface that can be in different ‘states’. Take a common treemap control, for instance. It may be animating in or out, or may be showing a detail view rather than the entire treemap. Managing the switching in between these states often requires breaking encapsulation and intertwining controls.
Miso Storyboard offers a way to combat the aforementioned issues. Storyboard is a small library for a very simple idea: defining your application (or subset of your applications) as a set of ‘scenes’, each of which has
exit methods. When transitioning to a specific scene, the previous scene’s
exit method is called and the next scene’s
enter method gets invoked. These methods can serve as useful tools for organizing and managing your application’s state.
In practice, this allows you to define the states of your specific application separate from each other. For example, a single component might need to do a few things when it begins (such as rendering some UI and so on,) and when it’s ends (like remove loading messages). That same component can also be ‘updatingData’ or ‘showingDetails’. Either way, the
enter method for each one of these scenes can set up the component state and the
exit method can tear it down.
Miso.Storyboard is built on top of
Underscore.Deferred, which allows your transitions to be asynchronous.