laroux.js 2.1.0

This project is a jQuery substitute for modern browsers and mobile devices. But instead of offering some wrappers and own dynamics, it simply provides helper functions to achieve the same objectives as jQuery or Zepto.

laroux.js is right for you if you:

  • Complain about people who do not know the difference between jQuery and Javascript.
  • Love working with more compact, organized libraries in smaller sizes (~45K).
  • Want to be working with native DOM objects instead of wrappers.
  • Want to leverage the debug console's autocomplete/fluent typing.
  • Are not satisfied with the performance of other libraries on mobile devices.
  • Looking for a light abstraction layer to build your toolkit on.
  • See FAQ for more.
Demos Snippets FAQ Downloads »

Selectors by Tagname

operations per second (higher is better)

laroux.js

$l('body');

jQuery/Zepto

$('body');

Selectors by Element Id

operations per second (higher is better)

laroux.js

$l('#home');

laroux.js (Alternative)

$l.id('home');

laroux.js (Alternative 2)

$l.idc('home');

jQuery/Zepto

$('#home');

Selectors by Class

operations per second (higher is better)

laroux.js

$l('.container');

laroux.js (Alternative)

$l.dom.selectByClass('container');

jQuery/Zepto

$('.container');

Each on Arrays

operations per second (higher is better)

laroux.js

$l.each([52, 97], function(index, value) {
    console.log(index + ': ' + value);
});

laroux.js (Alternative)

$l.aeach([52, 97], function(index, value) {
    console.log(index + ': ' + value);
});

jQuery/Zepto

$.each([52, 97], function(index, value) {
    console.log(index + ': ' + value);
});

Each on Objects

operations per second (higher is better)

laroux.js

$l.each({a: 1, b: 2}, function(index, value) {
    console.log(index + ': ' + value);
});

jQuery/Zepto

$.each({a: 1, b: 2}, function(index, value) {
    console.log(index + ': ' + value);
});

Map on Arrays

operations per second (higher is better)

laroux.js

$l.map(['eser', 'ozvataf'], function(value) {
    return value;
});

laroux.js (Alternative)

$l.amap(['eser', 'ozvataf'], function(value) {
    return value;
});

jQuery/Zepto

$.map(['eser', 'ozvataf'], function(value) {
    return value;
});

Map on Objects

operations per second (higher is better)

laroux.js

$l.map({a: 'eser', b: 'ozvataf'}, function(value) {
    return value;
});

jQuery/Zepto

$.map({a: 'eser', b: 'ozvataf'}, function(value) {
    return value;
});

Create DOM Element

operations per second (higher is better)

laroux.js

$l.dom.createElement('DIV', { class: 'x' }, 'y');

laroux.js (Alternative)

$l.dom.create('<div class="x">y</div>');

jQuery/Zepto

$('<div class="x">y</div>');

DOM Manipulations

operations per second (higher is better)

laroux.js

var div = $l.dom.createElement('DIV');
$l.dom.append(div, 'appended');
$l.dom.prepend(div, 'prepended');
$l.dom.clear(div);
$l.dom.remove(div);

jQuery/Zepto

$('<div>')
    .append('appended')
    .prepend('prepended')
    .empty()
    .remove();
To add your own benchmarks to this page, please don't hesitate to send your pull requests to this branch, all you need to do is editing benchmarks.html and placing your values into assets/js/benchmarks.js file.