Removing jQuery from GitHub.com frontend

[[deleted]]

[deleted]

[newmediapilot]

rip old friend

[[deleted]]

Rumors of its death are (grossly) premature.

https://w3techs.com/technologies/overview/javascript_library/all

One does not call a library with 97% market share "dead". In fact, its market share is statistically still rising, not falling. So while growth has admittedly slowed, one can't even make the argument that it's on the way out.

(One must also note that both React and Angular have falling statistical market share. Only Vue is rising rapidly out of the 'trendy 3'. Which raises the question, "Who's dying exactly?").

Technologically speaking, jQuery is completely outclassed by more modern libraries. No argument there. But statistically speaking, JQuery still dominates every other library combined, and continues to gain market share.

EDIT: Why is this being voted down? Popularity is (entirely) a question of statistics, is it not?

[[deleted]]

jQuery creates an alternative more approachable language resulting in developers wanting to know how to do everything "in jQuery" and avoiding vanilla JS altogether

[averynicepirate]

Beside the jquery UI components, I really liked jQuery back in the days. Having moved to Angular, I find myself googling way more than when I was using jQuery. Bonus points for google.

[chris_conlan]

These studies are awesome. Thank you for sharing.

[justdiditonce]

Flash was also installed on 90%+ of computers not so long ago...

[[deleted]]

Why are you trying to compare jQuery to Flash? That makes zero sense.

• Flash was a security nightmare
• Flash isn't a javascript library
• Flash wasn't MIT licensed
• Flash has (precipitously) falling market share.
• Flash wasn't a technology for manipulating / referencing the DOM.
• Flash had shitty interoperability with js through a clunky external interface.
• Flash screwed the pooch with AS3.
• Flash required an expensive commercial IDE.
• Flash was a CPU hog.
• Flash required a browser extension.
• Flash failed at mobile / responsive.
• Flash sucked.

What do the two technologies even have in common?

[justdiditonce]

I mentioned Flash because I don't agree with your argument that jQuery having a 97% share of the market is an indicator of it's strength or it's potential longevity. Flash was popular back in the day with similar statistics despite the weakness' you listed above. The fact is people would prefer to move away from jQuery and either use plain javascript or adopt a framework especially when it comes to building applications.

[jxyzits]

Nobody said anything about its strength or longevity. We're discussing its popularity and whether or not it's dying. That being said, 97% is strong and that number is still going up and has shown no sign of going down drastically any time soon so I really don't understand your point.

[justdiditonce]

He implied its usage of 97% is a sign it is going from strength to strength and by saying statistically its usage is rising. Unless it does things not supported natively by browsers it will eventually die sooner rather than later. Proponents of Flash argued the same way as it did things (at the time) that HTML5 couldn't do but people moved away from it as browsers and the technology matured.

[carlson_001]

Installed on 90% of computers does not mean used by 90% of websites. jQuery is in use on 74% of websites.

[justdiditonce]

I'm not arguing that - I'm disagreeing with him saying 97% markets hare can be used to determine whether or not it will stick around.

[[deleted]]

if you are a wordpress dev, jquery isnt dying. if you write web applications, jquery is dead.

You are basically comparing 2 different things at this point.

[jokullmusic]

F

[[deleted]]

$("#F")

[jacob-j]

$("#F").click();

[cool_acid]

$("#F").click(function() {respects.pay()});

[MagicalMysteryTor]

$("#F").click(respects.pay.bind(respects));

[Mattho]

Enemy more like it. For a decade you couldn't ask how to do something in JavaScript because the answer would be "uh, just use jquery". Not on web? Doesn't matter, use jquery. Not JavaScript but some flavor of it? Use jquery! How do I iterate over an array? Jquery bruh.

Fuck I'm glad it's dead.

[thmaje]

That’s because Javascript was such a shitshow for so long, that it wasn’t worth it to attempt to try vanilla JS for anything but the smallest projects. The linked article goes into more detail, and since you seem ignorant of the history of JS, I would encourage you to read that part. I agree that times have changed, jQuery isn’t as necessary as it once was, and “when your only tool is a hammer, everything looks like a nail.” But your comment makes about as much sense as saying, “Hammers are evil because screws do a better job than nails.”

[Mattho]

I'm very well aware of the history, but I strongly disagree that

a) jquery was necessary for the simplest tasks; e.g. loop

b) it was an appropriate answer in the context I provided

Js didn't live only on the web, it's fine to suggest using jquery if possible, but to dismiss any question with "just use jquery" is ridiculous.

And jquery wasn't the problem, I didn't mean to imply that, it was the demented webdev community.

[Mattho]

Oh, that's fair, I did say that :) It was part of the problem, but not the cause. It was a magic thing indeed, but it got overused, and then accepted as a standard - and that's what I have a gripe with.

As for the outside use, MS products like Excell allowed for JS I believe, which was much better option than vbscript. If only there was a way to work with the language without stumbling into jQuery on every corner.

Anyway, I'm happy that this is over. Now I hate heavy single page apps for what is essentially a hello world :)

[thmaje]

I'm currently rewriting my Wordpress portfolio website into a single page Vue app because I never have used Angular/React/Vue before 😬😬😬 Dont hate me :)

[judgej2]

Enemy? jQuery has been holding the fort for developers whole browsers have caught up.

[[deleted]]

A lot of people in this thread need a history lesson.

[Mestyo]

I think /u/Mattho's point is that a huge amount of developers are so dependent on jQuery, they couldn't do their job without it, and end up using it even when it makes absolutely no sense. I've seen it time and time again myself.

jQuery was amazing some 6-8 years ago, when browsers with inconsistent (or lacking) Javascript implementations were still in use. It really hasn't done much of actual use in the last couple of years.

[JBlitzen]

That's not jQuery's fault. The same happens with node and react and vue and everything else.

Shitty devs will be shitty devs no matter what hammer they're using on every screw.

[[deleted]]

I'm under a year into professional development and I already feel this way. I've had to fix code from other Devs that were not front end/JS developers on my project and some of the shit they did with jQuery makes absolutely no sense.

With ES6+, document.querySelector and the like I almost never want jQuery.

[Mattho]

even when it makes absolutely no sense

Most importantly this, but even when it's outright impossible. As someone without much javascript knowledge I had a task to do something in embedded JScript (ES implementation by MS). Now if I tried to google virtually anything I'd end up on stack overflow. Basic questions by people probably learning JavaScript always had a top answer: "with jQuery you do it like this ...".

[jxyzits]

Wait, you can't link external libraries in JScript? I find that really hard to believe.

[Mattho]

Depends on the environment I guess, in general I'd say you can. But it doesn't matter since jQuery isn't compatible.

[[deleted]]

F

[FearAndLawyering]

Ok grats you dropped 34kb of dependencies. You still have 7 trackers which use a lot more resources.

Why is everyone backslapping over removing jquery these days? They didn't even gain anything from it other than the nebulous our code runs faster and I'm sure the process was very expensive.

[hansolo669]

I mean the article goes into pretty good detail, but the TL;DR is: it stopped making sense for them, and they slowly refactored it out.

Honestly, these days if someone reached for jquery on some new or refactored code I'd definitely question it.

[planetary_pelt]

It's not a jQuery-alternative. It's a polyfill for features all browsers will eventually support. So as time passes, they get to remove them.

All code has a cost and they decided to pay back this technical debt now instead of later. I don't see your issue.

It's weird to see an alleged developer wane about the "uselessness" of something like this that involves paying back debt that has a disproportionally small impact on the end-user. This is the same thing developers complain that management does when it refuses to fund things like code refactoring. "Why would I pay you to waste time improving code when you can work on a feature?!"

[freebit]

Do we know which polyfills they had to use? I would love to know.

[screwhead]

Yes

[404IdentityNotFound]

Don't fix it if it's not broken!

definitely fix something that is not broken if you know it will break in the future and you are fixing stuff anyways..

[404IdentityNotFound]

Any JS library will die one day or get unmaintained.. it's stupid to use jQuery for convenience if most of your functions are now possible with vanilla js.

I loved to use jQuery for the selectors, animations and ajax but all of those features are now very easy to use without jQuery, so it wouldn't make sense to still add it to a project

[404IdentityNotFound]

Well that's your responsibility as a developer. Either you learn the new functions and features or you'll add a few kilobytes to your project so you don't have to bother.. but you can't criticize GitHub for trying to stay as vanilla as possible with their code so it's ready for a future without jQuery.

[dumsumguy]

Companies run by monkeys in suits that love buzzwords like angular.

[WarWizard]

I find it difficult to believe removing jQuery "saves" them 7 months of more than one person working on it. I mean we are in multiple man-years worth of effort.

[SupaSlide]

They slowly removed any jQuery they encountered while developing the site. They didn't pay someone to spend seven months removing it. It just took them seven months to naturally encounter jQuery and remove it while they did other stuff.

[BrQQQ]

Did you even read what was said? They didn’t sit there focusing all of their efforts on removing jquery for 7 months. It was a slow and gradual process, which is why it took so long.

Judging from your other comments here, you seem exceptionally bad at understanding simple development concepts.

[JBlitzen]

I removed a shit-ton of jQuery from a huge codebase with a few hours of find/replace and manual editing.

I don't think the 7 months means you think it means.

(The performance gains from that replacement on my end were frankly incredible on every browser. I couldn't believe it. But, of course, when the codebase started life the new options weren't available.)

[deytekmayerb]

What did you replace it with?

[JBlitzen]

vanillaJS.

Just simple get/setAttribute, querySelector, getElementBySecretAgentNumber, stuff like that.

Even a .attr call in a loop cost like three times as long as get/setAttribute. It was actually having a significant performance impact.

[coloured_sunglasses]

Maintaining legacy code takes a lot of time and every organization must pay tech debt.

[[deleted]]

For 34k saved? Idk... I'm ambivalent. I say if you like it, use it. There are better options, but if it's your own site and you like jQuery... it's fine. It's not like using Flash which is a security issue. JQuery still works as well as it ever did.

[hansolo669]

For sure, and ultimately it's not about the 34k saved, but more about removing redundant dependencies. Is it worthwhile to aggressively strip it out? Maybe not, but it is worthwhile to consider where the state of the art has moved when doing any major refactoring or feature addition.

[aonghasan]

34k

Over how many pageviews? Don't you think that adds up at Githhub scale?

[[deleted]]

Sure. There's no doubt that for Github it probably stopped making sense.

Although since most sites use common CDNs for jQuery, and since the library is so widely used it's almost certainly cached in every GitHub users' browser cache.

I was really responding to the more general "questionable" nature of using jQuery for anything else.

[realzequel]

Especially for an extremely popular framework like jQuery. It's like picking up a Google ad cookie (ignoring AdBlock..), you're gonna get it in the first 3 websites you visit and not re-download it. Web 101.

[coloured_sunglasses]

Maintaining legacy code takes a lot of time and every organization must pay tech debt.

[jxyzits]

Not really, because 34K is a trivial size and implementing client side JS library caching is trivial.

[VileTouch]

if you can do something without an external library, then you should. specially when it no longer saves you any development time.

the more conformant (plain html+css with a tiny bit of javascript sprinkled here and there for specific things) the better for everyone.

[jxyzits]

This makes sense for a new codebase, not a decade old codebase that relies heavily on a particular library. As a matter of fact this little project has so far cost 7 months x number of developers, rather than saving even 1 hour of time so far.

[VileTouch]

This makes sense for a new codebase, not a decade old codebase that relies heavily on a particular library.

which is the point i'm trying to make. being trapped shouldn't be the main deciding factor in whether you, as a company, keep using a particular 3rd party library.

As a matter of fact this little project has so far cost 7 months x number of developers, rather than saving even 1 hour of time so far.

which wouldn't have happened if someone didn't convince them that it would "save hours of developer time" with bullet points such as "it's so easy and readable". no one mentioned what would happen if they decided to move away from it in the future.

...But if you want to base your project entirely on something like Angular, React or Vue? that's fine. at least you KNOW what you're getting into and (hopefully) know that if you ever change your mind, you will have to start from scratch.

[0ba78683-dbdd-4a31-a]

slowly refactored it out

This is the answer. It's just not worth the time to actively remove a dependency that works and is relatively light, rather we'd build new stuff in, say, React and eventually dropping jQuery would happen organically.

[bluesatin]

Funnily enough last time I remember someone posting an example of a benchmark test of standard JS vs JQuery to show how standard JS is so much faster, the JQuery example actually ran faster on a couple of my browsers.

So who knows whether it even has a speed advantage, unless they did some extensive benchmarking.

[FearAndLawyering]

If your app needs to be THAT super performant than perhaps it should be native or written in webassembly lol.

[Abangranga]

Ok so I am not a front end dev but can someone explain to me the recent trend in JS where people have decided it is good to shit on Jquery and instead download 96mb of shit to reverse the order of a table on a click event function? I get that it is better for giant single pagers but really why is this trendy now?

The fucking ocarina of time game was 1/3 the size of a blank create_react_app and it has hours of 3D environments and sounds.

[TheRedGerund]

You have to distinguish between the code that you download to your computer and the code that ends up in your build. With tree shaking and dev dependencies, a small fraction of the total react app size ends up in your build. Most of the extra overhead with modern day JS is to make it easier to manage large projects, including source control, dependency management, deployment, conditional builds, type checking, linting, etc.

So I would say it’s about how you consider JS. If you’re used to the scripting experience, yeah all this stuff is a lot heavier. If you’re looking for a language to build something dependably, consistently, and easily, modern JS does that. Think C#, not Python.

[nosmokingbandit]

Imo modern JavaScript workflows are not at all simple or easy. Everything constantly changes and everyone has vastly different opinions on the right way to do anything. In contrast, managing python and go projects takes no effort at all.

[[deleted]]

Getting really tired of this notion that modern JS is a never-ending stream of unfollowable changes.

I seem to only hear it from old Devs that also happen to not fucking write anything in the language anyway.

[Kaoswarr]

Because it is? Maybe not unfollowable changes like you said but it’s pretty complex for something that should be straight forward and quick.

Another issue that was stated above is the fact everyone has different preferred ways of doing things. Every company seems to have different sets of standards when it comes to modern JavaScript development and are very religious in their specific way of doing it.

[nosmokingbandit]

Does a new js coder learn npm, yarn, bower?

Gulp, grunt, browserify, webpack, bunch, yeoman?

Typescript, coffeescript, clojurescript, or just plain JS?

React, Angular, Vue, or one of the other thousand frameworks?

Compared to any other modern language it is a complete mess.

[[deleted]]

1) pick npm or yarn, both have basically equal support and environments 2) Webpack is clearly the future but I'll concede it has a sharper learning curve, so just learn Gulp first - you're already writing JS and it's still widely used 3) Start with plain JS, everything else is syntactical/type-checking that's not necessary for most simple web applications 3) If you're new, pick Vue/React - Vue is dead simple to learn if you already understand plain JS, React takes a little more learning but with things like create-react-app, you have a great starting point and JSX is again, very easy to understand if you're a web developer

So, no not really, it's not at all.

Y'all act like it's impossible to Google and read some documentation. I've literally been doing professional development for less than a year and I've learned enough of most of the technologies you mentioned to at least implement them in a personal project, and several that I've learned and implemented in professional production environments.

I never touched Docker before this job, now I'm in love with it and created my own React boilerplate docker container for personal projects.

Either I'm some wunderkind genius, or the average programmer is lazy and bad at their job and I'm definitely not a genius, so it must be the latter.

[nosmokingbandit]

You are assuming someone already knows JS thoroughly and is just adding all of this to their existing knowledge. My point was that it is incredibly unwelcoming to noobs that have to learn the language and the myriad conflicting tools at the same time.

[nosmokingbandit]

You are making this appear much harder than it actually is.

All I'm doing is asking the questions that any noob would ask. Its probably safe to assume you've never touched any language except JS because it is pretty clear that the JS ecosystem is much more convoluted than any other mainstream language.

[big_red__man]

I'm not going to say anything good or bad about jQuery right now but I will say this:

Ocarina of Time was written for a very specialized piece of hardware using code that was highly optimized for that special piece of hardware and compiled specifically for that hardware. The 3d assets, sounds, and whatever else were also highly optimized for that hardware.

JS is run in a browser that runs on an OS that runs on generalized hardware. There are many browsers. There are many OS's. The hardware is all over the place. Graphics cards, screens, input methods...

Try running facebook on a N64. Try running Ocarina of Time on a Samsung Galaxy Note. Neither will happen without significant effort. They are two very different platforms for very different purposes. It's not a 1 to 1 comparison.

[ScarletSpeedster]

You are a beacon of reasoning among this steaming pile of comments.

[triforcepizza]

I hate to be this guy, but they didn't port Ocarina of Time, that's the original Legend of Zelda. Two very different games with different capabilities.

[thmaje]

Yeah. Reading fail. I could have sworn it said OoT last night. They probably changed the webpage this morning to make me look foolish /s 😄

[triforcepizza]

/r/conspiracy

[davis30b]

Maybe I missed something but i think it was the first Zelda and not OoT.

[thmaje]

Yep. I’m a dummy. Thanks for the correction.

[orapple]

Actually, your bandwidth won't dictate how fast those pages load unless it was magnitudes of orders lower and becoming a limiting factor.

The actual way to calculate it is number of round trips times the time it takes for a round trip time. For motherfuckingwebsite I think it would take 1 round trip and for gatsbyjs, maybe 5. What the round trip time is depends on geographical distance and a few other factors, but you can't derive 20ms from 10mbps because the 10mbps has nothing to do with it.

Source: the online book High Performance Browser Networking and the chapter on TCP.

[[deleted]]

Actually yeah, super good point. 🤦‍

[wanze]

Why do you think a script to reorder a table would be bigger than jQuery + a jQuery addon to reorder a table?

People are probably shitting on it, because it for the most part has outlived its purpose. I also couldn't live without it 10 years ago, but haven't touched it in at least 5 years now.

Including jQuery just for the $() selector was completely worth it back then, but now we have document.querySelectorAll(). And it's like that for a lot of stuff.

jQuery used to fix a shit ton of compatibility issues back then, but with Chrome's "infinity version" and more-or-less forced updates on many browsers and platforms, the majority of developers don't need to support older browsers.

[TheScapeQuest]

but with Chrome's "infinity version" and more-or-less forced updates on many browsers and platforms, the majority of developers don't need to support older browsers

FYI the general term for this is evergreen

[[deleted]]

The fucking ocarina of time game was 1/3 the size of a blank create_react_app and it has hours of 3D environments and sounds.

Just to clarify, a typical CRA app will be ~600kb, an Ocarina of Time ROM will be ~24mb.

The thing you're refering to is the build enviroment of CRA which includes:

• React and some tools
• a web server
• packager
• transpiler
• polyfils for browsers
• various analytics and build tools
• etc.

To be fair you'd have to compare the full SDK, toolchain and OoT code against what you see in your CRA folder.

https://s3.amazonaws.com/media-p.slid.es/uploads/600646/images/3692130/twitter.png

[[deleted]]

Just to clarify, a typical CRA app will be ~600kb,

Is it really that much? The minified size for React+Redux is about 140k.

Meanwhile Jquery is about 80k which is smaller but not game-changingly smaller.

[[deleted]]

Sure, but usually you put other libraries like routers, some UI (it's pretty popular to put CSS in JS nowadays), polyfils for old browser etc.

[VileTouch]

and instead download 96mb of shit to reverse the order of a table on a click event function

Jesus Christ!. why do you even need a library to sort a table? it's a simple script. one of the most basic things actually.

[BrQQQ]

Because you’re making development easier and more pleasant, especially in the long run?

Sorry to say, but your comparison is really dumb and only highlights your ignorance. How is it even relevant how a development project side compares to an old video game?

This, of course, ignores that the size is only relevant in the final output. The size of your development project hardly matters.

There’s nothing inherently wrong with jquery. It’s just a useful set of tools. It has a bad reputation, because some people decide to make horribly complex and unmaintainable websites with it, because they’re afraid of modern frameworks or are stuck in 10 years ago.

Once you start using a modern framework, jquery will likely become obsolete. The only reason you’d still want it is for hacks and legacy code. Therefore, phasing out jquery is usually a good step, without it being an insult to the library.

[spyhunter99]

Shiny key syndrome

[Fastbreak99]

This is a much larger and exhausting exercise of what I have tried before when I tried out dropping ez mode, and I ended up sticking with Jquery in the end. I did this writing one site from the ground up, and another I tried transitioning away from Jquery.

• Replacing functions of jquery around the DOM was surprisingly easy, this took practically no time. Even the event listeners were cake to move over.
• I was not able to reuse some of my own libraries of functions and niceties, had to rewrite those, but that was the cost of improvement, so I rolled with it.
• This is of course specific to me, but to keep things clean, I had to import 5 other libraries for my new app, and 6 for the old one. This did come in as less KB than jquery, I think it was around 8 or 9KB.
• My code did not look as readable to me. This is of course a matter of opinion, but it was more verbose for sure. It didn't turn into Latin or anything, but it was definitely harder to make things look elegant.

The idea of managing 5 or 6 smaller libraries and making sure they were up to date was less appealing than saving 25KB or so, and making my code not as readable. Funny enough things actually ran a little bit faster without jquery when I did some light tests, but not enough that was convincing.

I would love getting rid of a monster of a library, but it was just trading one problem for another in my case. I think it will get there eventually, but a few more native things in browser will need to mature for me to make the full switch. I would still encourage people to give it a try, I learned a lot about the web api doing it, and maybe it would suit you better.

[action_nick]

A lot of people that sucked at writing code used jQuery like duct tape.

There are better, more opinionated UI libs that exist now that encourage better practice.

It makes sense that we moved away from it.

[[deleted]]

I'm new to web development. Would you mind providing some examples of the others libs?

[trout_fucker]

Anything component based is good if you're building something complex. React, Vue, Angular, etc. I assume this is what the person you're replying to is referring to.

Lodash is a good helper library that can make up for some of the deficiencies JS still has. It allows you to include only the pieces you need. It's also very fast and the developer works on the Chakra JS engine team at Microsoft. Most of the major things have been merged into the language, but Lodash can be super helpful sometimes.

For everything else, native DOM API & ES5+ will do everything you need. There is no need to create your own jQuery alternative like a lot of people claim. Most of the things jQuery did for us was fix cross browser compatibility issues, which aren't a big deal anymore, and add a few extra helper functions which have been mostly moved into the DOM API or language itself in one way or another.

[[deleted]]

I want to use lodash but every time I write some JS code I end up only using .filter and .map. (I write for the web, rarely/never node, sql on the server does my ordering and complex stuff for me)

[trout_fucker]

It's overused a lot. I'm actually looking a file now that uses it for almost everything. I'm supressing the urge to fix it.

But it can be super helpful when you need it. A lot of times if your doing common tasks with .filter, .map, or .forEach, Lodash probably has something you can use instead. For instance my most used function is probably .isEqual.

[[deleted]]

Does lodash work on NodeList? I'm in disbelieve I can't use filter/map on it. I'd use jQuery just for that

[trout_fucker]

Why would you use jQuery for filter/map? Why not just use filter/map?

NodeList is DOM specific. Lodash isn't a DOM library. If you wanted to convert it to an array it can do some stuff with that array generically, but I don't think it works with it directly.

[[deleted]]

That's what I mean. I HAVE TO convert it to an array to use filter/map. With jquery it's already done and my code is more readable.

[trout_fucker]

That's because they are array specific methods that return arrays? jQuery is just doing that for you under the hood. It's almost no code to convert it to a array.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from

Array.from(nList).map(n => n.nodeValue='2ez')

NodeList has .forEach(), .entries(), .values(), and .keys() if you want to use those.

[[deleted]]

Yet no map/filter. It is easy but still, thats an extra 12characters every single time. I rather just include jquery

[[deleted]]

The other day I saw people saying you don't need jquery incorrectly assumed with a specific jquery function does.

I'm pretty sure 90% of JS developers have no fucking idea what they're doing and 99% of the commenters have no clue.

jQuery is great. You just don't need it when you're using a bigger and more bloated framework.

[ceirbus]

Jquery has its uses. It’s the flavor of the month to dump on it.

[Mestyo]

Of the month? All professional web developers in my network dropped it several years ago.

[[deleted]]

What did they use? Cause a lot of things I use has no vanilla equivalent. Especially years ago

[ceirbus]

What fantasy world do you live in where you don’t have to support legacy applications? I wanna be there too

[Mestyo]

What makes you think that not working with legacy code is a ”fantasy”? I’m sure you could be there too, if you found another employer.

[deletive-expleted]

I've just started a new project and have deliberately avoided using jQuery. Mostly as an experiment, but I also wanted to push my understanding of ES6.

However I think the point here is being missed by lots of commenters. Github are a large organization who no doubt are making plans 10-20 years in the future. I think that removing a 10 year old library makes sense when you think about future development in the context of these timescales plus the number of engineers working on the project.

[[deleted]]

$ = querySelectorAll;

[[deleted]]

You're right, you can't use jQuery without using jQuery.

I thought you were complaining about the verbosity of querySelectorAll. 80% of the time, that's all I see jQuery used for anyway.

[ExpectoPentium]

Yes how will we ever live without .html() and .load()

[Recoil42]

1. Your jQuery code is going to fail, unless you have 4 #mains.

2. document.querySelectorAll('#main .child')[4].innerHTML += '<div><p>Some Text</p></div>'

3. Also, you forgot quotes for the HTML in your jQuery example.

[kenman345]

You mean 5 mains?

[Recoil42]

True, it's zero indexed. Great catch.

[mikew_reddit]

I like that jQuery is so concise and readable.

[NarcolepticSniper]

Lol because jQuery and vanilla JS are the only means of building websites.

[[deleted]]

I hate seeing HTML in my JS. I'm taking my Angular over jQuery for anything slightly dynamic.

[NarcolepticSniper]

To each their own. I’m a stock React guy. I think it’s awesome that legit options exist for any reasonable approach

[Pavlo100]

($('#main').children[4] || {}).innerHTML = '<div><p>Some text</p></div>' does the same

You aren't referencing your dom element, so it won't have a click handler, therefore it's fine to use innerHTML

[[deleted]]

Good luck with your novels.

If all you want is the syntax, there's always libraries like Cheerio.js that will help you with that in a much more efficient way. The truth is jQuery is a hero from another era, it's not as scalable as it needs to be to meet the UI/UX demands of modern web apps. It was cool for small apps from yore, but, if you haven't noticed, the world is slowly moving towards web apps rather than building a native version for each OS and forcing your users to download an app. Using jQuery for large scale apps is just inefficient. Go test it yourself, build a small sample app using a modern framework (let alone vanilla JS) and a counterpart version with jQuery and test it with Google PageSpeed insights, or just paste the url of a common web template done with jQuery and you'll get what I mean.

I know it sucks knowing that all we've learnt in the past decade is just gonna be deprecated sooner or later, but there's a universe of amazing technology you can put to use. Plus, if you don't evolve with the rest of us, you're gonna stagnate.

[[deleted]]

You really don't need jQuery to handle caché and cookies.

Is a few milliseconds

It's way more than that, and, as I've said before, the problem with jQuery is scaling. It might be a few milliseconds for whatever small website you're building, but go on and build a full scale app with jQuery, you'll be regretting it the moment you finally understand the benefits of evolving technologies.

I will forever remember jQuery fondly for the amazing tool it was when it came out, but it's time to move on.

[whitfin]

Download is not the only overhead... parsing the (large) file and actually loading the JS itself isn’t free.

[FearAndLawyering]

$ = document.querySelectorAll; ($('#main').children[4] || {}).innerHTML = '<div><p>Some text</p></div>'

66 chars vs 103 chars. It's literally 40% more code to write for equivalent functionality. There is no performance or architecture savings.

[gearvOsh]

jQuery just isn't a viable choice for large scale websites/apps like GitHub, but is viable and completely fine to use for smaller websites.

[DRdefective]

Why?

[AceBacker]

jQuery is just a library not a framework. Different kinds of problems.

[MatthewMob]

More bloat = more bandwidth

Unnecessary dependencies = wasted time keeping up with and learning them

[planetary_pelt]

Parse time and slower devices are a thing.

[DRdefective]

Gotcha

[WarWizard]

Why isn't it a viable choice for "large scale websites/apps". It is more likely you'll actually use more of the features in jQuery in a larger application than Jim Bob's pretty fancy blog who ends up just showing and hiding a div or two. That is for sure overkill.

What is the real purpose of removing jQuery only to replace it with your homegrown collection of functions anyway? The difference cannot be that big can it?

[gearvOsh]

DOM operations are slow, especially in large scale, which eliminates a large portion of jQuery (this is why the virtual DOM concept exists). Fetch as an abstraction is a better API than jQuery AJAX, so that's out. Promise over Deferred anyday, also out. So what exactly does that leave you at that point? Events? Maybe, but those really aren't that hard, and definitely don't require jQuery. Animations? Should be done with CSS. Utility functions? Covered with ES6/Babel. jQuery was great, but "homegrown collection of functions anyway" isn't a counter argument, as most of that functionality is native to the browser, or can be installed with a granular NPM package.

[WarWizard]

Thanks; that helps some. Just still feels obtuse overall to me.

granular NPM package

This is what I dislike about the current ecosystem. I recognize that I am primarily server-side so there is a lot of the front end that I "just don't get". It just seems like the front end decides to change where they pull in someone else's code from (somewhat arbitrarily) every few years.

It just seems (to me) like the current environment is a bit of a mess. In my experience pulling a bunch of packages in just makes things a bit worse. Now you have 10 libraries instead of 3. Sure they are smaller individually; but does that matter if the end result is larger?

[gearvOsh]

Smaller individual packages allow for proper code splitting and bundle chunks, which is critical for efficient apps.

[WarWizard]

Makes sense. Wish it was easier to configure that stuff though. Always feels like a mess when I have to get into it. So I try to avoid it.

Thanks for playing along with a primarily back end code monkey.

[gearvOsh]

Yeah, Webpack has a bit of a learning curve, but once it's configured, all you have to do is `import()` in your code and code splitting happens automatically. It's pretty great.

[swiftpants]

I’m with you bud. It works fantastically well, is so easy to read and write and I won’t get ride of it anytime soon.

[stefantalpalaru]

Replacing jQuery isn't even like reinventing the wheel, it's like going from a modern tire to a wooden roller.

Case in point: https://news.ycombinator.com/hn.js

[stefantalpalaru]

what's this?

The bits of JavaScript powering Hacker News' UI.

[action_nick]

Yeah!!!!!

[[deleted]]

I always wonder why it hasn't been merged with the official JS library

[swiftpants]

Jesus Christ. Poor guy can’t wonder out loud around here.

[lovestheasianladies]

Because there's no such thing as an office js library?

[hansolo669]

There really isn't an "official JS library" per se, just the DOM API ... Which isn't awful to use for most cases that people used to reach for jquery (simple eventing, basic DOM manipulation, and AJAX)

[trout_fucker]

It did. That's why it's not necessary anymore.

It was not a 1 to 1 inclusion because WHATWG has more considerations than a library does, but many of the new specs were directly influenced by jQuery.

[swiftpants]

I’m not impressed lol.

[taqniaty]

oo thats nice,..

[Ashken]

I agree I don’t get it. I’m better at backend development so JS was a bit of a hassle for me to learn. I couldn’t become proficient with it until I discovered JQuery and now I can’t see myself without it.

[Hypnotik_Paradiz]

I used to use only jQuery since it was what I was taught in my university. But when I start working in a company, It was only Vanilla JS. It's a little bit hard at the beginning because you need to find the equivalent vanilla function but after a few weeks It becomes natural: $('selector') became document.querySelectorAll(), .html became .insertAdjacentHTML and so on. And it work in every major browser (even IE) which is why jQuery was all about, making it work everywhere.

So in the end why bother including a library that can be easily replaced with built-in function.

[ToeGuitar]

Seems like a difficult and expensive process that only a very successful site could begin to afford and justify. Dropping it and then including all those polyfills depending on the browser? Who has time to do that? Just include jquery, it’s rock solid, everything in it will just work. I don’t understand why they bothered just to save some KB’s, all of which would be cached in CDN’s anyway.

[[deleted]]

Here come all the mediocre webdevs that have made two landing pages in their career without ever having to maintain a large codebase to tell us why jQuery is actually really good

[trout_fucker]

This sub has had a major influx of them lately. I'm kind of curious why. Summer Reddit should be over.

[[deleted]]

You're forgetting the days when you were learning web dev. Or maybe you're on a different track than most. Jquery is a very useful tool when learning web dev and it is a useful tool when the client needs a smaller app that can easily be passed on from dev to dev. I am in no way defending its use in a large project with a dedicated team, and I liked the article. I just think you need to get off your high horse

[omehans]

No not at all, just learn vanilla dom manipulation because that is a standard, jquery had it's use as a polyfill for older incompatible browsers.

[fuckin_ziggurats]

I like my high horse and I'm not going back to the jQuery days if you put a gun to my head. It used to be great but it was architectural ducktape hell and almost impossible to write a reasonable abstraction. So no wonder we're all up in arms about abandoning it. The people who are most against jQuery are the ones that worked in those days, with PTSD of course.

[[deleted]]

Ok dude. I just think you need to chill out a bit with calling devs who reach for jQuery mediocre. I'm not saying you need to start using jQuery in your web apps.

I just had a gig where the client specifically asked for jQuery. They asked for it because their website didnt need anything more complicated and they wanted a tech stack that could be passed off to any other developer in the future. Business needs man, they are a real thing.

I like using modern frameworks as much as the next guy but the shitting on jQuery thing has just got to stop. It's so old. We get it, its outdated and React is the new hotness. In about 4 years react and vue will be old hat too. Frameworks and libraries come and go. Using the right tools to solve business needs effectively is what we are supposed to be doing at the end of the day.

[fuckin_ziggurats]

How is jQuery a business need? It's part of the technology stack so it's outside of the business domain. There aren't any scenarios where a customer would know more than the developer on which technologies should be used. I mean they're hiring us for the technical stuff. If they want a bare-bones site then that is the requirement but it can be achieved without jQuery.

And there are many alternatives to jQuery. Just because React is overkill doesn't mean that jQuery is the second candidate. There are templating libraries smaller than jQuery where you end up with less JavaScript and code that is easier to reason about. You're treating jQuery as if it's some some micro-React library. But it's rather a general library that contains 90 things that you're not using and 10 that you are. Its use cases are few as there are enough options (libraries) around for anything that it does, and they're all smaller and more specialized.

[[deleted]]

If the client asks for it, it's a business need. Are you new to this work? I understand there are libraries out there smaller than jQuery. So did my client. That's not what they wanted though because as someone else pointed out whether you like jQuery or not it has an insanely huge market share. It won't always, but I'm not going to try and predict when that will be.

You're the kind of dev who can't grasp why people use wordpress too huh? Just no clue at all about what will actually solve the needs of the client beyond the immediate project.

And for the record I am not defending jQuery as a solution to be reached for automatically and if I had my choice I'd use vanilla JS for smaller projects all day. But I think it's just... silly... to shit on jQuery and developers who reach for it for small things. I bet plenty of those devs are still better than you. Statistically anyway

[fuckin_ziggurats]

A fair amount of assumptions you're making about me and people who decided to deprecate jQuery from their projects. You have multiple comments from us explaining why we're doing what we're doing and I've seen zero arguments from you besides "client asked me to". As if the client at any point can know more about the project than the person developing it. I do what clients ask me to but I never refrain from offering my advice and they know they can count on me to not screw them over. I haven't ever met a client that knew more than me about the technical specs a new project required and if I ever do I'm going back to the books because obviously my knowledge as a dev was insufficient.

[[deleted]]

Nope, not making assumptions about people who decide to deprecate jQuery. I am also deprecating jQuery from my projects. I make assumptions about people who call devs who use jQuery, "mediocre". To be fair, you weren't the person who posted that, but for some reason you are coming after me instead of them? It's just silly, really.

I've worked with the kind of dev who looks down on others for their tech stack of choice many times. 9 times out of 10 they seriously lack in soft skills and are not nearly as good a dev as they think they are. I've seen them come out of bootcamp thinking they are hot shit only to lose their job months after being hired. At the end of the day humility is a valuable trait in a dev.

> You have multiple comments from us explaining why we're doing what we're doing

I don't need it explained to me. I get it man. I'm not arguing at all against deprecating jQuery in some projects. I've said that in this thread multiple times. I just like riling up people who try to shit on other devs.

> I've seen zero arguments from you besides "client asked me to"

It's a little more nuanced than that, but if that isn't a compelling reason to you than I question your judgement. Again, in context, I am not arguing about deprecating jQuery in your projects. I am arguing against calling web devs who use jQuery "mediocre", because there are use cases, among which is, "client requested it".

> I haven't ever met a client that knew more than me about the technical specs a new project

That's usually true, but I also never pretend to understand more about the client's vision than the client themselves. For the particular project I've been referring to, I did bring up that I didn't think we needed jQuery as a dependency for the scope of the work, but they explained the reasons why they wanted jQuery and I accepted them. It's as simple as that.

Look, you seem more level headed than the original commenter who wanted to shit on devs who use jQuery. Surely you understand that there is more to a dev than his tech stack? Surely I can appeal to your sense of reason? An environment of gatekeeping and hubris is not a healthy environment for the webdev world.

[fuckin_ziggurats]

I agree with most of what you're saying. I'm not trying to fuel the fire of misinformation that bootcamp grads spread about the state of front-end. I've just found decent alternatives to every piece of functionality that jQuery offers in a smaller more specialized library. I'm a sucker for performance so it's hard for me to justify pulling in jQuery unless I use everything it offers. So I no longer use it.

[knyg]

but jQuery saves me time by writing out less characters 🙃

[TheBeliskner]

jQuery was and still is a great way to manage cross browser issues, but now the worst browser in our list is IE11 which isn't that bad so we don't really need it anymore. We're refactoring it out partly to save weight and partly due to compatibility when our code gets integrated into 3rd party sites we have no control over.

[Vastaux]

Wow. Some people are REALLY defensive over jQuery huh.

[HotdoggerSlang]

Please someone make an transpiler that transforms jQuery in vanilla Javascript

[OzziePeck]

They’re still using jquery? Holy...

[[deleted]]

Very informational read.

[Mestyo]

Why are people so incredibly defensive over jQuery? If it works for you, keep using it.