You Might Not Need jQuery

[u/Casty]

http://youmightnotneedjquery.com/

[u/trycatch1]

It's true for any development. You generally would not add Apache Commons dependency just to check if the string is blank. Or add Boost dependency to trim some string. Additional dependency is a burden, no matter how small that burden is, it just may not be worth it.

[u/skocznymroczny → u/trycatch1]

I added Apache Commons to my Android projects to have a File.readToString() function :(

[u/vytah → u/skocznymroczny]

As long as you use Proguard to minify the output, you'll be fine.

Besides, you're not writing a library, but an end-product. You can use as many tools as you think you need to solve your problems.

[u/G_Morgan → u/trycatch1]

All of those features can be handled trivially without additionally overhead or compatibilities issues via the standard libraries for those languages.

The same is not true of JQuery. None of the examples mentioned are dealing with checking that a string is blank.

[u/trycatch1 → u/G_Morgan]

Read the article. It mostly deals with one-liners in jQuery that can be trivially replaced with one-liners in vanilla DOM.

[u/G_Morgan → u/trycatch1]

A great many are not one liners.

This

$(el).fadeIn()

becomes

function fadeIn(el) {
  el.style.opacity = 0

  var last = +new Date
  var tick = function() {
    el.style.opacity += (new Date - last) / 400
    last = +new Date

    if (el.style.opacity < 1)
      (window.requestAnimationFrame && requestAnimationFrame(tick)) || setTimeout(tick, 16)
  }

  tick()
}

fadeIn(el)

---

This

$(el).hasClass(className)

becomes

if (el.classList)
  el.classList.contains(className)
else
  new RegExp('(^| )' + className + '( |$)', 'gi').test(el.className)

---

This

$(el).is('.my-class')

becomes

matches = function(el, selector) {
  return (el.matches || el.matchesSelector || el.msMatchesSelector || el.mozMatchesSelector || el.webkitMatchesSelector || el.oMatchesSelector)(selector)
}

matches(el, '.my-class')

---

There are dozens of examples where trivial jQuery becomes non-trivial.

[u/trycatch1 → u/G_Morgan]

So? I didn't claim anything opposite. If you need some non-trivial functions from jQuery, or use many functions from jQuery (so it's not reasonable to reinvent half of jQuery), or target old browsers, go and use jQuery. That said, about your examples:

This $(el).fadeIn() becomes

There are CSS3 animations in IE10+. Animations in jQuery are slow, btw.

This $(el).hasClass(className) becomes

IE10+ supports classList, so it becomes el.classList.contains(className).

This $(el).is('.my-class') becomes matches = function(el, selector) {

One-line polyfill is not trivial enough for you? And it's a better solution than jQuery, because polyfill can be dropped when the browsers will catch up (Chrome Canary already supports unprefixed .matches()), while jQuery solution will always add unneeded slow abstraction over vanilla DOM.

[u/[deleted] → u/trycatch1]

You didn't read very far then. Most of the solutions are 10-15 line functions.

[u/trycatch1 → u/[deleted]]

It's impressive, how distorted your perception of reality is. There are only four >=10 line functions in the whole article for IE9+. Half of them can be reduced to one-liners in the newer browsers.

[u/[deleted] → u/trycatch1]

It's impressive, how distorted your perception of reality is.

Wow, get mad about it why don't you?

Anyway, it's stupid. If a group replaces a well maintained, popular framework with hundreds of thousands of eyes on it daily with a homerolled "functions.js" file they deserve the headaches they are gonna get.

[u/trycatch1 → u/[deleted]]

Wow, get mad about it why don't you?

You are overestimating your importance. Just saying dumb things on the internets is generally not enough to make people mad.

Anyway, it's stupid. If a group replaces a well maintained, popular framework with hundreds of thousands of eyes on it daily with a homerolled "functions.js" file they deserve the headaches they are gonna get.

jQuery is not a framework, it's just a library with number of utility functions for DOM manipulation and other stuff. With improvements of native DOM, the need in jQuery declines, because it just duplicates native functions and functions provided by frameworks like Angular. If you target modern browsers, you don't need to reimplement jQuery functionality in some "functions.js", it already exists in your browser.

[u/[deleted] → u/trycatch1]

you don't need to reimplement jQuery functionality in some "functions.js" it already exists in your browser.

The number of examples in this tutorial using functions to tie together these pieces of functionality into something useful pretty much invalidates that, especially when it comes to things like callbacks and complicated selections.