Ractive.js

The diamond age
of web development

<script src='http://cdn.ractivejs.org/latest/ractive.js'></script>

Live, reactive templating

Ractive.js is a template-driven UI library, but unlike other tools that generate inert HTML, it transforms your templates into blueprints for apps that are interactive by default.

Powerful and extensible

Two-way binding, animations, SVG support and more are provided out-of-the-box – but you can add whatever functionality you need by downloading and creating plugins.

Optimised for your sanity

Some tools force you to learn a new vocabulary and structure your app in a particular way. Ractive works for you, not the other way around – and it plays well with other libraries.

Get started with the 60 second setup

About Ractive.js

Ractive was originally created at theguardian.com to produce news applications. A typical news app is heavily interactive, combines HTML and SVG, and is developed under extreme deadline pressure. It has to work reliably across browsers, and perform well even on mobile devices.

Many tools exist to help you build web apps, but very few deal with the fundamental problem: HTML, while excellent at describing static documents, wasn't designed for interactivity. Ractive changes that. It takes your Mustache templates and transforms them into a lightweight representation of the DOM – then when your data changes, it intelligently updates the real DOM.

The best way to understand how Ractive will make your life as a web developer easier is to see the examples, try the 60 second setup, and follow the interactive tutorials.

Getting support

There are several ways to get support: