A lightweight library for creating reactive, state-based UI.
Reef is a simpler alternative to React, Vue, and other large frameworks.
🚀 New & Updated! The Vanilla JS Pocket Guides have been completely updated with new methods and modern JS approaches.
- Weighs just 3kb minified and gzipped, with zero dependencies.
- Load it with a
<script>element or ES module import—no command line or transpiling required (though you can if you want).
- Uses DOM diffing to update only the things that have changed.
- Has Redux/Vuex-like data stores, with setters and getters baked right in.
- Bundled with an optional lightweight router for single-page apps, as well as an ajax-loaded HTML alternative for super snappy multi-page apps.
- Automatically encodes and sanitizes data to help protect you from cross-site scripting (XSS) attacks.
- Compatible with all modern browsers.
Ditch that bloated framework, and make web development fun and simple again!
Why use Reef?
Reef is an anti-framework.
It does a lot less than the big guys like React and Vue. It doesn’t have a Virtual DOM. It doesn’t require you to learn a custom templating syntax. It doesn’t provide a bunch of custom methods.
Reef does just one thing: render UI.
Couldn’t you just use some template strings and
innerHTML? Sure. But Reef only updates things that have changed instead of clobbering the DOM and removing focus from your form fields. It also automatically renders a new UI when your data updates, and helps protect you from XSS attacks.
If you’re craving a simpler, back-to-basics web development experience, Reef is for you.
(And if not, that’s cool too! Carry on.)
Hi, I'm Chris Ferdinandi. 👋
Get Daily Developer Tips
I send out a short email each weekday with code snippets, tools, techniques, and interesting stuff from around the web. Join 12,200+ daily subscribers.