Nom is performant, minimalist (3 public methods), dependency free library for working with the DOM.

Avoid invalid expectations

NomJS is not a framework, Nom is no Mithril, Riot or React.

It seems that perfection is attained, not when there is nothing more to add, but when there is nothing more to take away. — Antoine de Saint Exupéry

React calls itself a library, but it tells you how to structure most of your code. Both Riot and Mithril are honest frameworks which are minimalist and performant. Riot forces you to the build tool world: Mithril does not. Yet Mithril also gives full suite of application building tools.

And then we have Nom, and Nom only does DOM. You can write your code whichever way you want using whatever paradigm you see fit. Nom simply gives you DOM elements and helps you render your stuff.

Feature Nom Mithril Riot React Easy to build DOM Yes! Yes Yes Yes* Compact syntax Yes! Yes Very Nope* Fancy HTML syntax Nope! Nope* Yes* Yes* Virtual DOM Nope! Yes Yes Yes Router Nope! Yes Yes Nope* Size (minified + gzip) 1.5 kB (0.0.13) 7.0 kB (0.2.0) 4.75 kB (2.1.0) 34 kB (0.13.3)

NomJS is very fast. Nom's internal code is built using pattern repetition and classic procedural style, avoiding slow code style, and preferring fastest known methods when possible. This kind of coding style doesn't make Nom as small as it could be, yet Nom is very small.

Why no Virtual DOM?

Virtual DOM is like the coolest thing that is around here right now. NomJS doesn't have it, because frankly it isn't necessary.

Mithril and React work for the most part so that you build a single render function or a view that gets executed. Then a virtual DOM tree is built and diffed against existing DOM. Nom is different here.

Nom's elements are created once and no actual virtual tree is built on each render. Instead you provide a property update function (if necessary) which is called on each render for each element that has such a function. Changes are made only if there are changes to do. Nom also gives a special treatment to children property: you can pass an array of DOM elements and changes are made to DOM as array's content changes.

In short: binding data to elements happens outside of Nom's scope and Nom does not control it.

Compatibility

NomJS is built for ES5 and browser standards. If you know DOM, you know Nom. Nom just makes DOM easy.

Nom can run in browser engines as old as IE5 as long as a requestAnimationFrame polyfill and es5-shim are provided.

Nom Examples

TodoMVC benchmark & screenshots

Remember that these benchmarks are a better indicator of browser vs. browser performance. A browser side optimization can greatly vary the results.

The most important thing to notice is that both Nom and Mithril are amazingly fast. React is so slow that I didn't want to include it in these benchmarks (being roughly 10x slower than the Mithril TodoMVC 1.3 implementation).

Try it yourself: TodoMVC benchmark

TodoMVC: 250 items

250 items: Chrome 43 250 items: Firefox 38 250 items: Internet Explorer 11

TodoMVC: 500 items

500 items: Chrome 43 500 items: Firefox 38 500 items: Internet Explorer 11

TodoMVC: 1,000 items

1000 items: Chrome 43 1000 items: Firefox 38 1000 items: Internet Explorer 11

TodoMVC: 2,500 items

Only the two fastest implementations fighting from now on.

2500 items: Chrome 43 2500 items: Firefox 38 2500 items: Internet Explorer 11

TodoMVC: 5,000 items

5000 items: Chrome 43 5000 items: Firefox 38 5000 items: Internet Explorer 11

TodoMVC: 10,000 items

Mithril's Chrome-friendly optimizations for thousands of elements kick in.

10000 items: Chrome 43 10000 items: Firefox 38

All benchmarks ran on Windows 7 64-bit.