Skip to content

Rx

Module Rx is the ixfx signal pattern. The basic principle is similar to event listeners, where we subscribe to values being emitted from a source. This is also known as a push or stream idiom, since we can’t pull values on-demand (although see pinging). (Read more about push/pull).

Here’s how the classic event listener looks. We subscribe to ‘pointermove’ event on ‘document’ source, with an anonymous function handling the data:

document.addEventListener(`pointermove`, event => {
// Do something with data
});

In classic events we choose to subscribe to a particular event. That is, the one event source (eg HTML element) can have several streams of events which can be selectively subscribed to. In contrast, reactive types really consist of a single stream of events.

someRx.onValue(value => {
// Do something with value
});

Like generators, a reactive can work with finite sets of data (eg a list of things), or continuous streams of data which potentially have no end, such as a stream of pointermove events.

Importing

// Whole module
import * as Data from "ixfx/data.js"
// Single function
import { resolve } from "ixfx/data.js"
// One of several modules
import { Data, Modulation, Flow } from "ixfx/bundle.js"
// And within your HTML's <HEAD> </HEAD> block:
// <script type="importmap">{ "imports": { "ixfx/": "/ixfx/" } } </script>