Tracker
Tracker is an incredibly tiny (~1k) but incredibly powerful library for transparent reactive programming in JavaScript. (It is a fork of Meteor Tracker)
Tracker gives you much of the power of a full-blown Functional Reactive Programming (FRP) system without requiring you to rewrite your program as a FRP data flow graph. Combined with Tracker-aware libraries, this lets you build complex event-driven programs without writing a lot of boilerplate event-handling code.
Tracker is essentially a simple convention, or interface, that lets reactive data sources (like your database) talk to reactive data consumers (such as a live-updating HTML templating library) without the application code in between having to be involved. Since the convention is very simple, it is quick and easy for library authors to make their libraries Tracker-aware, so that they can participate in Tracker reactivity.
This README has a short introduction to Tracker. For a complete guide to Tracker, consult the thorough and informative Tracker Manual, which is five times longer than the Tracker source code itself. You can also browse the API reference on the main Meteor docs page.
Installation
npm:
npm install --save tracker
Example
Take this ordinary JavaScript function:
{ return * 9/5 + 32;}
We can call it for its value (assuming there's a currentTemperatureCelsius
function):
> currentTemperatureFahrenheit()
71.8
But, if the currentTemperatureCelsius
function is Tracker-aware (or even if it's not, but as long it reads the current temperature ultimately from some Tracker-aware data source), then we can also call currentTemperatureFahrenheit
reactively.
var Tracker = ; // Reactive function { return * 9/5 + 32;} var handle = Tracker;
The current temperature is 113 F.
The current temperature is 75.2 F.
The current temperature is 39.2 F.
...
The function passed to Tracker.autorun
is called once immediately, and then it's called again whenever there are any changes to any of the reactive data sources that it referenced. To make this work, currentTemperatureCelsius
just needs to register with Tracker as a reactive data source when it's called, which takes only a few lines of code.
var Tracker = ;var dep = ;var temperature = ; // create random temperature { var min = 0; var max = 100; var range = max - min; var temperature = Math + min; return temperature;} // Data source { dep; return temperature;} // dep.changed() will cause Tracker-aware recompute.;
The function Tracker.autorun return a computation. And we can stop "Reactive function" recomputing everytime data source change by using stop function in computation object.
handle;
Code
var Tracker = ;var dep = ; // create random temperature { var min = 0; var max = 100; var range = max - min; return Math + min;} var temperature = ; // Data source { dep; return temperature;} // dep.changed() will cause Tracker-aware recompute.; // Reactive function { return * 9/5 + 32;} var handle = Tracker; // stop recomputing;
The current temperature is 75.2 F.
Temperature changed.
The current temperature is 93.2 F.
Temperature changed.
The current temperature is 123.8 F.
Temperature changed.
Stop recomputing.
Temperature changed.
Temperature changed.