| Framework | Version | Minified Size |
|---|---|---|
| Ember | 1.13.3 | 493.3kb |
| Angular | 1.4.2 | 145.5kb |
| React | 0.13.3 | 121.7kb |
| Web Components Polyfill | 0.7.5 | 117.1kb |
| Riot | 2.2.2-beta | 12.75kb |
Riot brings custom tags to all modern browsers. Think React + Polymer but with enjoyable syntax and a small learning curve.
<timer>
<p>Seconds Elapsed: { time }</p>
this.time = opts.start || 0
tick() {
this.update({ time: ++this.time })
}
var timer = setInterval(this.tick, 1000)
this.on('unmount', function() {
clearInterval(timer)
})
</timer>riot.mount('timer', { start: 0 })Custom tags lets you build complex views with HTML.
<timetable>
<timer start="0"></timer>
<timer start="10"></timer>
<timer start="20"></timer>
</timetable>HTML syntax is the de facto language on the web and it's designed for building user interfaces. The syntax is explicit, nesting is inherent to the language and attributes offer a clean way to provide options for custom tags.
- Absolutely the smallest possible amount of DOM updates and reflows.
- One way data flow: updates and unmounts are propagated downwards from parent to children.
- Expressions are pre-compiled and cached for high performance.
- Lifecycle events for more control.
- No proprietary event system.
- Event normalization.
- The rendered DOM can be freely manipulated with other tools.
- No extra HTML root elements or
data-attributes. - Plays well with jQuery.
- Create tags with CoffeeScript, Jade, LiveScript, Typescript, ES6 or any pre-processor you want.
- Integrate with NPM, CommonJS, AMD, Bower or Component
- Develop with Gulp, Grunt, Browserify, or Wintersmith plugins
- Power shortcuts:
class={ enabled: is_enabled, hidden: hasErrors() }. - No extra brain load such as
render,state,constructororshouldComponentUpdate - Interpolation:
Add #{ items.length + 1 }orclass="item { selected: flag }" - Compact ES6 method syntax.
- Riot Todo MVC
- Hackernews reader
- Vuejs examples by Riotjs
- Flux-like ES6 Todo
- Simple TODO
- Timer
- Another flux demo caparable to React ones
- Various experiments
- Isomorphic application
- flux-riot todo
- Building Apps with Riot, ES6 and Webpack
- Building Apps with Riot, Babel and Browserify
- Building tabs with Riot
- The "React tutorial" for Riot
- How to package "tag libraries" in Riot
- Another React tutorial with Riot
- Riot Custom Tag by Example
- Riot Compiler Explained
- Adding compiled Riot tags to your Gulp + Browserify build
- Riot + AngularJS
- Module loader for WebPack
- Riot + Meteor
- Riot on CodeClimate
- Riot Snake Game
- Riot Tag Syntax Checker
- Riot 文档中译版 🇨🇳
- Riot + Wintersmith
- Riot precompiler plugin for lineman
Riot is made with ❤️ by many smart people. Thanks to all the contributors
project : riot
repo age : 1 year, 9 months
active : 356 days
commits : 1476
files : 196
authors :
447 Gianluca Guarini 30.3%
392 Tero Piirainen 26.6%
150 Aurimas 10.2%
50 Tsutomu Kawamura 3.4%
42 rsbondi 2.8%
27 Marcelo Eden 1.8%
20 Kalman Speier 1.4%
18 Márcio Coelho 1.2%
18 Juha Lindstedt 1.2%
16 Alberto Martínez 1.1%
15 Anton Heryanto 1.0%
14 andynemzek 0.9%
13 Greg 0.9%
11 Hrvoje Šimić 0.7%
10 Andy VanEe 0.7%
9 Avner Peled 0.6%
8 Mark Henderson 0.5%
8 Andreas Heintze 0.5%
8 a-moses 0.5%
7 Tianxiang Chen 0.5%
7 Ashley Brener 0.5%
7 marciojcoelho 0.5%
7 Lee Tagg 0.5%
7 Avnerus 0.5%
6 Jens Anders Bakke 0.4%
6 sethyuan 0.4%
6 hemanth.hm 0.4%
5 midinastasurazz 0.3%
5 Tatu Tamminen 0.3%
5 jigsaw 0.3%
4 Richard Bondi 0.3%
4 Eric Baer 0.3%
4 blissland 0.3%
4 Giovanni Cappellotto 0.3%
4 xieyu33333 0.3%
3 Magnus Wolffelt 0.2%
3 Artem Medeusheyev 0.2%
3 Jim Sparkman 0.2%
3 korige 0.2%
3 Alan R. Soares 0.2%
2 Simon JAILLET 0.1%
2 Alexis THOMAS 0.1%
2 Andrew Feng 0.1%
2 Andrew Kiellor 0.1%
2 Andrew Luetgers 0.1%
2 Antoine Goutagny 0.1%
2 Bolt 0.1%
2 Collin Green 0.1%
2 David Salazar 0.1%
2 Eric Capps 0.1%
2 Jasmine Hegman 0.1%
2 Markus A. Stone 0.1%
2 Milosz 0.1%
2 Mohammed Irfan 0.1%
2 Moot Inc 0.1%
2 Philippe CHARRIERE 0.1%
2 Sergey Martynov 0.1%
2 Steve Clay 0.1%
2 Tim Kindberg 0.1%
2 Tobias Baunbæk 0.1%
2 crazy2be 0.1%
2 jmas 0.1%
2 luffs 0.1%
2 oldpig 0.1%
2 yibuyisheng 0.1%
2 Žiga 0.1%
2 陈海峰 0.1%
1 Sam Morgan 0.1%
1 Justin Dorfman 0.1%
1 Simone Vittori 0.1%
1 Steel Brain 0.1%
1 nino-porcino 0.1%
1 Steven Koch 0.1%
1 TZ | 天猪 0.1%
1 Jorrit Schippers 0.1%
1 Tenor Biel 0.1%
1 Jonny Buchanan 0.1%
1 The Gitter Badger 0.1%
1 Jonathan Dumaine 0.1%
1 Ari Makela 0.1%
1 Benoit Hirbec 0.1%
1 Trent Ogren 0.1%
1 Joel Thornton 0.1%
1 Umut Sirin 0.1%
1 Zach Aysan 0.1%
1 Ivan Saorin 0.1%
1 afc163 0.1%
1 Ian Walter 0.1%
1 Fernando Correia 0.1%
1 borishuai 0.1%
1 Barkóczi Dávid 0.1%
1 h2so5 0.1%
1 Eliseo Arias 0.1%
1 Danil Semelenov 0.1%
1 Marcin Jekot 0.1%
1 typicode 0.1%
1 Matthew McCullough 0.1%
1 Maxence Dalmais 0.1%
1 Mike Breen 0.1%
1 Courtney Couch 0.1%
1 kylobite 0.1%
1 xieyu03 0.1%
1 Liu Jin 0.1%
1 Patrik Buckau 0.1%
1 Constantin Rack 0.1%
1 Quim Calpe 0.1%
1 Riccardo Gueli Alletti 0.1%
1 Juwan Yoo 0.1%
1 Ryan O’Hara 0.1%
1 Boris Huai 0.1%