Repository files navigation

___________________________________   |/  /_  __ \_  ___/__  __/__  /|_/ /_  / / /____ \__  /   _  /  / / / /_/ /____/ /_  /    /_/  /_/  \____/______/ /_/

Strongly consider starting with@most/core. It is the foundation of the upcoming most 2.0, hasimproved documentation, new features, better tree-shaking build characteristics, and simpler APIs. Updating from@most/core to most 2.0 will be non-breaking and straightforward.

You can keep using most 1.x, and update to either@most/core or most 2.0 when you're ready. See theupgrade guide for more information.

Most.js is a toolkit for reactive programming. It helps you compose asynchronous operations on streams of values and events, e.g. WebSocket messages, DOM events, etc, and on time-varying values, e.g. the "current value" of an <input>, without many of the hazards of side effects and mutable shared state.

It features an ultra-high performance, low overhead architecture, APIs for easily creating event streams from existing sources, like DOM events, and a small but powerful set of operations for merging, filtering, transforming, and reducing event streams and time-varying values.

• API docs
• Recipes
• Examples
• Get it
• Core & Community Packages

Here's a simple program that displays the result of adding two inputs. The result is reactive and updates whenevereither input changes.

First, the HTML fragment for the inputs and a place to display the live result:

<form><inputclass="x"> +<inputclass="y"> =<spanclass="result"></span></form>

Using most.js to make it reactive:

import{fromEvent,combine}from'most'constxInput=document.querySelector('input.x')constyInput=document.querySelector('input.y')constresultNode=document.querySelector('.result')constadd=(x,y)=>x+yconsttoNumber=e=>Number(e.target.value)constrenderResult=result=>{resultNode.textContent=result}exportconstmain=()=>{// x represents the current value of xInputconstx=fromEvent('input',xInput).map(toNumber)// y represents the current value of yInputconsty=fromEvent('input',yInput).map(toNumber)// result is the live current value of adding x and yconstresult=combine(add,x,y)// Observe the result value by rendering it to the resultNoderesult.observe(renderResult)}

You can find the example above and others in theExamples repo.

Most requires ES6Promise. You can use your favorite polyfill, such ascreed,when,bluebird,es6-promise, etc. Using a polyfill can be especially beneficial on platforms that don't yet have good unhandled rejection reporting capabilities.

As a module:

npm install --save most

// ES6import{/* functions */}from'most'// orimport*asmostfrom'most'

// ES5varmost=require('most')

Aswindow.most:

bower install --save most

<scriptsrc="most/dist/most.js"></script>

As a library via cdn :

<!-- unminified --><scriptsrc="https://unpkg.com/most/dist/most.js"></script>

<!-- minified --><scriptsrc="https://unpkg.com/most/dist/most.min.js"></script>

Most.js works with typescript out of the box as it provideslocal typings that will be read when you import Most.js in your code. You do not need to manually link an externald.ts file in your tsconfig.

Most.js has a dependency on native Promises so a type definition for Promise must be available in your setup:

• If your tsconfig is targeting ES6, you do not need to do anything as typescript will include a definition for Promise by default.
• If your tsconfig is targeting ES5, you need to provide your own Promise definition. For instancees6-shim.d.ts

Most.js streams arecompatible with Promises/A+ and ES6 Promises. They also implementFantasy Land andStatic LandSemigroup,Monoid,Functor,Apply,Applicative,Chain andMonad.

Reactive programming is an important concept that provides a lot of advantages: it naturally handles asynchrony and provides a model for dealing with complex data and time flow while also lessening the need to resort to shared mutable state. It has many applications: interactive UIs and animation, client-server communication, robotics, IoT, sensor networks, etc.

A primary focus of most.js is performance. Theperf test results indicate that it is achieving its goals in this area. Our hope is that by publishing those numbers, and showing what is possible, other libs will improve as well.

Most.js is highly modularized. It's internal Stream/Source/Sink architecture and APIs are simple, concise, and well defined. Combinators are implemented entirely in terms of that API, and don't need to use any private details. This makes it easy to implement new combinators externally (ie in contrib repos, for example) while also guaranteeing they can still be high performance.

Aside from making combinators less "obviously correct", complexity can also lead to performace and maintainability issues. We felt a simple implementation would lead to a more stable and performant lib overall.

Most.js integrates with language features, such as promises, iterators, generators, andasynchronous generators.

Promises are a natural compliment to asynchronous reactive streams. The relationship between synchronous "sequence" and "value" is clear, and the asynchronous analogue needs to be clear, too. By taking the notion of a sequence and a value and lifting them into the asynchronous world, it seems clear that reducing an asynchronous sequence should produce a promise. Hence, most.js uses promises when a single value is the natural synchronous analogue.

Most.js interoperates seamlessly with ES6 and Promises/A+ promises. For example, reducing a stream returns a promise for the final result:

import{from}from'most'// After 1 second, logs 10from([1,2,3,4]).delay(1000).reduce((result,y)=>result+y,0).then(result=>console.log(result))

You can also create a stream from a promise:

import{fromPromise}from'most'// Logs "hello"fromPromise(Promise.resolve('hello')).observe(message=>console.log(message))

Conceptually,generators allow you to write a function that acts like an iterable sequence. Generators support the standard ES6Iterator interface, so they can be iterated over using ES6 standardfor of or the iterator'snext() API.

Most.js interoperates with ES6 generators and iterators. For example, you can create an event stream from any ES6 iterable:

import{from}from'most'function*allTheIntegers(){leti=0while(true){yieldi++}}// Log the first 100 integersfrom(allTheIntegers()).take(100).observe(x=>console.log(x))

You can also create an event stream from anasynchronous generator, a generator that yields promises:

import{generate}from'most'function*allTheIntegers(interval){leti=0while(true){yielddelayPromise(interval,i++)}}constdelayPromise=(ms,value)=>newPromise(resolve=>setTimeout(()=>resolve(value),ms))// Log the first 100 integers, at 1 second intervalsgenerate(allTheIntegers,1000).take(100).observe(x=>console.log(x))