var d = document.createElement("div");
d.className = "new";
d.innerHTML = "<p>Hi Sprint</p>";
Skimming through the code I'm not sure the authors really grok Javascript anyway, which might explain why they need a (pretty thin) custom API for the standard APIs. toArray should be simply this:function toArray(o) { return Array.prototype.slice.call(o) }
Instead it's:
var toArray = function(obj) {
var arr = []
var i = obj.length
while (i--) {
arr[i] = obj[i]
}
return arr
}
This is just silly: prepend: function() {
insertHTML.call(this, "afterbegin", arguments)
return this
},
var insertHTML = function(position, args) {
var argsLen = args.length
var contents = args
[...] var domMethods = {
afterbegin: function(el) {
this.insertBefore(el, this.firstChild)
},
Perhaps this isn't so constructive and I should fork the library and annotate every method with its vanilla Javascript equivalent. I'm sure this post is non-constructive in some respects but I like Javascript, I just wish people would learn how to work with the language it instead of replacing the API wholesale.Modifying your example:
var d = document.querySelectorAll('div');
d = Array.prototype.slice.call(d);
d.forEach(function(el){ el.classList.add('new') });
Vesus: $('div').addClass('new'); [].forEach.call(document.querySelectorAll('div'), function(el) {
el.classList.add('new');
});
But I don't disagree that the jQuery example is easier to write/read/remember.Though with frameworks like Angular or React I'm beginning to question whether we should ever be writing code like this at all.
But yeah cherry-picking may not be the most constructive thing however you do have good points. The DOM API is kinda funky (I wish it did some things like chaining) but it's very simple. Half the times I write a very thin wrapper around it JUST to provide some chaining.
But I suppose I'd love one that is thinner, like your "very thin wrapper", if anybody has pointers.
Don't do that.
To save you some work: http://youmightnotneedjquery.com/
A tiny, lightning fast jQuery-like library for modern browsers.
Respectfully, this entire description is an oxymoron. Every time someone mentions a jQuery-like microlibrary, they just mean a jQuery without wide browser(-quirk) support.Browser support is a big part of what makes jQuery jQuery, and without it, you definitely get a much smaller library, but it is also very un-jQuery-like. :)
Now for some praise! It makes me really happy to see a comparison - benchmark! - with competitors, which is something everyone should be required to do, when they create software with 40,000 similar offerings. Looking at you, Markdown editors!
Though JQuery still recommends the bigger library for most users (unless you're embedding in a mobile app or stuff like that).
I'm curious if it will take jQuery plugins though. Will try later.
But, with every new library there's always the question about support. And so since there is no involvement perceptible on its Github page (no PRs, no issues and 3months without a commit), I wouldn't want to use this in production.
Tests, or it doesn't exist.
If you want syntactic sugar, a better alternative to a client-side library (which has overhead) is to use something like TypeScript (or one of the other compile-to-JavaScript options).
I have dropped jQuery completely except for when I need some of its plugins because I end up having to access the internal DOM objects too often and using $el.get(0) all over the place is ugly and a PITA.
Sprint (phone): 33.1 kops
jquery (phone): 8.8 kops
zepto (phone): 10.1 kops
Sprint (laptop): 1435.2 kops
jquery (laptop): 49.2 kops
zepto (laptop): 65.9 kops
Not bad, if that translates to real world performance.There is a reason why both elm and mercury uses virtual-dom under the hood to generate and manipulate the DOM.
Plus you can render server-side: https://github.com/nthtran/vdom-to-html
If you still want to work with existing html like templates, there is this project: https://github.com/TimBeyer/html-to-vdom
I get 12+ million operation (a true master race class) vs advertised 800,000 and peasantry of jQuery's 300,000.
Not sure if I want to sacrifice performance for aesthetically better looking (debatable ofc) syntax and bother investing time learning how to do something slower.