Yes or No will not be the correct answer for this question, but jQuery should be considered as other library and only be added when needed. It should not be added by default in all the projects.
It costs you 30 kb of compressed script that in turns give you simple code for easy handling user events, effects & animation, webpage manipulation, fetching data from sever and more.
Why jQuery is used by developer?
One of the primary reason of using jQuery is; less code for DOM manipulation and it can handles many cross-browser compatibility issues. But if the target is contemporary browsers and your project need small DOM manipulation, it doesn’t make sense to add 30 kb of file for that. It will be like; you need one litre of milk and you are planning to buy a cow.
Why learning and knowing core javaScript is imperative?
It’s mandatory for a lion, “To learn how to hunt” not only for safety but also to avoid starvation. What if a baby lion is put into a cage and given meat for survival but not taught how to hunt. After few years, if this lion is left in the jungle. Initially, It will be very difficult for him to survive. He may or may not survive
So, it’s better to come out of cage sometime and sharpen the battle claws. There are many javaScirpt based Libraries and Frameworks. I am not opposing to use any framework or libraries but it should not be used only because it is being discussed a lot in the community and used by many developers.
Difference between library and framework
Library: package of code which is called by your application to perform some specific tasks to speed up and make it easy for developer. For example jQuery, Underscore, Handlebars etc.
Framework: It encapsulates common application functionality and allows developer to focus on the parts that are unique to their application. It imposes structure on your code to address a particular problem. For example Angular, Backbone etc.
Has native javaScript standardized and simplified?
Browsers have standardized on most APIs with better support and much quicker than in the past. Native DOM API’s offered by JavaScript are faster than jQuery. No, doubt jQuery is a cosy comforting blanket for the developer but, sometimes it’s good to come out naked into the javaScript world to enjoy the freedom and learn how browsers really work.
Here are a few simple and easy to use native javaScript codes for the DOM manipulation.
| jQuery | Native |
|---|---|
$(‘selector’); |
document.querySelectorAll(‘selector’); |
$(‘.class’); |
How to match class element using native javaScript?
|
$(‘#id’); |
How to get ID element using native javaScript?
|
$('a[target=_blank]'); |
How to match query by element using native javaScript?
|
$el.find('li'); |
How to find element using native javaScript?
|
$el.prev(); |
How to match previous element using native javaScript?
|
$el.next(); |
How to match next element using native javaScript?
|
$el.closest(selector); |
How to match closest element using native javaScript?
|
$el.attr('foo'); |
How to get attribute using native javaScript?
|
$el.attr('foo', 'bar'); |
How to set attribute using native javaScript?
|
$el.css({ color: '#f01' }); |
How to set a style using native javaScript?
|
$el.addClass(className); |
How to add class using native javaScript?
|
$el.removeClass(className); |
How to remove class using native javaScript?
|
$el.hasClass(className); |
How to get hasClass elements using native javaScript?
|
$el.toggleClass(className); |
How to toggle class using native javaScript?
|
$el.remove(); |
How to remove element from DOM using native javaScript?
|
$el.text(); |
How to get the text content of an element using native javaScript?
|
$el.text(string); |
How to set the text content of an element using native javaScript?
|
$el.html(); |
How to get HTML of an element using native javaScript?
|
$el.html(htmlString); |
How to set HTML of an element using native javaScript?
|
And here are a few important online resource that contains complete list of native javaScript code.
1 thought on “Is jQuery still a relevant library in front end development?”