We cannot perceive the concept of "slower" and "faster" by just one execution. That is because you cannot measure milliseconds yourself. You would use CPU for that. Set a timer, execute an instruction (at least!) 10,000 times and then calculate the time taken by one execution.
jQuery is slower because it is written in JavaScript and has a notably extra topping to make sure the code looks smaller and concise. The code that you wrote,
$('#abc');
Always calls the JavaScript function,
document.getElementById('abc');
But, it will not directly transition down to that document call! It will first of all determine whether to look for an element with its ID ('
#
') or its class name ('
.
'). Many other patterns are used that bring down this line to that one. Now, personally, I don't find jQuery any better than JavaScript if all you have to do is,
select an element in HTML DOM.
For me, using jQuery would only make sense if you are performing animations, executing simultaneous Ajax requests and so on. Another "good" use of jQuery would be to use it in UI,
jQuery UI[
^] for instance.
Please see
Vanilla JS[
^] website for more ideas about the difference. They have a good table denoting a common different between many frameworks and JavaScript itself.
Also, as mentioned already, you cannot find the difference by just executing one command. Try executing a command 10,000 times and then see the difference. Then you can take out the time taken by one execution.
Your question is more like, "
Why is C slower than Assembly language?" :-)