<script src="https://cdn.jsdelivr.net/npm/ractive"></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 much 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.

Gitter npm version devDependency Status Build Status Coverage Status npm downloads Twitter Follow

About Ractive.js

Ractive was originally created at The Guardian 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.

Unlike other frameworks, *Ractive works for you*, not the other way around. It doesn't have an opinion about the other tools you want to use with it. It also adapts to the approach you want to take. This means you're not locked-in to a framework-specific way of thinking. Should you hate one of your tools for some reason, you can easily swap it out for another and move on with life.

This project is the brainchild of an Englishman and has contributors from all over the world. There is an eclectic mix of primarily the Queen's English, a fair amount of 'Murican English, and a bit of others here and there. Things like `adaptor`, `behaviour`, and `dependant` may have more than one spelling but we try to stick to the Queen's English to the extent that we are able.

Fun fact: Fun fact: The name is a reference to Neal Stephenson's The Diamond Age: Or, A Young Lady's Illustrated Primer – a book about (among other things) the future of storytelling.

Downloads

# jsDelivr
https://cdn.jsdelivr.net/npm/ractive

# CDNjs
https://cdnjs.com/libraries/ractive

# unpkg
https://unpkg.com/ractive

# npm
npm install --save-dev ractive

# Bower
bower install --save ractive