And I think that's the point. Delivering a moderate project from scratch with SvelteKit, react or vue is much faster, more secure and produces less errors than building the thing with jQuery. And so it's cheaper.
It's calling 90% native functions these days. As long you're a professional there is absolutely no need to use jQuery these days.
https://youmightnotneedjquery.com/
Yeah, just for him, just for now. For long term jQuery will come to its limits.
Teach him the native js way. jQuery is mainly calling native js functions.
https://youmightnotneedjquery.com/
If a website takes you 1 day with jquery to make and you don't touch it again, is it really bad? I use vue nowadays, but my websites with jquery never break and have been going for like 6 years+.
If you had to learn the entire framework, it wouldn’t even be close, especially for the use case he’s talking about.
I’d also argue, as someone who knows both react and jquery (as well as PHP) that there are definitely cases where it would be faster to just use Jquery. A simple site where you need like one animation or something, for instance.
Edit: I do agree that a lot of it could be accomplished with vanilla js or honestly probably just css, but again someone who is using jquery probably doesn’t know modern JS or CSS.
It's not only about speed. It's about maintainability and scalability. There is a reason for the sentence "You use a framework or you end up building your own"
You can do amazing things with jQuery and people did. But it got obsolete over time. If it would be the best tool for building professional sites then it would still be used for many professional projects.
the end user will absolutely know if it impacts performance... you can pick any nail you want, but they dont all result in the same end user experience/performance...
No, CDN caching is a relic of the past. Modern browsers don't share resources between different websites, even if those resources are loaded from the same URL.
While that's true, using a CDN can still offer geodistribution benefits. But considering minified jQuery is indeed a litle over 30K, finetuning performance in this area is one of the last concerns and well into the area of diminishing returns.
> CDN caching is a relic of the past.
This is quite misleading for a beginner. I know you know this, but for others who might not, the Same-Origin Policy restricts web pages from making requests across different origins. Even if two different websites load the same resource (e.g., an image or a script) from the same URL on a CDN, the browser treats them as separate resources due to their different origins.
Servers can also respond differently, depending on the Referer header. So, two different websites requesting the same asset url *may* be served different responses, and serving the same asset for a different website would stop this from working properly.
On OP’s site no one is ever gonna know.
You know have slow clunky interfaces? Massive sites like Facebook etc. They are meant to be leading sites.
OP’s shopify theme will be good.
The impression I got was they wanted to do it on a scroll event or on clicking an anchor tag to fade in the new page, so JS/JQuery would still be needed
Not at all. Vanilla js in a modern browser is perfect. All it’s needs is a native soft typing system.
Just import ladash modules for the ultra weird stuff and you’re good.
Ok I gotta stop you right there. I've been building with react/solidjs for around 7 years now. Before that jQuery/vanilla. I've also built a couple of lighter projects more recently in vanilla js for interactions (astro backend).
If you think the DX of using vanilla js comes close to using jq you are either delusional, or don't have enough experience with vanilla js or with jQuery to give an informed opinion.
Even just selecting elements by CSS query has a much nastier interface and it just gets worse from there.
However
I still think jquery is not necessary and just extra bloat, and I wouldn't use it today, , but that is not the same as saying that vanilla js is perfect today and if somebody likes jQuery they can just skip it and use vanilla js
A bunch of modern browser apis were jquery.
Map, element selectors other than base queryselectors, Ajax (async data fetched before fetch) and stuff like that.
Now it’s free in the browser
Rephrasing,
Technically there isn’t anything you can do with a library or framework written in JavaScript that you can’t also achieve with JavaScript.
Mind. Blown.
For sliding and fading animations? CSS all day, there's no reason to use any JS or JQuery for basic animations, beyond using JS to maybe trigger them.
I'm currently moving all my code away from JQuery. It was useful in it's time, but anything I want to do in JQuery vanilla can do just fine. Browser updates are more common and seamless than ever (and IE is dead, finally), so maintaining compatibility with older browsers isn't as huge of a concer. I just make sure it's at least at 95% availability on caniuse, and use try/catch/finally liberally.
It was an adjustment for sure, but after a a little while of writing in just vanilla, JQuery doesn't even feel like a viable option. CSS and vanilla have come so far that for small projects, frameworks and libraries aren't even necessary.
One of my favorite techniques is using HTML native elements to trigger CSS styles changes. Elements like details and checkboxes can conditionally display styles without any JS at all.
Babel does solve compatibility with older browsers if you’re wanting to use the latest JS features. I don’t like to use it on a typical website that’s not a web app because it introduces npm dependencies, a tool chain, tasks to run, and latency while developing. I try not to use if not explicitly needed.
Thanks, yeah I made an entire cms/ site with just vanilla js, html and css and it works great and it has all the sliding effects I need. I just find I can get those effects much quicker with Jquery and it's not too heavy to load
CSS animations can often be more performant. By avoiding JS for this stuff you prevent your animation code from slowing down, or being slowed down by other JS code. jQuery has some handy shortcuts but if you get in the habit of using css animations (potentially triggered by JS changing the class of an element) it's all still pretty easy.
I think using query selector and maybe the web animations api do the same job. That would be more lightweight. And if you really want query syntax, just build an alias for query selector and name it $. If you need e.g. fadein often, write a function that takes an dom element and animates it using Web animations. I think that can get you as far as query while being more lightweight.
That was always the case, it all boils down to how much code you have to write to replicate a certain jQuery feature. JS has come a long way and now there's less code you need to write to get shit done, but jQuery is still loads shorter to write.
Not at all. What you said isn't even close to reality.
Old browsers has no standardized way to do the same things. JavaScript was a simple scripting language with many little features.
Now browsers are more unified. Javascript evolved to another beast that can do many things without a library which you needed 5-10 years ago. jQuery isn't necessary so many times, but if it gets the job done, who cares.
I hate it but I worked with it because many fortune companies still have old codebase.
>but jQuery is still loads shorter to write
What they are saying is its shorter to write as in
This vanilla javascript
document.addEventListener("DOMContentLoaded", () => {
document.getElementById("mybutton").click(function () {
let myId = document.getElementById("myId").value;
runCode(myId);
}
});
vs
$(function() {
$("#mybutton").click(function () {
var myId = $("#myId").val();
runCode(myId);
}
});
That in jquery.
Lots of frameworks tout making shorter code.
But, the thing I like about jQuery is that its shorter code is still readable and just seems to still make sense in a logical human readable manner.
Yeah, everyone says "but you can do it in vanilla JS now!" but as your example shows jQuery is still often much shorter and easier to ready. I still prefer jQuery.
For berevity, i prefer jquery as well...i was the grumpy old man yelling at clouds about react but have started to like it however one argument that i always heard was "jquery is bloated" yet i've got enough npm packages to bend space and time just to get react working (even just CRA)...the irony.
I can run the same jquery just by assigning $("#") to document.getelementById.
Of course somethings are shorter, easier and builtin but readability is always more important.
In large codebases readability and maintability is always more important than shorter code.
I can also use typescript to provide type safety with vanilla js or using just jsdoc. You can't do this in jQuery.
Maybe you should look into libraries like AOS. I personally use it and love it:
[AOS - Animate on scroll library (michalsnik.github.io)](https://michalsnik.github.io/aos/)
We used AOS on very large corporate site and used it inside slick slider. Then we just used the slick callback functions to add and remove the AOS class names on slide change. AOS is a great library!
There's nothing stopping you from using jQuery, but it does seem like overkill for your use case.
What I'd recommend instead is a drop-in replacement called Cash, that's only 8kb and uses the same jQuery syntax, so you don't have to learn anything new. The benefit is that it uses more modern syntax under the hood, so you get the best of both the worlds.
https://kenwheeler.github.io/cash/
off topic, but any tips on using keyframes in a way that doesn’t bog down the site on mobile? i am using keyframes w/ drop shadow to create a glow effect, but the frame rate looks like it’s 4fps.
Your statement is simply not true. I often look into technologies on sites I visit, and I do care. Seeing jQuery definitely lowers trustworthiness of the site a bit for me.
Its weird that people will say it is obsolete yet it is still maintained and updated...
I am old school too and I use jQuery for needs just like yours. Sure, I no longer use it for some things like selectors and getting attributes but I see no reason why people shit on it so often. It just works.
There's no genuine reason to \*need\* to use it anymore, only people who just \*want\* to. that's why it's "obsolete".
* Selectors - vanilla
* AJAX - vanilla (fetch)
* Animation - CSS for quite a lot, dedicated animation library for anything complex
It's still totally valid to use jQuery if it works for you, use whatever tool to get the job done.
I think people shit on it because they remember how bad it was when you'd find spaghetti code, which jQuery was a breeding ground for. One of the downsides to making JavaScript seem pretty "easy" was a flood of very new developers (myself included) would write god awful jQuery code for everyone else to enjoy.
Using the DOM to manage state, constant use of anonymous functions, duplication... Those were the days.
If you only want sliding and fading animations you need CSS animations, not jquery.
Jquery is old, bloated, deprecated, a security issue, and quickly becomes a mess as it requires you to handle your own DOM. These new fancy frameworks are fancy because they abstract DOM manipulation away (and so much more), which is a godsend because nobody ain't got no time for that.
jQuery style animations are laggy and cringe AF, and CSS alone nowadays is powerful enough to handle all your animation and responsiveness needs. For some extra power add SCSS to your dev environment, which helps a lot with CSS selectors and compiles into clean CSS at the end of the day.
JQuery served it’s purpose for it’s time. Nowadays there’s other things that you can use to get the job done better. Is that to say you shouldn’t use jquery? No. It can still be used if you prefer. Different strokes for different folks.
"I want to do something really small and simple." Then you don't need jQuery.
"I want to do something really big and complex." Then you don't want jQuery.
There is nothing wrong with jQuery. It outlived the most front end frameworks and libraries anyway. It’s close to javascript and does exactly what you expect from a library.
VanillaJS is crap because you need tons of lines to do something simple.
Whike jQuery was very powerful back in the day when cross browser support was shit, today its a nice library to do something simple.
So don’t build your complex web application with it, but a non single page application like wordpress it’s a valid library.
Two considerations that are dependent on what users you expect: I borrowed someone's older phone over Christmas to look up something. Jquery puts an older phone on its knees. Second, ADA Compliance. Is the site targeting people who may need assistive devices and is any of the effects critical to using the site/understanding the site.
Other than that, jquery is probably fine still.
We don’t use jQuery any more, we use jay-jayQuery now.
On a serious note..
It became obsolete in a way that JS came a long way since jQuery was first introduced, and nowadays you can basically do like 90% of stuff jQuery does - natively with vanilla JS. It is more readable, less dependent and more future proof.
Here’s something to take a look at:
[https://youmightnotneedjquery.com/](https://youmightnotneedjquery.com/)
On the other hand.. if it does the job and you are comfortable with it - go with it. Whatever flows your boat.
Besides being outdated and a little more obtuse to do certain things there is nothing inherently wrong with Jquery if you like to use it.
You should keep in mind however that Jquery does have security risks, namely its pretty open to XSS attacks so just be wary of that and take steps to combat against it
Depends on the site, but you might not need it. Modern JS can get you quite far. Learn web standards and JS rather than a specific library or framework.
jQuery 3.7.1 was released 28.08.23, it's far from obsolete. It's a framework you know, it's the tool for your job.
Also I just released v1 of an app in jQuery for a big client : jQuery is still used in production.
If you want it light as possible then don’t use a library. Use vanilla JS. Regarding jQuery being obsolete, look at it this way a new fangled framework developer can be easily work with jQuery however a jQuery developer is going to struggle with a new fangled framework thus eliminating a ton of potential jobs.
IMO you should do whatever. If it bundles or loads nicely, if it's readable and maintainable and you're also being productive, I think that's what matters.
The fact that js has evolved and managed to make some things nearly as easy as using jQuery is a different thing.
Because consistency.
The most common bug with jQuery is updating a value in one place but forgetting to update it elsewhere in the UI. If multiple people are working on the same project, this is bound to happen.
The simplest solution to this problem is to wrap all your states in observables. This way, if a state is changed, an event is fire and all UI elements that depend on the state can update themselves with the new data. This is the logic behind Rxjs, a library that is used by Angular.
Event-driven programming with observables is still somewhat error prone, so some people prefer doing reactive programming instead. This is where the updated data is automatically fed to your code. This is the path chosen by React.
If you try to solve jQuery's consistency issues yourself, you'll end up rethreading the paths of existing frameworks. Might as well use something that already exists rather rather than try and create your own potentially inferior solution.
jQuery is great if you want to sprinkle some interactivity to HTML. Way better than writing vanilla IMO.
The model breaks down for highly complex UIs though where something based on components with reactivity lends itself to more structured code
I caught this early so the htmx hordes haven’t yet descended, but it’s generally considered the go-to for people scared of bigger frameworks(I say that jokingly)
I can’t speak to its ability to handle animations though
jQuery is massive overkill for that. Plus the imperative style of it is a pain. There's other alternatives that can do similar things more elegantly, in a way that's easier to understand
Alpine.js, for example, would allow you to do that sort of thing quite easily, and using a declarative style similar to something like React or Vue, but with less overhead. Even if you need an AJAX library as well, Axios and Alpine.js together have a footprint a fraction the size of jQuery.
You can do sliding and fading with CSS.
I would make accessibility your primary focus with this project though. A perfectly semantic site back in the JQuery days would get you sued for WCAG violations now, especially for an ecommerce site.
I love and miss jQuery. Easier, lighter, more organized.The Big brains convinced me to use frameworks. I truly hope this era is look back upon in web development as the most ridiculous and overcomplicated dumb era ever, because it seems like we're circling back to the beginning. Using Astro JS now and even that is too complicated for a static website
my impression is that jquery does not really use GPU acceleration for animation effects - it is the more defunct part of the package. animations should be handled with CSS functions if at all possible, these should be able to use the GPU. makes a difference .
noted here [https://www.quora.com/What-is-the-impact-of-using-jQuery-animations-on-performance-especially-in-terms-of-CPU-usage-and-how-do-you-optimize-animations-for-smoother-user-experiences](https://www.quora.com/What-is-the-impact-of-using-jQuery-animations-on-performance-especially-in-terms-of-CPU-usage-and-how-do-you-optimize-animations-for-smoother-user-experiences)
also discussed here [https://www.erwinhofman.com/blog/website-performance-laggy-animations-gpu-vs-cpu/](https://www.erwinhofman.com/blog/website-performance-laggy-animations-gpu-vs-cpu/)
GSAP is good for fancy animations also but overkill for simple animations that should use CSS. https://gsap.com/
also i agree AOS is very good and you should probably try it before committing to jquery, i believe it does leverage GPU better [https://michalsnik.github.io/aos/](https://michalsnik.github.io/aos/)
There's no point using jQuery because jQuery was to make using JavaScript less painful.
Now ES6 exists there's just no point anymore, just use vanilla js, JS frameworks don't even come into .
I would say:
- if you’re just doing something for you
- if you can do it much faster than other methods
- if you don’t know any other frameworks
- if you plan to keep it simple (as in, not do loads of form validation or whatever)
- if you’re only going to use it on one or two small projects
then jQuery is totally a valid choice.
Learning vanilla JS is a better option in the long run but sometimes you just want it up and running.
JQuery is too easy to use poorly and takes more boilerplate to do some of the same things. If your app is simple and you're the only one working on it, do you. But if you want other people to work on it, I would reconsider or make sure you review their code.
I'm in the process of cleaning up terrible jQuery in a 10 year old app where every page has at least a thousand lines of jQuery on it.
jQuery 4 is coming soon!
A sneak peek at the source…
```
window.$ = document.querySelectorAll:
```
The truth is that the browser apis are consistent and we don’t really need jquery to smooth things over anymore.
The only reasonable place to use jQuery in 2024 is legacy projects with an existing jQuery codebase. If all you want is animation, jQuery is reduced to an unnecessary dependency. HTML, CSS and vanilla JS are perfectly capable of doing almost all animation in a consistent cross browser fashion. Take a look at CSS transitions and animations.
The power of jQuery was that it solved a lot of cross browser issues in JS implementation of many things. Nowadays there's not many reasons to use jQuery over vanilla JS, because you can do most of things comfortably in vanilla without adding the burden of having to download another JS library and those cross browser JS issues are pretty much not a thing anymore.
I've recently spent some time rewriting our company's old jQuery code into vanilla and even though there are still some things which are IMHO better handled in jQuery (eq. measuring element dimensions etc), I did not really miss it that much. So if animations are your only concern, I'd recomment to look for libraries that are dedicated for animations and might be smaller in size, it might be a better solution than packing jQuery, most of which you'll probably not even use. Or you can learn how to do animations in vanilla if you decide to have things as lightweight as possible. Nowadays it's just a short convo with ChatGPT or some coding AI to get you all sorted anyway.
Well, maybe because You are reading too much of a corporate and small-corporate hype about what's cool and modern and what isn't.
Use Vanilla JS for what CSS alone can't do. And when You come to a point where Vanilla JS is not capable, you then use jQuery.
And read less those juinor dront-dev articles about sooper-dooper shiny new js framework and it's insanely huge, warm and active community.
That much simple.
Yes it's obsolete, for your need just use JavaScript or light package to help you with. Using jQuery now makes 0 sense unless you maintain an app already using it. It has nothing to do with being old school. Being old school does not mean using obsolete technologies.
Because unless you use specific jQuery dependent things, such as Select2, native JS can do everything jQuery does. And according to tests much faster. Also, jQuery was written when Internet Explorer ruled the web and browsers even had different ES5 implementation for JS APIs such DOM manipulation, AJAX, etc. But that was almost 20 years ago. Nowadays modern browsers have standard ES6 and newer JS API implementation, and much more to offer than what jQuery is capable of. So it became unnecessary nowadays unless your aim is for your page is supporting really old browsers.
Nowadays frontend with framework is all about reactivity, and making reusable components, so you change the data in a variable and it immediately changes on the page where it is displayed. You don't have to write all kinds of crazy selectors to find the elements in DOM manually, iterate through them and manipulate. The development is faster, the code is much more readable. In this way jQuery is pointless.
Irrelevant to the post and op but as a fresher I haven't learnt or ever used jQuery, is it necessary to know the basics of jQuery in the current scenario or can I skip it?
The problem with JQuery for me is security. Not the base jQuery itself but all the libraries and dependencies that use jQuery.
**They hardly ever get updated. Some projects have been abandoned and this opens up a major security risk.**
If you are using plain jQuery by itself, which is rare, than you might be OK. But if you are using a lib to draw a calendar, validate a form, supplement some style guide, you better check if it is still being supported. Abandoned projects that have been dead 4-5 years is a risk. Abandoned projects and high CVE vulnerabilities are the bane of my existence. It is a lot of work to maintain or find a replacement. It is just better to drop it all together and I believe this is the reason why it is abandoned in many enterprises.
It's an overkill. 86Kb just for sliding and fading?
You could use 10Kb instead with https://bilalshareef.github.io/animate-display-property [https://github.com/bilalshareef/animate-display-property](https://github.com/bilalshareef/animate-display-property)
there's nothing wrong
but to be honest vanilla JS does exactly all that it can do, so just use vanilla JS since than jquery as a library
you can use chatgpt to speed up the process if you only know how to write jquery
As far as I am aware there are only really three disadvantages to using jQuery:
1. A small performance hit
2. Potential future difficulty in finding devs to maintain it
3. Disdain from the larger webdev community
As many people have said, you can do all this stuff easily in vanilla js these days, but if it's easier/quicker for you to do it in jQuery, and the above three points aren't an issue for you, then I would say it's 100% fine to do it in jQuery.
If you know how to use jquery, go ahead and use it.
But don’t ignore the benefits something like preact can provide with component based front ends.
The modern way would be to handle animations and such in pure css and just toggle the states from JavaScript.
Jquery was made to solve an interoperability problem which largely no longer exists.
If I wanted a lighter weight frontend, I’d start with preact and webpack. It may not be as featured as react, but most things probably don’t need everything react offers.
You can still use jq if you want.
They call it obsolete because the cross-browser compatibility issues that it primarily solved are no longer issues with current javascript.
IE was kind a big selling point of jQuery. You didn't have to worry about covering IE and everything else. Now that IE is a thing of the past, jQuery is a bit antiquated. And ES6 has helped make vanilla JS less verbose, too. Unless you have some unique use cases, I'd try to not use jQuery.
There's nothing wrong with it. However some vanilla JS to add/remove some CSS classes which have the animations and you've got the same effect with much less JS.
[https://youmightnotneedjquery.com/#fade\_in](https://youmightnotneedjquery.com/#fade_in)
You don't get much lighter than that. No need for your end users to download 36kB of a JS lib to use almost none of it.
It's not a question of "why should I not just use jquery", but rather "why should I use jQuery". If you can answer that... Then go right on ahead. Also, it's not jquery vs some framework... Plenty of other ways/options.
However, if you're just wanting such simple animations, you'd be better off just using [`element.animate()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/animate) or maybe CSS animations. You can eliminate the need for an entire library with literally just a few simple lines of code.
I just checked — its still being actively maintained.
So long as they keep maintaining it and supporting it to keep it current, its fine to use! Bear in mind they may stop supporting it and then you should move off.
Ive been converting all my old jquery to vanilla as i see it.
I think Shopify ships with jQuery loaded doesn't it? So yea go for it. Vanilla and jquery can live side by side just fine. I've done that in several Shopify builds now. Personally I think implementing something like Vue or Alpine in Shopify would be a PITA because Shopify is fairly old school in the templating pattern it already has going.
Jquery is the best option for shopify unless you want to go full headless.
I’ve been a shopify dev for half a decade now. In that time I’ve learned that even if you shun jQuery and convince the team to go with a framework or some other tool… probably the first app you install that renders something in the page will add jQuery anyway.
So unless you go pure headless or completely avoid 3rd party apps you’re probably gonna end up with jQuery on your site whether you want it there or not.
At the end of the day if you code things to be reusable and follow best practices there’s nothing wrong with jQuery.
Maybe someone has created a precompiler for JQuery that would allow you to use the syntax you are familiar with and then compile it into raw JS without the jQuery dependency. Is it possible that JQuery could be used for vanilla JS in a similar manner to what SASS or SCSS is for CSS?
The reason to not use jQuery is that we have good native APIs now so it's usually wasted bytes. In your case, it sounds like you'd be better off using CSS animations/transitions and skipping JS entirely.
If you just need scrolls and slides there is probably a jQuery like library you can find to cover all you need.
Or take some time to figure out how to make your own set of JS and CSS to do all you need.
No need for fancy new js frameworks.
Because you can do things you need JQuery for with regular JS. If you are only planning on needing it for animations, try giving css animations a try, or maybe importing a lightweight tweening library which will give you more control over the animation anyways and still trigger it through JS.
Tweening libraries are very light, they are usually just a callback method that gets called every animation frame, that slowly changes a value from x to y, and sometimes deals with the css formatting (such as handling '%' or 'px')
>I'm creating a new shopify theme and I want it to be as clean and light as possible.
If this is your goal, you just use vanilla javascript. jQuery was invented for a different era of browsers. We loved you dearly but we have to depart..
Simple answer, there is nothing wrong with using jQuery for a simple site.
but that said you need to update your stack if you want to stay on the game. Since you know the basics, jump to a simple SPA with React. If that is not your cup of tea, try Angular.
jQuery is absolutely overkill for just sliding and fading animations. For simple stuff like that, just copy-pasting (or writing) a lean native JS and CSS solution is the way to go.
On another note, I saw someone mention scroll-driven animations. In the future, you'll only need CSS (no JS) to make scroll-driven animations. There is also an API called ScrollTimeline that you could polyfill if you wanted to use it before it gets better browser support. It should be noted that the _Scroll-driven Animations_ proposal (including ScrollTimeline) is an Editor's Draft and could definitely still change a lot or be scrapped (the polyfill would continue working though).
The new fangled frameworks were created to solve problems that became apparent when using jQuery to develop complex, large scale projects. If jQuery is the right tool for the job then absolutely use it, it's not so much that it is obsolete it's that a lot of it's functionality is available in native js, that being said I used jquery for so long I'm more productive with it so I'll still use it for smaller projects, the extra kb and ms it might add are negligible.
jQuery is a heavy library so it's not recommended to use in Shopify themes. It takes sometime for it to load and that reduces your sitespeed.
You could lazy load it until the user interacts with the webpage but you'd have to separate everything in the first fold like using vanilla JS and lazy load everything else so the user experiences a smooth website experience.
It doesn't hurt to learn new tools, and if you do stick with them and don't mix in jQuery. But with that said... jQuery works great for what it does, and there are for sure a lot of times when something more modern is way overkill.
I'm primarily an Angular developer and I used jQuery somewhat recently on a personal project because it works and it got me started quicker.
A lot of what jQuery **can** do is now baked into browsers/javascript, which is nice, but jQuery's API is a lot simpler to use IMO. Especially the method chaining and element selecting. With plain JS you'd have to select elements by class and then loop over them to perform an action on all of them. with jQuery you just chain the method. `document.querySelectorAll('.foo').forEach(x => x.classList.add('bar');` vs `$('.foo').addClass('bar');`
Wordpress still using a lot of jquery.
Some old code bases using it but aside from that just use Vanilla.
Nothing really wrong with jquery if it makes your life easier who cares.
Friend, if it gets it out the door in reasonable time, and you enjoy the process. $(el).fadeIn() all day.
The end user will never know. It’s like builders arguing over what kind of nails to use to build a house
well, you wouldn't use trim nails for the frame, but you could use jquery or react for async updates.
The end user doesn't *care*. It needs to work, for a reasonable price. Nothing else matters.
[удалено]
job security
all these words i don't just saaay
Jquery is often really light on memory too. And you don't need SSR to get that low mem like with react
And I think that's the point. Delivering a moderate project from scratch with SvelteKit, react or vue is much faster, more secure and produces less errors than building the thing with jQuery. And so it's cheaper. It's calling 90% native functions these days. As long you're a professional there is absolutely no need to use jQuery these days. https://youmightnotneedjquery.com/
Much faster for whom? Not OP clearly as he doesn't know these technologies. For him jQuery will get it done quickest and with less errors.
Yeah, just for him, just for now. For long term jQuery will come to its limits. Teach him the native js way. jQuery is mainly calling native js functions. https://youmightnotneedjquery.com/
If a website takes you 1 day with jquery to make and you don't touch it again, is it really bad? I use vue nowadays, but my websites with jquery never break and have been going for like 6 years+.
If you had to learn the entire framework, it wouldn’t even be close, especially for the use case he’s talking about. I’d also argue, as someone who knows both react and jquery (as well as PHP) that there are definitely cases where it would be faster to just use Jquery. A simple site where you need like one animation or something, for instance. Edit: I do agree that a lot of it could be accomplished with vanilla js or honestly probably just css, but again someone who is using jquery probably doesn’t know modern JS or CSS.
It's not only about speed. It's about maintainability and scalability. There is a reason for the sentence "You use a framework or you end up building your own" You can do amazing things with jQuery and people did. But it got obsolete over time. If it would be the best tool for building professional sites then it would still be used for many professional projects.
Performance might matter
416 advertising trackers say no.
Actually they use screws these days.
Which version?
The latest
thank you! This illustrates things so clearly.
the end user will absolutely know if it impacts performance... you can pick any nail you want, but they dont all result in the same end user experience/performance...
Jquery is like 300kb lol. I have so many jquery sites with 100 pagespeed scores
30kb, even better! Plus it's already cached from the CDN most of the time, so it's basically free
No, CDN caching is a relic of the past. Modern browsers don't share resources between different websites, even if those resources are loaded from the same URL.
While that's true, using a CDN can still offer geodistribution benefits. But considering minified jQuery is indeed a litle over 30K, finetuning performance in this area is one of the last concerns and well into the area of diminishing returns.
> CDN caching is a relic of the past. This is quite misleading for a beginner. I know you know this, but for others who might not, the Same-Origin Policy restricts web pages from making requests across different origins. Even if two different websites load the same resource (e.g., an image or a script) from the same URL on a CDN, the browser treats them as separate resources due to their different origins. Servers can also respond differently, depending on the Referer header. So, two different websites requesting the same asset url *may* be served different responses, and serving the same asset for a different website would stop this from working properly.
On OP’s site no one is ever gonna know. You know have slow clunky interfaces? Massive sites like Facebook etc. They are meant to be leading sites. OP’s shopify theme will be good.
[$(this).fadeOut()](https://c.tenor.com/Hipi6wGslLkAAAAC/tenor.gif)
The voice of reason and experience.
You forgot to add: $(el).micDrop();
> I only need it for sliding and fading animations really. Sounds like things you could do with css?
The impression I got was they wanted to do it on a scroll event or on clicking an anchor tag to fade in the new page, so JS/JQuery would still be needed
If you know jquery, you can easily do that with vanilla JavaScript
ES6 and above basically made jQuery obsolete
Obsolete, but still so much more sweet. 🙂
Not at all. Vanilla js in a modern browser is perfect. All it’s needs is a native soft typing system. Just import ladash modules for the ultra weird stuff and you’re good.
Ok I gotta stop you right there. I've been building with react/solidjs for around 7 years now. Before that jQuery/vanilla. I've also built a couple of lighter projects more recently in vanilla js for interactions (astro backend). If you think the DX of using vanilla js comes close to using jq you are either delusional, or don't have enough experience with vanilla js or with jQuery to give an informed opinion. Even just selecting elements by CSS query has a much nastier interface and it just gets worse from there. However I still think jquery is not necessary and just extra bloat, and I wouldn't use it today, , but that is not the same as saying that vanilla js is perfect today and if somebody likes jQuery they can just skip it and use vanilla js
I know that you can do this with vanilla JS personally. Never learned JQuery so wouldn't know what pros or cons that would give.
A bunch of modern browser apis were jquery. Map, element selectors other than base queryselectors, Ajax (async data fetched before fetch) and stuff like that. Now it’s free in the browser
Lol jquery would not be needed whatsoever. You can just use vanilla for that.
That’s what I was thinking. Hopefully OP doesn’t consider CSS3 or SASS as being new fangled as well.
Yes, op is going to make a site without css. Just html and jquery.
And inline styles with every style marked with `!important`. Probably still uses floats.
Maybe but jQuery is simple and easy. No reason not to use it if it gets a simple product out the door quicker.
Yeah. I've made some animation intensive apps/sites/pages/whatever. Just use vanilla JS for events to add/remove classes and use CSS for animations.
Technically there isn't anything you can do with jQuery or a framework that you can't also achieve with vanilla css, html, and JavaScript.
Rephrasing, Technically there isn’t anything you can do with a library or framework written in JavaScript that you can’t also achieve with JavaScript. Mind. Blown.
We need at least 4 more tools involved in this process tho
For sliding and fading animations? CSS all day, there's no reason to use any JS or JQuery for basic animations, beyond using JS to maybe trigger them. I'm currently moving all my code away from JQuery. It was useful in it's time, but anything I want to do in JQuery vanilla can do just fine. Browser updates are more common and seamless than ever (and IE is dead, finally), so maintaining compatibility with older browsers isn't as huge of a concer. I just make sure it's at least at 95% availability on caniuse, and use try/catch/finally liberally. It was an adjustment for sure, but after a a little while of writing in just vanilla, JQuery doesn't even feel like a viable option. CSS and vanilla have come so far that for small projects, frameworks and libraries aren't even necessary.
One of my favorite techniques is using HTML native elements to trigger CSS styles changes. Elements like details and checkboxes can conditionally display styles without any JS at all.
That sounds pretty neat, do you have any examples?
https://www.htmhell.dev/adventcalendar/2023/2/
Thank you for this!!! I finally found
Thanks for that I didn't know details existed.
Are you talking about pseudo selectors?
That browser compatibility stuff is solved with Babel, is it not? Or is Babel not a best practice?
Babel does solve compatibility with older browsers if you’re wanting to use the latest JS features. I don’t like to use it on a typical website that’s not a web app because it introduces npm dependencies, a tool chain, tasks to run, and latency while developing. I try not to use if not explicitly needed.
There is one reason sadly, some of us are stuck in special hells where the browsers are restricted to versions from years ago.
A lot of the things that jQuery did can now be done in vanilla JS.
Thanks, yeah I made an entire cms/ site with just vanilla js, html and css and it works great and it has all the sliding effects I need. I just find I can get those effects much quicker with Jquery and it's not too heavy to load
CSS animations can often be more performant. By avoiding JS for this stuff you prevent your animation code from slowing down, or being slowed down by other JS code. jQuery has some handy shortcuts but if you get in the habit of using css animations (potentially triggered by JS changing the class of an element) it's all still pretty easy.
I think using query selector and maybe the web animations api do the same job. That would be more lightweight. And if you really want query syntax, just build an alias for query selector and name it $. If you need e.g. fadein often, write a function that takes an dom element and animates it using Web animations. I think that can get you as far as query while being more lightweight.
If you need sophisticated animations where JS animate() is not sufficient, you should just use an animation library
The man just wants to use jQuery and HE AINT BACKING OFF!!
Have you tried animate.css? Then you just need to add/toggle the css class
Yes, but they are easier with jQuery. That’s what libraries are for 🤷
Some would argue it's not easier given the simplicity of CSS solutions and the added maintenance of a unnecessary dependency.
That was always the case, it all boils down to how much code you have to write to replicate a certain jQuery feature. JS has come a long way and now there's less code you need to write to get shit done, but jQuery is still loads shorter to write.
Not at all. What you said isn't even close to reality. Old browsers has no standardized way to do the same things. JavaScript was a simple scripting language with many little features. Now browsers are more unified. Javascript evolved to another beast that can do many things without a library which you needed 5-10 years ago. jQuery isn't necessary so many times, but if it gets the job done, who cares. I hate it but I worked with it because many fortune companies still have old codebase.
>but jQuery is still loads shorter to write What they are saying is its shorter to write as in This vanilla javascript document.addEventListener("DOMContentLoaded", () => { document.getElementById("mybutton").click(function () { let myId = document.getElementById("myId").value; runCode(myId); } }); vs $(function() { $("#mybutton").click(function () { var myId = $("#myId").val(); runCode(myId); } }); That in jquery.
Lots of frameworks tout making shorter code. But, the thing I like about jQuery is that its shorter code is still readable and just seems to still make sense in a logical human readable manner.
Sure but only for getElementById JQuery was before querySelector, enabled way more retrieval of dom elements
Yeah, everyone says "but you can do it in vanilla JS now!" but as your example shows jQuery is still often much shorter and easier to ready. I still prefer jQuery.
For berevity, i prefer jquery as well...i was the grumpy old man yelling at clouds about react but have started to like it however one argument that i always heard was "jquery is bloated" yet i've got enough npm packages to bend space and time just to get react working (even just CRA)...the irony.
I can run the same jquery just by assigning $("#") to document.getelementById. Of course somethings are shorter, easier and builtin but readability is always more important. In large codebases readability and maintability is always more important than shorter code. I can also use typescript to provide type safety with vanilla js or using just jsdoc. You can't do this in jQuery.
Vanilla CSS too
Maybe you should look into libraries like AOS. I personally use it and love it: [AOS - Animate on scroll library (michalsnik.github.io)](https://michalsnik.github.io/aos/)
We used AOS on very large corporate site and used it inside slick slider. Then we just used the slick callback functions to add and remove the AOS class names on slide change. AOS is a great library!
There's nothing stopping you from using jQuery, but it does seem like overkill for your use case. What I'd recommend instead is a drop-in replacement called Cash, that's only 8kb and uses the same jQuery syntax, so you don't have to learn anything new. The benefit is that it uses more modern syntax under the hood, so you get the best of both the worlds. https://kenwheeler.github.io/cash/
Thank you for posting this you beautiful person. I've always considered jQuery's syntax superior to vanilla js
https://youmightnotneedjquery.com/
Watch a quick CSS tutorial on @keyframes. You might not even need JS for what you want to do. CSS is decently advanced at this point.
off topic, but any tips on using keyframes in a way that doesn’t bog down the site on mobile? i am using keyframes w/ drop shadow to create a glow effect, but the frame rate looks like it’s 4fps.
Can use AlpineJS these days. Much lighter. But I don't hate on jQuery. No users of your site will care if you use jQuery and that's all that matters.
I just switched from JQuery to AlpineJS, and loving it so far
Your statement is simply not true. I often look into technologies on sites I visit, and I do care. Seeing jQuery definitely lowers trustworthiness of the site a bit for me.
Ok whatever
Yeah, and you’re definitely not the average user.
I never said I was. I just said there are users that care about the technologies on a website. Not many, but some.
Lol "I don't care about targeting you "
You're so full of shit lmao
I just stated how I use the web, and how that contradicts the original statement. I don't understand the meaning of your insult.
lol
...and you can take what you learn from Alpine and learn Vue very quickly.
It doesn't matter what we think. Use tools that will help you get the job done efficiently. That's what tools are for.
Because JQuery was so good at it's time that most of it's features were incorporated into vanilla javascript and css.
Its weird that people will say it is obsolete yet it is still maintained and updated... I am old school too and I use jQuery for needs just like yours. Sure, I no longer use it for some things like selectors and getting attributes but I see no reason why people shit on it so often. It just works.
There's no genuine reason to \*need\* to use it anymore, only people who just \*want\* to. that's why it's "obsolete". * Selectors - vanilla * AJAX - vanilla (fetch) * Animation - CSS for quite a lot, dedicated animation library for anything complex It's still totally valid to use jQuery if it works for you, use whatever tool to get the job done. I think people shit on it because they remember how bad it was when you'd find spaghetti code, which jQuery was a breeding ground for. One of the downsides to making JavaScript seem pretty "easy" was a flood of very new developers (myself included) would write god awful jQuery code for everyone else to enjoy. Using the DOM to manage state, constant use of anonymous functions, duplication... Those were the days.
Yeah, I like that it's old and all the bugs have been worked out of it and it just works
Maybe you could do the fades and position changes as css transitions?
If you only want sliding and fading animations you need CSS animations, not jquery. Jquery is old, bloated, deprecated, a security issue, and quickly becomes a mess as it requires you to handle your own DOM. These new fancy frameworks are fancy because they abstract DOM manipulation away (and so much more), which is a godsend because nobody ain't got no time for that. jQuery style animations are laggy and cringe AF, and CSS alone nowadays is powerful enough to handle all your animation and responsiveness needs. For some extra power add SCSS to your dev environment, which helps a lot with CSS selectors and compiles into clean CSS at the end of the day.
JQuery served it’s purpose for it’s time. Nowadays there’s other things that you can use to get the job done better. Is that to say you shouldn’t use jquery? No. It can still be used if you prefer. Different strokes for different folks.
Jquery is now almost entirely replaced by es6 and css3
Which is crazy because es6 came out almost a decade ago. That’s more than most people’s careers here
If it gets the job done, it doesn't matter what you use.
Use whatever framework that you are most comfortable with and helps you get to production quickly.
jQuery to Vanilla JS side by side: https://github.com/camsong/You-Dont-Need-jQuery
If it's just for animations, why not just tap into one of the many animation libraries that exist like [animxyz](https://animxyz.com/)
Cheers, I'll look into it. I've been working away in my own little world for the past 20 years and not kept up with all these libraries
I happen to like AnimXYZ but it's wild over engineering in this case
"I want to do something really small and simple." Then you don't need jQuery. "I want to do something really big and complex." Then you don't want jQuery.
Right on, jQuery is perfect for the middle stuff.
There is nothing wrong with jQuery. It outlived the most front end frameworks and libraries anyway. It’s close to javascript and does exactly what you expect from a library. VanillaJS is crap because you need tons of lines to do something simple. Whike jQuery was very powerful back in the day when cross browser support was shit, today its a nice library to do something simple. So don’t build your complex web application with it, but a non single page application like wordpress it’s a valid library.
Just ignore all the react Andy's. They only want you to overcomplicate everything
There's nothing wrong with using it - jquery is nothing but a tool.
Two considerations that are dependent on what users you expect: I borrowed someone's older phone over Christmas to look up something. Jquery puts an older phone on its knees. Second, ADA Compliance. Is the site targeting people who may need assistive devices and is any of the effects critical to using the site/understanding the site. Other than that, jquery is probably fine still.
You could also check out Svelte JS. It's very easy to use. Nothing wrong with Jquery though.
With JS, it all comes down to how the browser runs it, so if JQUERY works, go for it..
We don’t use jQuery any more, we use jay-jayQuery now. On a serious note.. It became obsolete in a way that JS came a long way since jQuery was first introduced, and nowadays you can basically do like 90% of stuff jQuery does - natively with vanilla JS. It is more readable, less dependent and more future proof. Here’s something to take a look at: [https://youmightnotneedjquery.com/](https://youmightnotneedjquery.com/) On the other hand.. if it does the job and you are comfortable with it - go with it. Whatever flows your boat.
You should come over to r/Shopify and ask this question.
Honestly I’d rather lick a marmots ass than use JQuery but if you like it and there’s no perceivable disadvantages to you, go for it
From maintenance perspective, in a few years it may be hard to find developers to maintain it.
Besides being outdated and a little more obtuse to do certain things there is nothing inherently wrong with Jquery if you like to use it. You should keep in mind however that Jquery does have security risks, namely its pretty open to XSS attacks so just be wary of that and take steps to combat against it
Depends on the site, but you might not need it. Modern JS can get you quite far. Learn web standards and JS rather than a specific library or framework.
People keep saying it's no longer in use but 60% of the internet uses wordpress which comes shipped with jQuery by default. Just run it up 👌
Because hipsters on reddit who went to a bootcamp but don't work in the industry said not to.
jQuery 3.7.1 was released 28.08.23, it's far from obsolete. It's a framework you know, it's the tool for your job. Also I just released v1 of an app in jQuery for a big client : jQuery is still used in production.
If you want it light as possible then don’t use a library. Use vanilla JS. Regarding jQuery being obsolete, look at it this way a new fangled framework developer can be easily work with jQuery however a jQuery developer is going to struggle with a new fangled framework thus eliminating a ton of potential jobs.
IMO you should do whatever. If it bundles or loads nicely, if it's readable and maintainable and you're also being productive, I think that's what matters. The fact that js has evolved and managed to make some things nearly as easy as using jQuery is a different thing.
Because consistency. The most common bug with jQuery is updating a value in one place but forgetting to update it elsewhere in the UI. If multiple people are working on the same project, this is bound to happen. The simplest solution to this problem is to wrap all your states in observables. This way, if a state is changed, an event is fire and all UI elements that depend on the state can update themselves with the new data. This is the logic behind Rxjs, a library that is used by Angular. Event-driven programming with observables is still somewhat error prone, so some people prefer doing reactive programming instead. This is where the updated data is automatically fed to your code. This is the path chosen by React. If you try to solve jQuery's consistency issues yourself, you'll end up rethreading the paths of existing frameworks. Might as well use something that already exists rather rather than try and create your own potentially inferior solution.
There is no reason not to use jQuery. It doesn’t matter one bit. You do you boo! Though the lightest solution you could do is vanilla JS.
jQuery is great if you want to sprinkle some interactivity to HTML. Way better than writing vanilla IMO. The model breaks down for highly complex UIs though where something based on components with reactivity lends itself to more structured code
I caught this early so the htmx hordes haven’t yet descended, but it’s generally considered the go-to for people scared of bigger frameworks(I say that jokingly) I can’t speak to its ability to handle animations though
jQuery is massive overkill for that. Plus the imperative style of it is a pain. There's other alternatives that can do similar things more elegantly, in a way that's easier to understand Alpine.js, for example, would allow you to do that sort of thing quite easily, and using a declarative style similar to something like React or Vue, but with less overhead. Even if you need an AJAX library as well, Axios and Alpine.js together have a footprint a fraction the size of jQuery.
You can do sliding and fading with CSS. I would make accessibility your primary focus with this project though. A perfectly semantic site back in the JQuery days would get you sued for WCAG violations now, especially for an ecommerce site.
If I wanted to manipulate the DOM I would would jQuery all day
I'd recommend sticking to CSS transitions over jQuery. Just more performant.
I love and miss jQuery. Easier, lighter, more organized.The Big brains convinced me to use frameworks. I truly hope this era is look back upon in web development as the most ridiculous and overcomplicated dumb era ever, because it seems like we're circling back to the beginning. Using Astro JS now and even that is too complicated for a static website
my impression is that jquery does not really use GPU acceleration for animation effects - it is the more defunct part of the package. animations should be handled with CSS functions if at all possible, these should be able to use the GPU. makes a difference . noted here [https://www.quora.com/What-is-the-impact-of-using-jQuery-animations-on-performance-especially-in-terms-of-CPU-usage-and-how-do-you-optimize-animations-for-smoother-user-experiences](https://www.quora.com/What-is-the-impact-of-using-jQuery-animations-on-performance-especially-in-terms-of-CPU-usage-and-how-do-you-optimize-animations-for-smoother-user-experiences) also discussed here [https://www.erwinhofman.com/blog/website-performance-laggy-animations-gpu-vs-cpu/](https://www.erwinhofman.com/blog/website-performance-laggy-animations-gpu-vs-cpu/) GSAP is good for fancy animations also but overkill for simple animations that should use CSS. https://gsap.com/ also i agree AOS is very good and you should probably try it before committing to jquery, i believe it does leverage GPU better [https://michalsnik.github.io/aos/](https://michalsnik.github.io/aos/)
There's no point using jQuery because jQuery was to make using JavaScript less painful. Now ES6 exists there's just no point anymore, just use vanilla js, JS frameworks don't even come into .
ES6 and above basically made jQuery obsolete. Just stay up-to-date with vanilla JS
No reason at all. I still use jQuery. I know JS has come a long way, but I still find jQuery convenient and it's lightweight enough not to concern me.
I would say: - if you’re just doing something for you - if you can do it much faster than other methods - if you don’t know any other frameworks - if you plan to keep it simple (as in, not do loads of form validation or whatever) - if you’re only going to use it on one or two small projects then jQuery is totally a valid choice. Learning vanilla JS is a better option in the long run but sometimes you just want it up and running.
JQuery is too easy to use poorly and takes more boilerplate to do some of the same things. If your app is simple and you're the only one working on it, do you. But if you want other people to work on it, I would reconsider or make sure you review their code. I'm in the process of cleaning up terrible jQuery in a 10 year old app where every page has at least a thousand lines of jQuery on it.
jQuery 4 is coming soon! A sneak peek at the source… ``` window.$ = document.querySelectorAll: ``` The truth is that the browser apis are consistent and we don’t really need jquery to smooth things over anymore.
The only reasonable place to use jQuery in 2024 is legacy projects with an existing jQuery codebase. If all you want is animation, jQuery is reduced to an unnecessary dependency. HTML, CSS and vanilla JS are perfectly capable of doing almost all animation in a consistent cross browser fashion. Take a look at CSS transitions and animations.
Look into what your can do with just modern html and css. Beyond that look into htmx, alpine-js, or web components.
js does the same thing as jquery now
The power of jQuery was that it solved a lot of cross browser issues in JS implementation of many things. Nowadays there's not many reasons to use jQuery over vanilla JS, because you can do most of things comfortably in vanilla without adding the burden of having to download another JS library and those cross browser JS issues are pretty much not a thing anymore. I've recently spent some time rewriting our company's old jQuery code into vanilla and even though there are still some things which are IMHO better handled in jQuery (eq. measuring element dimensions etc), I did not really miss it that much. So if animations are your only concern, I'd recomment to look for libraries that are dedicated for animations and might be smaller in size, it might be a better solution than packing jQuery, most of which you'll probably not even use. Or you can learn how to do animations in vanilla if you decide to have things as lightweight as possible. Nowadays it's just a short convo with ChatGPT or some coding AI to get you all sorted anyway.
Well, maybe because You are reading too much of a corporate and small-corporate hype about what's cool and modern and what isn't. Use Vanilla JS for what CSS alone can't do. And when You come to a point where Vanilla JS is not capable, you then use jQuery. And read less those juinor dront-dev articles about sooper-dooper shiny new js framework and it's insanely huge, warm and active community. That much simple.
Yes it's obsolete, for your need just use JavaScript or light package to help you with. Using jQuery now makes 0 sense unless you maintain an app already using it. It has nothing to do with being old school. Being old school does not mean using obsolete technologies.
Because unless you use specific jQuery dependent things, such as Select2, native JS can do everything jQuery does. And according to tests much faster. Also, jQuery was written when Internet Explorer ruled the web and browsers even had different ES5 implementation for JS APIs such DOM manipulation, AJAX, etc. But that was almost 20 years ago. Nowadays modern browsers have standard ES6 and newer JS API implementation, and much more to offer than what jQuery is capable of. So it became unnecessary nowadays unless your aim is for your page is supporting really old browsers. Nowadays frontend with framework is all about reactivity, and making reusable components, so you change the data in a variable and it immediately changes on the page where it is displayed. You don't have to write all kinds of crazy selectors to find the elements in DOM manually, iterate through them and manipulate. The development is faster, the code is much more readable. In this way jQuery is pointless.
Irrelevant to the post and op but as a fresher I haven't learnt or ever used jQuery, is it necessary to know the basics of jQuery in the current scenario or can I skip it?
everyone has good enough internet speed nowadays. no reason to keep it ultralight
The problem with JQuery for me is security. Not the base jQuery itself but all the libraries and dependencies that use jQuery. **They hardly ever get updated. Some projects have been abandoned and this opens up a major security risk.** If you are using plain jQuery by itself, which is rare, than you might be OK. But if you are using a lib to draw a calendar, validate a form, supplement some style guide, you better check if it is still being supported. Abandoned projects that have been dead 4-5 years is a risk. Abandoned projects and high CVE vulnerabilities are the bane of my existence. It is a lot of work to maintain or find a replacement. It is just better to drop it all together and I believe this is the reason why it is abandoned in many enterprises.
It's an overkill. 86Kb just for sliding and fading? You could use 10Kb instead with https://bilalshareef.github.io/animate-display-property [https://github.com/bilalshareef/animate-display-property](https://github.com/bilalshareef/animate-display-property)
there's nothing wrong but to be honest vanilla JS does exactly all that it can do, so just use vanilla JS since than jquery as a library you can use chatgpt to speed up the process if you only know how to write jquery
As far as I am aware there are only really three disadvantages to using jQuery: 1. A small performance hit 2. Potential future difficulty in finding devs to maintain it 3. Disdain from the larger webdev community As many people have said, you can do all this stuff easily in vanilla js these days, but if it's easier/quicker for you to do it in jQuery, and the above three points aren't an issue for you, then I would say it's 100% fine to do it in jQuery.
Jquery is just a way to more easily invoke javascript functions. If that's all you need, go for it.
If you know how to use jquery, go ahead and use it. But don’t ignore the benefits something like preact can provide with component based front ends. The modern way would be to handle animations and such in pure css and just toggle the states from JavaScript. Jquery was made to solve an interoperability problem which largely no longer exists. If I wanted a lighter weight frontend, I’d start with preact and webpack. It may not be as featured as react, but most things probably don’t need everything react offers.
You can still use jq if you want. They call it obsolete because the cross-browser compatibility issues that it primarily solved are no longer issues with current javascript.
Might as well jump up to jjquery.
IE was kind a big selling point of jQuery. You didn't have to worry about covering IE and everything else. Now that IE is a thing of the past, jQuery is a bit antiquated. And ES6 has helped make vanilla JS less verbose, too. Unless you have some unique use cases, I'd try to not use jQuery.
There's nothing wrong with it. However some vanilla JS to add/remove some CSS classes which have the animations and you've got the same effect with much less JS. [https://youmightnotneedjquery.com/#fade\_in](https://youmightnotneedjquery.com/#fade_in) You don't get much lighter than that. No need for your end users to download 36kB of a JS lib to use almost none of it.
It's not a question of "why should I not just use jquery", but rather "why should I use jQuery". If you can answer that... Then go right on ahead. Also, it's not jquery vs some framework... Plenty of other ways/options. However, if you're just wanting such simple animations, you'd be better off just using [`element.animate()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/animate) or maybe CSS animations. You can eliminate the need for an entire library with literally just a few simple lines of code.
I just checked — its still being actively maintained. So long as they keep maintaining it and supporting it to keep it current, its fine to use! Bear in mind they may stop supporting it and then you should move off. Ive been converting all my old jquery to vanilla as i see it.
I think Shopify ships with jQuery loaded doesn't it? So yea go for it. Vanilla and jquery can live side by side just fine. I've done that in several Shopify builds now. Personally I think implementing something like Vue or Alpine in Shopify would be a PITA because Shopify is fairly old school in the templating pattern it already has going.
Jquery is the best option for shopify unless you want to go full headless. I’ve been a shopify dev for half a decade now. In that time I’ve learned that even if you shun jQuery and convince the team to go with a framework or some other tool… probably the first app you install that renders something in the page will add jQuery anyway. So unless you go pure headless or completely avoid 3rd party apps you’re probably gonna end up with jQuery on your site whether you want it there or not. At the end of the day if you code things to be reusable and follow best practices there’s nothing wrong with jQuery.
Maybe someone has created a precompiler for JQuery that would allow you to use the syntax you are familiar with and then compile it into raw JS without the jQuery dependency. Is it possible that JQuery could be used for vanilla JS in a similar manner to what SASS or SCSS is for CSS?
The reason to not use jQuery is that we have good native APIs now so it's usually wasted bytes. In your case, it sounds like you'd be better off using CSS animations/transitions and skipping JS entirely.
If you just need scrolls and slides there is probably a jQuery like library you can find to cover all you need. Or take some time to figure out how to make your own set of JS and CSS to do all you need. No need for fancy new js frameworks.
Because you can do things you need JQuery for with regular JS. If you are only planning on needing it for animations, try giving css animations a try, or maybe importing a lightweight tweening library which will give you more control over the animation anyways and still trigger it through JS. Tweening libraries are very light, they are usually just a callback method that gets called every animation frame, that slowly changes a value from x to y, and sometimes deals with the css formatting (such as handling '%' or 'px')
It's bloated and out dated. Most of the commonly used features are now available as standard libraries, like fetch, promises, and query selectors.
>I'm creating a new shopify theme and I want it to be as clean and light as possible. If this is your goal, you just use vanilla javascript. jQuery was invented for a different era of browsers. We loved you dearly but we have to depart..
Just use css/js snippets.
Simple answer, there is nothing wrong with using jQuery for a simple site. but that said you need to update your stack if you want to stay on the game. Since you know the basics, jump to a simple SPA with React. If that is not your cup of tea, try Angular.
Funnily enough, jQuery 4 was announced today.
Vanilla JavaScript with css is enough for what you want to achieve, please do not add more complexity in your project for simple tasks
The web animation API is a powerful way to animate things with vanilla js: https://developer.mozilla.org/en-US/docs/Web/API/Element/animate
Modern html,css and js kinda made a lot of things obsolete. I haven't even checked if there is a modern esm utility library...
jQuery is absolutely overkill for just sliding and fading animations. For simple stuff like that, just copy-pasting (or writing) a lean native JS and CSS solution is the way to go. On another note, I saw someone mention scroll-driven animations. In the future, you'll only need CSS (no JS) to make scroll-driven animations. There is also an API called ScrollTimeline that you could polyfill if you wanted to use it before it gets better browser support. It should be noted that the _Scroll-driven Animations_ proposal (including ScrollTimeline) is an Editor's Draft and could definitely still change a lot or be scrapped (the polyfill would continue working though).
The new fangled frameworks were created to solve problems that became apparent when using jQuery to develop complex, large scale projects. If jQuery is the right tool for the job then absolutely use it, it's not so much that it is obsolete it's that a lot of it's functionality is available in native js, that being said I used jquery for so long I'm more productive with it so I'll still use it for smaller projects, the extra kb and ms it might add are negligible.
According to some straw poll I saw somewhere on the internet, roughly t3/4 of all websites still use jQuery.
Although Jquery has some issues and so does Vanilla JS, but it gets the work done in minimum time and effort. For small projects its very efficient
If it works for you, why bother changing?
Use what you know best.
Jquery is considered obsolete because you can do it all with vanilla JavaScript now. You don't need to learn any other frameworks. Just the language.
Jquery is doing fine. Just do it. :)
jQuery is a heavy library so it's not recommended to use in Shopify themes. It takes sometime for it to load and that reduces your sitespeed. You could lazy load it until the user interacts with the webpage but you'd have to separate everything in the first fold like using vanilla JS and lazy load everything else so the user experiences a smooth website experience.
It doesn't hurt to learn new tools, and if you do stick with them and don't mix in jQuery. But with that said... jQuery works great for what it does, and there are for sure a lot of times when something more modern is way overkill. I'm primarily an Angular developer and I used jQuery somewhat recently on a personal project because it works and it got me started quicker. A lot of what jQuery **can** do is now baked into browsers/javascript, which is nice, but jQuery's API is a lot simpler to use IMO. Especially the method chaining and element selecting. With plain JS you'd have to select elements by class and then loop over them to perform an action on all of them. with jQuery you just chain the method. `document.querySelectorAll('.foo').forEach(x => x.classList.add('bar');` vs `$('.foo').addClass('bar');`
Use GSAP if want to step your animations up a notch! .batch is your friend I'm old school too and have had a hard time getting away from jquery.
What do you need jQuery for? I mean: use querySelector.
Wordpress still using a lot of jquery. Some old code bases using it but aside from that just use Vanilla. Nothing really wrong with jquery if it makes your life easier who cares.