Link to home
Start Free TrialLog in
Avatar of Computer Guy
Computer Guy

asked on

jQuery vs JavaScript

Hi,

For example, with using this as an accordion menu http://www.menucool.com/vertical/accordion-menu

Why is the advantage or disadvantage to using jQuery or JavaScript?

Why is one better than the other?

In what environment should I use jQuery over JavaScript and vice versa?
Avatar of oheil
oheil
Flag of Germany image

It seems you get something wrong.

jQuery is JavaScript. Its a library, which encapsulate common tasks and new fancy things, but everything in jQuery is JavaScript.

Oli
Avatar of Julian Hansen
Jquery is javascript - it is a javascript library.

I am assuming you mean what is the benefit of using JQuery over just plain ol' javascript raw.

JQuery just makes it a lot easier to write javascript functionality. It takes all the hassle out of selecting elements and manipulating them.

That's the main reason. But also because it is so popular though there is a lot of functionality out there in the form of JQuery libraries that you can download and use (like accordian controls) saving you the effort of having to write the code yourself. These controls can all be written in just plain JS - but the way JQuery works makes it much easier.
jQuery makes life a lot easier. It also removes the hassle associated with cross-browser coding, and is generally easier to read other peoples code.

As for when to use either - unless you already know javascript, use jQuery all the time. The library comes in at 32kb which for the most part is a no brainer. It will often save you hours of coding.

Some really good tutorials here:
http://net.tutsplus.com/articles/news/learn-jquery-in-30-days/

A tip for when you do use it - load the script from a CDN, such as Google. Add this to the head of your html document and you'll be good to go:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

Open in new window

Avatar of Computer Guy
Computer Guy

ASKER

So in the long run, there is no performance difference?
On the long run you will have performance gain, because if you do it on your own, complexity will increase and your own code will perform by good chance less than jQuery :-)

Oli
jQuery has been developed by extremely talented programmers who have optimized the Javascript to the max. Unless you think you can do it better, then jQuery will probably out perform your own efforts, even with the overhead of downloading the library.
And any performance loss (if you manage to outperform the library - which may be possible in certain circumstances) is so small that when weighed up against the benefits of using JQuery in terms of the time it saves you to add rich functionality to your site - is a non issue.

Initially it takes a while to get your head around the JQuery paradigm but once you think in JQuery you find yourself wondering why anyone would want to do it the old fashioned way.
What is the difference between jquery-min and jquery1.8.2?

Why should I load it from Google vs hosting it on my own site?
They're just filenames so without seeing the content it's impossible to tell the difference. Usually jQuery has a number with it so you can see the version - jquery.1.8.2 tells you it's version 1.8.2. The min part tells you the files is 'minified' which is a way of compressing javascript to make it quicker for downloading.

The first time I visit your site, I'll have to download the jQuery library if you host it locally.

If you use the google CDN one, there a fair chance that I've visited site already that has also used the Google CDN so now I can load it from cache - again, increasing performance :)
If you do not know the difference between javascript and jquery, then you should not be using jquery until you learn how to code.  Otherwise you will spend most of your time on sites like this trying to find someone to fix your pages, because you can't understand the actual underlying code; you fail to understand incompatibilities/conflicts between versions of libraries and plugins; or you have limited yourself to using code written by others.

Using jquery without competence in javascript is like trying to drive an F1 car before you take driver's education;  you are probably going to crash, which is why we spend so much time on this site fixing pages bloated with jquery.

Cd&
COBOL - I disagree with that completely! Why waste time learning Javascript when most people can achieve what they want after a quick intro into jQuery!

I don't really know javascript, and I've got no intention of learning - never needed to. I've managed to achieve all client-side scripting I've ever needed with jQuery, and can't see that changing in the near future.
which is why we spend so much time on this site fixing pages bloated with jquery.
I've spent far more time fixing code bloated with Javascript, when one line of jQuery would have done the job far more elegantly :)
If you do an analysis of questions posted in the webdev topics, It is certain to reveal that a high percentage of questions involving jquery, are easily fixed if you actually understand code, but the are mostly posted by wannabe web developers who can't do much beyond a search to find plugins and other forms of pre-written code.

In one way that is good, because it provides a lot of easy points; but most of the solutions don't have much long term value in the PAQ and are not very interesting to work on.  

Cd&
What do you mean by minified version of jQuery?

Also, I take it that if I'm using jQuery1.8.2, I need the jQuery MIN version for 1.8.2?


Thanks,
ASKER CERTIFIED SOLUTION
Avatar of COBOLdinosaur
COBOLdinosaur
Flag of Canada image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
The min version is somewhat equivalent to a zipped file in windows. It's a compressed version of the files and is therefore smaller, meaning it's quicker to download. It's better to use the min version for your 'production' site. If fact, it makes a lot of sense to minify all of your JS files and probably your CSS files too, but that's another issue :) The only real reason you'd want to use the un-compressed version is if you want to have a look under the hood - it's a lot easier to read through uncompressed code.

@COBOL - I kind of get what you are saying, but like I pointed out, have a look through the Javascript zones, and you'll see a scramble of native JS that could easily be written in one or two lines of jQuery. If someone is stuck on a problem with jQuery and needs to ask a question, they shouldn't be told to figure it out by learning javascript!

I just don't agree that to use jQuery you need to know Javascript - just think of jQuery as another language and learn it that way - PHP is written in C but I doubt you'll advise a PHP n00b to learn C before writing PHP!

The majority of sites on the 'net that use any form of Javascript use jQuery - more than native Javscript!
You cannot compare jQuery to PHP.  Jquery is not a language; it is the collective name for a library of javascript objects and extensions; like a package in JAVA.

As for fixing bad script with a couple of lines jquery. Great, but when I see a 35k library being used to produce a three lines of jquery  that could be accomplished with 6 lines of classic js I see a waste of band width.

The majority of sites on the 'net that use any form of Javascript use jQuery - more than native Javscript!

The majority of sites on the 'net don't validate; don't get enough traffic to pay for the hosting; and have serious accessibility/usability issues. For the same reason... it is easier to do stuff without learning how it works.  Popularity does not mean superiority. After all there was a time when IE had 85% of the browser market in spite of the fact that it was defective. It dominated because it was easier to use what came with the computer instead of learning how to install an alternative.  

Having a skill is good, but having many skills at various levels of detail is better.

Cd&
I'm not comparing the two - I'm simply pointing out that you don't need to know C in order to write PHP - you don't need to know Javascript to write jQuery and you don't need to understand the internal combustion engine to drive an F1 car ;)

If it's about bandwidth, then that's a different issue and has nothing to do with the argument you first made.

As professional web developers we're often under tight deadlines and adding some client-side jazz into a site using jQuery is often a lot quicker and easier than learning javascript.

IE had 85% coverage because people had no choice - jQuery has gained ground because it's good at what it does despite the huge choice!

I'm not saying don't learn Javascript - I'm simply saying that to tell someone not to use jQuery until they learn how to code Javascript makes no sense whatsoever.

This isn't a right or wrong kind of discussion - I just don't think we need to know 'how' things work in order to use them effectively.
adding some client-side jazz into a site using jQuery is often a lot quicker and easier than learning javascript.

I agree.  Which is why learning a wide range of skills in advance is of benefit, so that when it comes to crunch time you are not forced to adopt a less than optimum solution from a limited toolbox.

Over the last 50+ years I have learned just about every language, methodology, and tool that has come along.  I primarily use modern stuff, but I can still go back and fix legacy apps written in assembler, autocoder, and APL.  I can also customize a jquery library because I know how to write the underlying code.

I don't stop at crunch time to learn something, I learn ahead of time.

Cd&
@Cd& and Chris

I have to agree with both of you - Cd& has it right that there are two many "Lego engineers" out there (just add a component and use 1% of its code) - code bloat is a pet hate of mine (printer drivers that take up more space than my computer's entire hard drive - OS apps and all - not too long ago). Efficient coding is almost heresy today.

Chris also has it right that you can get by with JQuery and do some pretty awsome things that a "n00b" wouldn't dream of being able to do in JS.

My 2c worth - JQuery is not enough on its own some of the time - the library was not designed to replace JS but to enhance it so if you want to do a timeout function or calculate the square root of a number etc or loop through returned AJAX results you have to use the underlying Javascript to do that and if you don't know that the JQuery aint gonna be enough on its own.

Both valid points (two sides of the same coin).
Thanks Julian.. I do enjoy these debates :)
@Cobol

There are lots of programmer at lots of levels.  To some it would be silly to learn a language when they can drop in a menu system from examples they find.  If they need help they come here or hire a professional.  I can't image you studied for weeks all the ins and outs of any language you have used before writing your first line.  Most programmers start simple and learn from trial and error.  A person that only learns jQ will be limited to the functions included and will write bloated code in a lot of cases because they do not know how to write functions with parameters.  I still submit that it's fine for small time sites.  If they have to worry about the load times and bandwidth cost of a 35k JS file then they are not the right person for the task.  Not that they can't be trained just that they are not ready for that scope of a project.
If they need help they come here or hire a professional.

I don't have an issue with those on the learning curve, the novice or the hobbyist.  I do have a problem with those who accept paid work that is over their head, and then make web developers look like Nigerian scammers when they screw it up and cannot deliver what they agreed to do.

Cd&
Agreed.  Web devlopers get a bad reputation as unskilled labor by all the novices thinking they know how to make a page.  If you are building a page for a friend or self or anyone else close to you and they are happy with the finished product then great but as a web application developer it's frustrating to be told "I can go to the high school and get someone for $10/hr to do the same thing"
I just came across this and really like everyone's point of view on this.  As others will read this as I did, I wanted to clarify a mistake above regarding PHP written in C and it's analogy to jQuery and javascript.  

The PHP interpreter is compiled from C and the PHP commands executed by this interpreter.
 jQuery is just javascript written a different way.  To use the PHP analogy, it's a PHP class that someone else has written.  The code is still PHP (nothing to do with C).