BT

Ready for InfoQ 3.0? Try the new design and let us know what you think!

RiotJS Takes Big Step Forward with 2.3 Release

| by James Chesters Follow 2 Followers on Nov 10, 2015. Estimated reading time: 2 minutes |

The Riot.js core team has released version 2.3, describing it as "a big step forward" for the React-like micro-library.

Like the name suggests, Riot aims to disrupt the complexity of the existing frontend space. Addressing the "serious weak points" its creators perceive in React, riot.min.js weighs in at 18.3KB, compared to the 119KB of react.min.js, coming with custom tags and compact syntax.

The major 2.3 release organises the code base into six different modules: compiler, tmpl, observable, route, core and cli. Speaking to InfoQ, Gianluca Guarini -- one of the core developers for Riot -- says for him this change is one of the biggest improvements to Riot, meaning that "if you want to use just a part of the framework like the riot-route or the riot-observable you can do it without using riot at all."

2.3 also adds the HTML5 history router. From 2.3, Riot "will execute the given callback when the URL changes and it match the filter."

For example:

// matches to just `/fruit`
riot.route('/fruit', function(name) {
  console.log('The list of fruits')
})

Wildcards(*) are allowed in filter and you can capture them as arguments:

// if the url change to `/fruit/apple`,
// this will match and catch 'apple' as `name`
riot.route('/fruit/*', function(name) {
  console.log('The detail of ' + name)
})

// if the url change to `/blog/2015-09/01`,
// this will match and catch '2015', '09' and '01'
riot.route('/blog/*-*/*', function(year, month, date) {
  console.log('The page of ' + year + '-' + month + '-' date)
})

Loop behaviour is also updated in Riot 2.3, looking at both speed and reliability. DOM nodes are now moved, inserted, and removed always in sync with data collections, and while the Riot team mention this can make rendering slower, developers can add no-reorder to the loop nodes for a faster rendering algorithm.

In the next release, the team aims to solve the issues raised by the community in Riot 2.3. Guarini specifically mentions to InfoQ he would like to change the build using rollup. Also anticipated are new parsers in the compiler, like sass, that would allowing users to export just the CSS, HTML or JavaScript from their Riot tags.

Riot is free, open source, and licensed under the MIT License. Guarini says Riot accepts contributions from all over the world with no big lobbies or multinational companies behind the library, unlike with other libraries. Instead, he says, Riot is made by passionate people, spending part of their spare time building a tool that anyone can use.

Riot is made possible by a number of active contributors from around the world. InfoQ readers interested in contributing are invited to read the contributing.md file and send their patch to one of the repos.

Rate this Article

Adoption Stage
Style

Hello stranger!

You need to Register an InfoQ account or or login to post comments. But there's so much more behind being registered.

Get the most out of the InfoQ experience.

Tell us what you think

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread
Community comments

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

Discuss
BT