derivablejs | Functional Reactive State for JavaScript and TypeScript | Reactive Programming library

There are two types of Derivable:.
Atoms Atoms are simple mutable references to immutable values. They represent the ground truth from which all else is derived. import { atom } from "derivable"; const name = atom("Richard"); name.get(); // => 'Richard' name.set("William"); name.get(); // => 'William'
Derivations Derivations are declarative transformations of values held in atoms. You can create them with the derive function. import { derive } from "derivable"; const cyber = word => word .toUpperCase() .split("") .join(" "); const cyberName = derive(() => cyber(name.get())); cyberName.get(); // 'W I L L I A M' name.set("Sarah"); cyberName.get(); // 'S A R A H' Unlike atoms, derivations cannot be modified in-place with a .set method. Their values change only when one or more of the values that they depend upon change. Here is an example with two dependencies. const transformer = atom(cyber); const transformedName = derive(() => transformer.get()(name.get())); transformedName.get(); // => 'S A R A H' const reverse = string => string .split("") .reverse() .join(""); transformer.set(reverse); transformedName.get(); // => 'haraS' name.set("Fabian"); transformedName.get(); // => 'naibaF' derive takes a function of zero arguments which should dereference one or more Derivables to compute the new derived value. DerivableJS then sneakily monitors who is dereferencing who to infer the parent-child relationships.