Hello ladies and gentlemen! Already almost ten years have passed since the first release of the jQuery library, and we decided to shake off the dust of the centuries from the classics. We are thinking about the release of the third edition of the hussar ballad about this library:
To explain how it attracts us in the era of Node and ES6 (we have an assortment of this
stuff in bulk ), we suggest reading the article by Cody Lindley, published shortly after the above-mentioned third edition
Since the
talk about the uselessness of jQuery
has not
abated for a long time , I literally cannot get rid of the idea that we have forgotten the basic value of jQuery. Time to remind her.
In this article I would like to tell everyone once again what jQuery is, because today it is no less relevant than at the time of its appearance. The question of its importance must be correlated with the original purpose of the entire solution (that is, the jQuery API itself), and not with browser bugs or missing features. If we proceed from something else, then we risk taking a position from which any abstraction is rejected, which may not be
absolutely necessary , but, nevertheless, powerful and useful.
')
Before I begin to ardently defend the honor of jQuery, let's go back to its roots, so that everyone can understand “what” is jQuery, and “why” it is needed.
What is jQuery?
jQuery is a
JavaScript library (ie, it is written in JavaScript) designed to abstract, align, correct, and simplify scripting when working with HTML elements in a browser or for working in a
browser without a graphical interface .
So:
All this turns into a simpler and less clumsy API than the native DOM API - here is the jQuery library.
Now let me explain what I mean by "HTML element scripting". With jQuery, tasks like “visually hide the second
h2
element in an .html document are completely trivially solved. The jQuery code for this task would look like this:
jQuery('h2:eq(1)').hide();
Let's take a look at this line with jQuery code. First, the
jQuery()
function is called, and we pass to it a
special CSS selector for the jQuery library, which selects the second
h2
element in the HTML document. Then the jQuery
.hide()
method is called, hiding the
h2
element. Here is how simple and semantically expressive is the jQuery code.
Now let's compare it with the native DOM code that we would need to write if we hadn't worked with jQuery.
document.querySelectorAll('h2')[1].style.setProperty('display','none');
Which option would be more convenient to write? And read, and debug? Also note that the above native DOM code assumes that all browsers support the DOM methods used here. However, it turns out that some older browsers do not support
querySelectorAll()
or
setProperty()
. Therefore, the above jQuery code would work fine in IE8, and the native DOM code would cause a JavaScript error. But, nevertheless, even if both lines of code worked everywhere, which of them would be easier to read and write?
When dealing with jQuery, you can not worry about which browser supports it, or which DOM API in which browser can mess up. Working with jQuery, you can work faster to solve problems on simpler code, and do not worry, as jQuery abstracts many problems for you.
jQuery = javascript?
Since jQuery is ubiquitous, you may not quite know where JavaScript ends and jQuery begins. For many web designers and novice HTML / CSS developers, the jQuery library is the first contact with the programming language JavaScript. Therefore, jQuery is sometimes confused with JavaScript.
First of all, let's make a reservation that JavaScript is not jQuery and not even the DOM API itself. jQuery is a third-party
free library written in JavaScript and supported by a whole community of developers. In addition, jQuery is not among the standards of those organizations (eg, W3C) that write HTML, CSS or DOM specifications.
Remember that jQuery serves primarily as “sugar” and is used on top of the DOM API. This sugar helps to work with the DOM interface, which is notorious for its complexity and abundance of bugs.
jQuery is just a useful library that you can use when writing scripts for HTML elements. In practice, most developers resort to it during DOM scripting, since its API allows you to solve more problems with less code.
The jQuery library and its plugins are used by developers so extensively that such code is often praised as the most popular scripts in the entire Web.
Two jQuery cornerstones
The two basic concepts on which jQuery is based are: “find and do” and “write less, do more.”
These two concepts can be expanded and reformulated as the following statement: the primary task of jQuery is to organize the choice (that is, to find it) or to
create HTML elements for solving practical problems. Without jQuery, this would require more code and more dexterity in handling DOM. It is enough to recall the above example with the concealment of the
h2
element.
It should be noted that the range of jQuery capabilities is not limited to this. It not only abstracts native DOM interactions, but also
abstracts asynchronous HTTP requests (so-called
AJAX ) using the
XMLHttpRequest object. In addition, there are a
number of additional JavaScript solutions and small tools . But the main benefit of jQuery is precisely to simplify HTML scripting and just that it is a pleasure to work with it.
I’ll also add that jQuery’s use is not about successfully eliminating browser bugs. The cornerstones are not at all related to these aspects of jQuery. In the long run, the biggest strength of jQuery is that its API abstracts the DOM. And this value is not going anywhere.
How jQuery combines with modern web development
The jQuery library is already ten years old. It was created for the era of web development, which we have certainly passed. jQuery is not an indispensable technology for working with DOM or making asynchronous HTTP requests.
Almost everything that can be done with jQuery can be done without it . And if you are only interested in a couple of small simple interactions with DOM in one or two modern browsers, then perhaps
it would be better to use native DOM methods rather than jQuery .
However, jQuery should be used for any development related to the BOM (
browser-based document model ) or the DOM, and not just cosmetic interactions. Otherwise, you will reinvent the wheel (ie, elements of jQuery abstractions), and then test it on all sorts of tracks (ie, in mobile browsers and PC browsers).
Experienced developers know what it is to “stand on the shoulders of giants,” and when to avoid unnecessary complexity. In most cases, we still can not do without jQuery, when you need to complete a non-trivial work related to HTML and DOM in a short time.
In addition, even if jQuery did not solve a single problem with the DOM or with disparate browser implementations of the DOM specification, the importance of the API itself would not have diminished, because it is so convenient for HTML scripting.
And jQuery is being improved, and with its help programmers can work more intelligently and faster. This is the situation today, and so it was at the time of the creation of the library. Saying “I don't need jQuery” is the same as saying “I can do without lo-dash or underscore.js”. Of course, you can do without them. But their value is not judged by this.
Their value is in the API. Due to unnecessary complexity, development can be slow. That's why we like things like lo-dash and jQuery - everything is simplified with them. And since jQuery makes it easier to perform complex tasks (for example, writing scripts for HTML), it will not become obsolete.
If you still doubt whether jQuery is needed in modern web development, I suggest you look at the following
presentation from one of the library's developers, where it justifies its usefulness, regardless of the
modern browsers .
Appendix - Important Facts About jQuery
Finally, I will list some important jQuery facts.
- The jQuery library was written by John Resig (John Resig), its release took place on August 26, 2006. John admitted that he wrote this code in order to “revolutionize the interaction of JavaScript with HTML”.
- jQuery is considered the most popular and demanded modern JavaScript library.
- jQuery is free software provided under the MIT license .
- There are two versions of jQuery. Version 1.x supports Internet Explorer 6, 7 and 8 \, and 2.x only supports IE9 +. If you require IE8 support, you'll have to work with version 1.x. But this is normal, both versions are still being actively developed .
- The minimum version of jQuery 2.x is 82kb in size. In the Gzip archive - about 28k .
- The minimum version of jQuery 1.x has a size of 96kb. The Gzip archive is about 32k.
- JQuery source code is available on Github.
- Based on the source code with Github, you can create your own version of jQuery.
- jQuery can be installed using the bower or npm package manager (i.e.
$ bower install jquery or npm install jquery
). - JQuery has an official CDN network in which you can get different versions of jQuery.
- jQuery has a simple plugin-based architecture, so anyone can add their own methods to it.
- jQuery has an extensive set of plugins. You can purchase high-quality plug-ins for enterprise development (for example, Kendo UI) or use at least cool free ones (for example, Bootstrap).
- jQuery can be categorized (according to the breakdown of API documentation).
- ajax
- attributes
- callbacks object
- core
- CSS
- data
- deferred object
- dimensions
- effects
- events
- forms
- internals
- manipulation
- miscellaneous
- offset
- properties
- selectors
- traversing
- utilities