Comments: Migrating from jQuery to vanilla JS about aristath.github.com HOT 4 OPEN

Yes, it would be best to use getElementById when applicable for performance.
If you're not converting a jQuery script to vanilla and you don't need a simple way to just do a search-and-replace on your scripts and be done with it, then it would be recommended to use these faster methods.
However, if you want to build a drop-in replacement for jQuery custom-tailored to your own needs, then querySelectorAll is the only really viable option. And it's not slow, it's absurdly fast: https://gomakethings.com/javascript-selector-performance/

When writing something from scratch I'd definitely prefer using getElementById. But when converting a script I'd just go for the convenience of querySelectorAll 👍

from aristath.github.com.

Excellent article! One question, is using querySelectAll on the wrapper function the best for performance? Wouldn't using getElementById be better when applicable?

from aristath.github.com.

Great stuff!

In lemonReady, I think let item = items.length[ i ]; should be let item = items[ i ];

from aristath.github.com.

@aristath great blog. well i think i kind of found an issue.

in below code i have marked a line which i believe that some other line of code should get replaced. because i keep getting below listed error

/**
 * Get the parents based on a selector.
 *
 * @param {string} selector - The CSS selector.
 * @return {Object} - returns the _lemon object to allow chaining methods.
 */
_lemon.prototype.parents = function( selector ) {
	let found = [],
		self  = this;
    this.each( function( el ) {
--        let elFound = self.parents( selector, el );
        if ( elFound ) {
            found = found.concat( elFound );
        }
    });
	return new _lemon( found );
};

- Uncaught InternalError: too much recursion

from aristath.github.com.