I use JQuery to code in JavaScript. It's easy, less coding, more readable. When we compare JQuery to pure JavaScript, the JQuery is around 80% slower than pure JS.
So, JQuery (or other JS library) is a very good thing for the developer but at the end become a bad thing for the user : slower to load, slower to run.
JavaScript is running on the client side.
So, in my opinion, if I want to code easily with a frameworks it's my business.
It the developer's problem and the client don't have to see the difference.
I am wondering if is possible to code in JQuery, and compile it (locally) on a pure JavaScript.
I mean something like lesscss.
DOM access with Jquery
this JQuery code is faster to write but is 80% slower than pure JS : performance report
for example, the JQuery code :
$('#mydiv').css('backgroundColor', 'red');
$('#mydiv').hide();
$('#mydiv').html('hello');
$('#content .col').each(function () {
$(this).html('ok')
});
would be compiled to pure JS :
document.getElementById('mydiv').style.backgroundColor = 'red';
document.getElementById('mydiv').style.display = 'none';
document.getElementById('mydiv').innerHTML = 'hello';
var query = document.querySelectorAll('#content .col');
for (var i = 0; i < query.length; i++) {
query[i].innerHTML = 'ok';
}
prototype.js class declaration
this prototype.js déclaration is faster to write but is 98% slower than pure JS : performance report
for example the prototype.js code :
var Animal = Class.create({
initialize: function(name, sound) {
this.name = name;
this.sound = sound;
},
speak: function() {
alert(this.name + " says: " + this.sound + "!");
}
});
var cat = new Animal('Kitty', 'Meow');
cat.speak();
would be compiled to pure JS :
function Animal(name, sound) {
this.name = name;
this.sound = sound;
}
Animal.prototype.speak = function() {
result = (this.name + " says: " + this.sound + "!");
}
var cat = new Animal('Kitty', 'Meow');
cat.speak();
At the end, the question is about to have good tools to code quickly without impact on the user.