Skip to content
Get packs

Cycle.js

A JavaScript framework for building apps with reactive streams and pure functions.

GitHub Download unified-tag
Stars
10.2k
Forks
424
Licence
MIT
Language
TypeScript
Last update
5 months ago
Type
Framework

What it is

Cycle.js is a JavaScript framework for building web apps in a functional, reactive style. Your app is written as a pure function that takes input streams (such as user events or HTTP responses) and returns output streams, which keeps side effects separated and the code easier to predict. The project is split into small packages, such as @cycle/dom and @cycle/run, that you combine as needed.

  • Build a browser UI whose state is driven by streams of user events
  • Make HTTP requests with @cycle/http and feed responses back into the UI
  • Structure an app as isolated components using @cycle/isolate

Great for

  • Developers who already know reactive streams such as RxJS, xstream, or most.js
  • Teams that want explicit, testable data flow in front-end code
  • Developers interested in functional programming applied to user interfaces

Not ideal for

  • Beginners looking for a large, widely documented ecosystem, since the README points mainly to official docs and a chat channel
  • Projects that need a mainstream framework with many off-the-shelf components, because the README does not describe one
Step-by-step guide: how to use Cycle.jsInstall, first run, examples, tips and FAQs
Cycle.js vs React

How to get it

  1. 1

    Install with a package manager

    You'll need: Node.js and npm

    Clone the repository

    git clone https://github.com/cyclejs/cyclejs.git
  2. 2

    Run it

    • Read the official documentation at cycle.js.org
    • Install the packages you need, such as @cycle/run and @cycle/dom, from npm
    • Write a main function that takes sources and returns sinks
    • Run it with @cycle/run and a DOM driver
  3. 3

    Get the most out of it

    • Use @cycle/isolate to keep components' state separate
    • Pick a stream library (RxJS, xstream, or most) that matches your team's experience
    • Use @cycle/http for network requests as a driver rather than calling fetch inside components

Downloads

Source code (.zip)master branch · straight from GitHubRelease unified-tagRelease notes and sourceOfficial website & docscycle.js.org

Strengths

  • Side effects are pushed to the edges through driver packages, which the README presents as the core design
  • Built from separate packages, so you install only the parts you need
  • MIT licensed and actively maintained, with a recent push to the repository

Trade-offs

  • Requires understanding of reactive streams before the code feels natural
  • The README is short and defers most learning to the external documentation site
  • Release is listed only as a tag with no downloadable binaries, so it is used as a library through npm

How it compares

ProjectStarsTypeLevelUpdatedBest for
cyclejs (this)10.2kFrameworkadvanced5 months agoDevelopers who already know reactive streams such as RxJS, xstream, or most.js
react252kLibraryintermediate6 days agoDevelopers building interactive web interfaces with JavaScript
vue212kLibraryintermediate2.1 years agoMaintaining an existing Vue 2 application that cannot yet be upgraded
textual37.6kFrameworkbeginner27 days agoPython developers who want a terminal app with buttons, tables and forms
slate31.7kFrameworkadvanced8 days agoDevelopers building a custom rich text editor inside a web app
langchain149kFrameworkintermediate4 days agoPython developers building LLM-powered applications

Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.