Home

Awesome

<img src="https://raw.github.com/radioactive/radioactive/master/logo.png" align="right" width="300px" />

Radioactive is a Native FRP ( Functional Reactive Programming ) environment for Javascript.

By Native we mean that it enables Functional Reactive Programming at the language level. You can write plain Javascript code and let Radioactive deal with Async Data Access and Automatic Change Propagation.

It takes a radically different approach from Bacon.js and RxJS. You don't have to learn a new API or a different way of thinking. You write simple imperative Javascript code that runs from top to bottom and let Radioactive figure things out for you.

In a nutshell. You can forget about callbacks and events and work as if all data was local and stable.

Example

The following snippet shows how easy it is to work with an Ajax Datasource, a Firebase stream and a stream of data from an HTML text input. Notice that, even though they are completely different in nature, they can all be treated like normal functions and there are no callbacks or events.

And this completely reactive of course: If data changes the text value of #output will be updated accordingly.


// radioactive.data exposes popular datasources as reactive streams
// but you can easily write your own
var rates      = radioactive.data("https://openexchangerates.org/api/latest.json?app_id=4a363014b909486b8f49d967b810a6c3&callback=?");
var currency   = radioactive.data("#currency-selector-input");
var bitcoin    = radioactive.data("https://publicdata-cryptocurrency.firebaseio.com/bitcoin/last");

radioactive.react(function(){
  var value =  bitcoin() * rates().rates[currency()];
  $("#output").text( "1 BTC =  " + currency() + " " + value );
})

You can completely abstract yourself from "where the data comes from" and "how often it changes" and let radioactive.react do all the heavy lifting for you.

This leads to purely functional, highly scalable and mantainable code. You can easily unit test your app or replace parts of your code with mock datasources. Here's how a more modularized version of the previous code might look like:

var rates      = radioactive.data("https://openexchangerates.org/api/latest.json?app_id=4a363014b909486b8f49d967b810a6c3&callback=?");
var currency   = radioactive.data("#currency-selector-input");
var bitcoin    = radioactive.data("https://publicdata-cryptocurrency.firebaseio.com/bitcoin/last");

// notice that this function is wrapping an Ajax call and a Firebase stream
// but you can completely abstact yourself from that fact
function getCurrentBitcoinValue( curr ){
  return bitcoin() * rates().rates[curr];
}

radioactive.react(function(){
  $("#output").text( "1 BTC =  " + currency() + " " + getCurrentBitcoinValue( currency() ) );
})

You can find more examples on the /examples folder.

Or check out these examples in the wild:

radioactive.data knows how to connect to a series of popular datasources out-of-the box, but the real power of Radioactive is that it is highly extensible. There are many ways to connect your own streams or async services. Third party integrations are also available.

Getting Started

We suggest you read The Radioactive Tutorial.

But if you are in a hurry:

Install

$ bower install radioactive
$ npm install radioactive

What is Radioactive, again?

Depending on where you come from, there are many ways to describe Radioactive.

Next generation UI frameworks can leverage Radioactive as their data-binding layer. Data source publishers can use Radioactive to provide a more user-friendly API.

How does Radioactive Compare to X?

Community