Skip to content
The concise CSS selector engine
JavaScript HTML
Find file
Pull request Compare This branch is 3 commits ahead, 45 commits behind master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


Nut 0.1.21

Nut is a concise query selector engine that just allows you to do extremely simple queries.

Oh jeez, another engine?!

Yeah, right, there's a lot of CSS selector engines, but just a few of them are really smalls.

First of all, nut is, most of the time, faster than querySelectorAll (take a look at the benchmark) and then faster than all selector engines. But please note that nut doesn't implement request caching (to avoid unecessary code additions and performance loss) because the user can easily keep a request and pass it as a context to another request. This is, nut aims to be minimal to have a very tiny footprint and extreme velocity based on the observation that much of CSS requests could be kept as simple as possible since javascript is able to handle a lot of things.

Nut is different from the other tiny engines, here's what they are:

  • QSA wraps querySelectorAll
  • Svetlo (from picoCSS) is also a wrapper around querySelectorAll
  • Quewery handles ids, tags and querySelectorAll as fallback


  • querySelectorAll is not supported by all browsers, so supporting it with no fallback is inconsistent
  • picoCSS uses for casting NodeList objects as arrays, that is inconsistent too (but this framework doesn't seem to be made for cross-browser support, so I don't tell to throw a stone at it)
  • QSA, picoCSS and Quewery don't support contexts

Then, nut tries to be fully reliable and as fast as possible by removing the most CSS syntax without becoming unhandy. There's another very interesting engine: micro-selector. It supports another CSS syntax and is extensible.


Here's it can handle:

.bar p
section #foo .bar p [name="baz"]

And here's it can't:

div *
div#foo input[name="baz"]
div > p
div + p

So, all pseudo-classes, attribute selectors (except for the name attribute) and other advanced syntax are not allowed. But, let's dig in it:

// Return an array

Of course, queries can have a context (an array, a NodeList, or a node):

// Get nodes from the #foo context
nut('.bar p',nut('#foo'));

And that's all you need to know ;)

Ender integration

Nut is compatible with ender and supports some useful syntax.

Selecting nodes, as usually:

$('.bar p',$('#foo'));

Selecting existing nodes:

var nodes=$('.bar');

Creating new elements:

// elements var has 2 nodes
var elements=$('<b>foo</b><i>bar</i>');


Nut is published under the MIT license.

Something went wrong with that request. Please try again.