As a front-end tool that almost unifies the global portal website, jQuery was in the limelight at the beginning of Web 2.0. However, with the continuous evolution of front-end technology and the unification of the browser's underlying standards, jQuery has gradually become a "technical debt" in the eyes of some websites. ".
A few days ago, the British government website GOV.UK removed all front-end application dependencies jQuery on its website. After the removal, 13 front-end applications' JavaScript size was reduced by between 32 KB (or 31% to 49%), various other performance improvements were made, and some of the team's technical debt was cleared.
In 2019, Bootstrap 4.3.1 was released. The development team stated that after the release of v4.3, some key changes will be implemented in the process of developing Bootstrap 5, including abandoning the use of jQuery.
In 2018, GitHub removed jQuery when refactoring the page. The GitHub front-end team did not use other frameworks to replace jQuery, but native JavaScript.
On the other hand, according to the statistics of BuiltWith, the number of real-time websites known to be using jQuery is as high as 69,193,395, and 75.6% of the websites with the top one million traffic use jQuery. Judging from the usage data, jQuery's status is still in the rivers and lakes, and judging from the voice, jQuery has gradually given way to a rising star...
Web 2.0, jQuery debuts
Understanding the emergence of jQuery is inevitable without the browser wars of the last century and the emergence of JavaScript. In 1994, Netscape Netscape was established, developed the browser Netscape Navigator , and within four months occupied three-quarters of the browser market, becoming the main browser of the Internet in the 1990s.
At that time, Netscape's technical capabilities and technical strategies were ahead of the market. Netscape foresees that the network will become more dynamic, and its founder Marc Lowell Andreessen believes that HTML needs a glue language , that is, a scripting language, which can facilitate web designers or non-professional programmers to design pictures and plug-ins.
After some internal research, Netscape decided to invent a secondary scripting language to go with Java. In May 1995, Netscape engineers designed the prototype of the scripting language, and the development alliance formed by Netscape and Sun Computer, in order to make this new language popular with Java, released Netscape Navigator 2.0 Beta 3 in December the same year. Temporarily rename it to JavaScript when deploying in .
After the advent of JavaScript, it was gradually sought after by developers. But as Web 2.0 has increased the demand for interactivity, it has also put forward higher requirements for JavaScript. In addition, the browser manufacturers at that time were still busy staking the market to seize the market. Many software could not be used in different browsers, which increased the difficulty of software author development. John Resig, the father of jQuery, was tortured at that time. one of the programmers.
"When I was doing web programming, I hated browser bugs very much. Different browsers have different bugs, and there are a lot of them. So I used JavaScript to make a CSS selection engine, and then I made an animation engine, all for my own amusement. I'm having fun. But at the same time I found that I couldn't put some of the apps I made into the browser. In order to put the app into the Firefox browser, I started to make the relevant API to apply the CSS selection engine and animation engine, these It ended up being jQuery. After a few months, I made those apps into Firefox and then it worked in IE.”
John Resig first showed the outside world a CSS selector with a more concise syntax on JavaScript in 2005. At the BarCampNYC event in 2006, John Resig released a second new version: jQuery: New Wave JavaScript , "This code completely changes the way Javascript interacts with HTML".
jQuery was designed with the idea of "write Less, Do More", and many years later, John still regards this as his goal - to allow everyone to write something on a web page, and write something that can be written in the browser. run smoothly.
The emergence of jQuery solved two common worries of front-end developers at the time: making the interaction interface between JavaScript and DOM simple, and reducing cross-browser problems during development.
The first is to simplify DOM manipulation. The HTML DOM defines a standard set of objects for HTML and standard methods for accessing and manipulating HTML documents. Through the DOM, you can access all HTML elements, along with the text and attributes they contain, modify and delete their content, create new elements, and more. Before jQuery, manipulating the DOM with JavaScript required defining a function and then binding it to various HTML elements in a specific DOM, which was tedious and complicated for everyday use.
So jQuery provides a selector engine - later iterated as Sizzle, which allows developers to select pages in CSS by name (eg div), ID (eg #myId), category (eg .my-class), etc. On elements, use strings instead of functions to find elements, filter sub-elements, faster than other engines, smaller file size, easy to extend, and no dependencies.
On the other hand, in pure JavaScript development, developers need to check which way the browser uses to add events, and then make a choice, but jQuery provides some incompatibilities between JavaScript implementations that hide different browsers, and can Check what mode your browser needs and use the appropriate one.
With these two advantages, jQuery quickly gained the support of the developer community and many large companies. Around 2010, both Microsoft and Google hosted jQuery libraries in their CDN networks; Media Temple made a big donation to host the jQuery website; Microsoft also participated in the testing and development of jQuery, Visual Studio and ASP.NET MVC All built-in jQuery; Nokia participated in jQuery testing and hired jQuery core member Brandon Aaron; Mozilla directly hired John Resig...
It is the support and use of these large companies that made jQuery very successful in the first few years. According to John Resig's introduction, all jQuery development resources come from external donations. In 2011, jQuery established the jQuery Foundation, mainly to support the development of jQuery core, user interface and mobile projects, provide jQuery documentation and support and promote the development of the jQuery community.
"I'm delighted that the world clearly still has a place for clean API design, as evidenced by jQuery's continued success." On jQuery's tenth anniversary, John Resig also praised jQuery's popularity, "It's amazing jQuery is more popular than ever , used by 77.8% of the world's top 1 million websites."
This percentage has only dropped by 2.2% so far, and many companies are still using jQuery. Industry insiders analyzed: "jQuery had a very high penetration rate before 2016, with a market share of almost 90%, and it also cultivated many developers who started with jQuery. After 2016, although React and Vue are in the The country is developing rapidly, but the ecological level is still not as perfect as jQuery. When some developers cannot find solutions on the emerging MVVM framework, they can only find solutions from the jQuery ecosystem, and many websites are mixed. "
So, with such a high usage rate, why does jQuery become a technical debt that some companies want to delete?
jQuery's status is no longer in the arena?
"Currently speaking from the whole world, jQuery is a marginalized existence." Industry insiders pointed out that since the first version was released in 2006, jQuery has ushered in a 10-year golden period, which means that it It's hard to be eliminated instantly. But with the maturity of JavaScript itself and the unification of the browser kernel, the advantages of jQuery are slowly diminishing...
"We basically don't add new features. Most of the current work is optimization to make jQuery faster, stronger, and easier to understand. Future work is also optimization to make jQuery functions clearer." In 2011, the jQuery team expressed The point of view can be said to also lay a footnote for the later fate of jQuery.
When jQuery starts to go the optimization route, when the problems that jQuery initially solves are gradually becoming less common problems, there are bound to be situations where the advantages are lost. Looking back at the two main battlefields of jQuery, simplifying DOM operations and browser compatibility, both have better solutions in recent years.
First, the browser compatibility issue. In 2004, a year before jQuery's infancy, a group of like-minded people from various organizations such as Opera, Mozilla, Apple, etc. came together to form an independent specification group called WHATWG with the aim of writing a better HTML markup Specification for building a new generation of Web applications, the result of this specification group is the Web Application 1.0 specification . Then, after many discussions among W3C members, in March 2007, the HTML work was restarted, and the first decision made by the new HTML working group was to adopt the Web Application 1.0 specification and call it HTML5.
HTML 5 is more suitable for writing dynamic applications than previous versions of HTML and has a well-defined parsing algorithm, all browsers implementing HTML5 will create the same DOM from the same markup.
However, HTML5 was not very complete when it first appeared, and the external adoption rate was low, giving jQuery a chance to breathe and grow in the early stage.
In 2008, the first HTML5 draft was born. In the same year, several major browser giants such as IE, Chrome, FireFox, and Safari began to support HTML5 one after another. But at this time, HTML 5 has not yet been finalized, and it has also been questioned. For example, in 2012, the Facebook application abandoned the HTML5 part and changed to pure native development. HTML5 standard setters W3C and WHATWG no longer cooperate due to differences in standard formulation. Apple, which has always been a firm backer of HTML5, no longer allows pure Web APP shells to log in to the App Store.
HTML 5 has gone through another period of sluggishness, during which jQuery is still the favorite of most websites around the world.
Until the end of October 2014, after 8 years, W3C finally announced the finalization of HTML5. In the next two years, browser manufacturers have announced their support for HTML5, various application developers have successively adopted HTML5 to develop products, and some HTML5 service providers have also received financing.
With the large-scale application of HTML5, another technical framework that poses a "threat" to jQuery - MVVM is popularized, making jQuery's advantage in DOM manipulation no longer.
Since developers hope that the applications developed by HTML5 can be close to the effect of native apps, some problems are exposed, such as a large number of DOM operations and frequent calls of DOM APIs, which make the operation cumbersome, making the code difficult to maintain, and the page rendering performance and speed are reduced. Slow down etc. Even though jQuery can simplify DOM manipulation, it is not as good as the MVVM architecture that skips DOM manipulation directly.
The MVVM architecture consists of three parts: Model, View, and ViewModel. The Model layer represents the data model, which can define the business logic of data modification and operation; View represents the UI component, which is responsible for converting the data model into UI presentation, and the ViewModel is a synchronous View and Model. Object. View and Model interact through ViewModel, and the synchronization between the two is completely automatic, without requiring developers to manually manipulate the DOM.
Since the MVVM structure realizes the separation of data and views, and drives views through data, encapsulates DOM operations, turns the binding of data and views into automated operations, and removes DOM operations from business code, which leads to jQuery loses its place in many scenarios.
A new generation of front-end development frameworks that conform to the MVVM thinking gradually emerges, forming the current three front-end frameworks:
In 2009, the AngularJS framework appeared and was later acquired by Google. The core features include MVVM, modularization, automatic two-way data binding, semantic tags, dependency injection, etc.;
In May 2013, React, a JavaScript library for building user interfaces that originated at Facebook, was open sourced;
In 2013, You Yuxi, who was working at Google, was inspired by Angular and issued a lightweight framework, Seed. In December of the same year, it was renamed Vue. On January 24, 2014, Vue was officially released, and the version number was 0.8.0.
Some people describe the comparison of jQuery and the new framework:
I asked jQuery to buy a bottle of soy sauce and gave him 100 yuan. At this time, we need to tell him how to go to the small shop, how to tell the boss what soy sauce to buy, how much soy sauce to buy, how much change to get, and how much Tell him how to get back ( imperative ).At this time, I asked Vue to buy soy sauce. At this time, I only need to give him the money, and tell him where the destination is and what soy sauce to buy, and I don't need to teach him (functional style).This is the difference between traditional development and modern framework development.
On the whole, with the improvement of UI interaction standards and the unification of browser parsing standards, it is difficult for jQuery to surpass many MVVM frameworks in new functions.
However, the biggest advantage of jQuery at present is that it is relatively lightweight and only needs to be oriented to the browser, while the new framework requires a lot of engineering means, and the technical threshold is higher than that of jQuery. Moreover, the jQuery component has a certain historical background, covers a wide range, has relatively comprehensive functions, and is more ecologically mature than the MVVM framework.
In addition, because jQuery still has a high market share and is easy to use, mastering jQuery is still the "basic operation" for many developers. In the evaluation of jQuery, there is such a widely circulated saying: "Any programmer can learn the basic usage of jQuery and put it into use in three days." In addition, there are also some subjective factors in the update of developers' technology stacks. It is very difficult for most developers, especially developers who are not good at the front-end field, to completely overthrow the technologies they have mastered. Industry insiders predict that the main audience of jQuery in the next few years will still be back-end developers. Of course, the proportion of this group will be gradually diluted as newcomers continue to join.
"In general, what we are discussing today is not the status of jQuery, but the meaning of its existence. For practical people, people are more concerned about how many problems jQuery can help them solve, and the status is no longer jQuery's label."
Reference link:
https://medium.com/mayazine/the-life-and-death-of-jquery-9aca562c80b9
https://www.oschina.net/news/20627/john-resig-talk-about-javascript-and-develop-road
https://www.oschina.net/news/8111/jquery-good-work
https://www.sitepoint.com/interview-john-resig/
https://www.w3.org/wiki/The_history_of_the_Web
https://www.oschina.net/news/64419/html5-rise-up
https://cloud.tencent.com/developer/article/1692480