A reactive frontend framework for JavaScript

import {Block, run} from 'cyclow'

const Counter = () => Block({
  on: {
    'in.init':  () => counter => 0,
    'dom.increment': () => counter => counter + 1,
    'dom.decrement': () => counter => counter - 1
  view: counter => ({tag:'div#app', content: [
    {tag: 'div.counter', content: `${counter}`},
    {tag: 'div.buttons', content: [
      {tag: 'button', on: {click: 'decrement'}, content: '-'},
      {tag: 'button', on: {click: 'increment'}, content: '+'}

run(Counter, {target: 'app'})

Why another JavaScript framework?

Well, I really like Cycle.js. It's a nice reactive framework. But it's too pure for me.

With Cyclow, instead of thinking in a big global model and pure functions, you have to think in interconnected components with async inputs/outputs and their own state. It's something like an electronic circuit, where you can wire up electronic components. Cyclow aims to be more intuitive and easier while it's still reactive and quite declarative.


Powered by Graflow, a graph stream library


Build your apps connecting components


Powered by Snabbdom, a virtual DOM library with a great performance


The whole framework weights less than 10 kb (minimified and gzipped)