jQuery 的历史和遗产

jQuery 的历史和遗产
jQuery - 这是最受欢迎的 世界上有一个 JavaScript 库。 Web 开发社区在 2000 年代末创建了它,形成了一个由在幕后使用 jQuery 的网站、插件和框架组成的丰富生态系统。

但近年来,它作为网络开发首要工具的地位已经被削弱。 让我们看看为什么 jQuery 变得流行,为什么它不再流行,以及在什么情况下仍然建议使用它来创建现代网站。

jQuery 简史

约翰·雷西格(约翰·雷西格)于 2005 年创建了该库的第一个版本,并且 2006年出版-m,在一个名为 BarCampNYC 的活动中。 在 jQuery 官方网站 作者写道:

jQuery 是一个基于以下座右铭的 Javascript 库:Javascript 应该是有趣的编码。 jQuery 处理常见的、重复性的任务,去掉所有不必要的标记,并使它们变得简短、优雅和干净。

jQuery 有两个主要优点。 第一个是用于操作网页的便捷 API。 特别是,它提供了强大的选择元素的方法。 您不仅可以通过 ID 或类进行选择,jQuery 还允许您编写复杂的表达式,例如,根据元素与其他元素的关系来选择元素:

// Select every item within the list of people within the contacts element
$('#contacts ul.people li');

随着时间的推移,选择机制变成了一个单独的库 .

该库的第二个优点是它抽象了浏览器之间的差异。 在那些年里,编写能够在所有浏览器中可靠运行的代码是很困难的。

缺乏标准化意味着开发人员需要考虑浏览器和边缘情况之间的众多差异。 看一眼 这个早期的 jQuery 源代码 并搜索 jQuery.browser。 这是一个例子:

// If Mozilla is used
if ( jQuery.browser == "mozilla" || jQuery.browser == "opera" ) {
        // Use the handy event callback
        jQuery.event.add( document, "DOMContentLoaded", jQuery.ready );

// If IE is used, use the excellent hack by Matthias Miller
// http://www.outofhanwell.com/blog/index.php?title=the_window_onload_problem_revisited
} else if ( jQuery.browser == "msie" ) {

        // Only works if you document.write() it
        document.write("<scr" + "ipt id=__ie_init defer=true " + 
                "src=javascript:void(0)></script>");

        // Use the defer script hack
        var script = document.getElementById("__ie_init");
        script.onreadystatechange = function() {
                if ( this.readyState == "complete" )
                        jQuery.ready();
        };

        // Clear from memory
        script = null;

// If Safari  is used
} else if ( jQuery.browser == "safari" ) {
        // Continually check to see if the document.readyState is valid
        jQuery.safariTimer = setInterval(function(){
                // loaded and complete are both valid states
                if ( document.readyState == "loaded" || 
                        document.readyState == "complete" ) {

                        // If either one are found, remove the timer
                        clearInterval( jQuery.safariTimer );
                        jQuery.safariTimer = null;

                        // and execute any waiting functions
                        jQuery.ready();
                }
        }, 10);
}

多亏了 jQuery,开发人员可以将对所有这些陷阱的担忧转移到开发该库的团队的肩上。

后来,jQuery 使得更复杂的技术(例如动画和 Ajax)的实现变得更加容易。 该库实际上已成为网站的标准依赖项。 如今,它为互联网的很大一部分提供了动力。 W3Techs 认为 如今 74% 的网站使用 jQuery.

对 jQuery 开发的控制也变得更加正式。 2011年团队 创建了 jQuery 板。 2012 年 jQuery Board 转变为 jQuery 基金会.

2015 年,jQuery 基金会与 Dojo 基金会合并, 创建 JS 基金会,然后与 Node.js 基金会合并为 2019-m 创建 OpenJS基金会,其中 jQuery 是“突破性项目

环境的变化

然而,近年来 jQuery 失去了人气。 的GitHub 从我网站的前端删除了该库。 引导程序 v5 摆脱 jQuery因为这是他的“常规 JavaScript 的最大客户端依赖性“(目前大小为 30 KB,已缩小并打包)。 Web 开发的几个趋势削弱了 jQuery 作为重要工具的地位。

浏览器

由于多种原因,浏览器的差异和限制已经变得不那么重要了。 一是标准化程度有所提高。 主要浏览器开发商(Apple、Google、Microsoft 和 Mozilla)正在共同开发 网络标准 Web超文本应用技术工作组.
尽管浏览器在许多重要方面仍然存在差异,但供应商至少有一种方法来搜索和创建通用数据库,而不是 永久战争 一起。 因此,浏览器 API 获得了新的功能。 例如, 获取API 能够从 jQuery 替换 Ajax 函数:

// jQuery
$.getJSON('https://api.com/songs.json')
    .done(function (songs) {
        console.log(songs);
    })

// native
fetch('https://api.com/songs.json')
    .then(function (response) {
        return response.json();
    })
    .then(function (songs) {
        console.log(songs);
    });

方法 查询选择器 и 查询选择器全部 重复的 jQuery 选择器:

// jQuery
const fooDivs = $('.foo div');

// native
const fooDivs = document.querySelectorAll('.foo div');

您现在可以使用操作元素类 类列表:

// jQuery
$('#warning').toggleClass('visible');

// native
document.querySelector('#warning').classList.toggle('visible');

该网站 你可能不需要 jQuery 下面还有几种可以用本机代码替换 jQuery 代码的情况。 一些开发人员总是坚持使用 jQuery,因为他们根本不了解新的 API,但当他们了解时,他们就会开始减少使用该库的频率。

使用本机功能可以提高页面性能。 许多 jQuery 的动画效果 现在你可以实施 更有效 使用CSS。

第二个原因是浏览器的更新速度比以前快得多。 他们大多数都使用 “常青”更新战略,Apple Safari 除外。 它们可以在后台更新,无需用户参与,并且与操作系统更新无关。

这意味着新的浏览器功能和错误修复的分发速度要快得多,开发人员不必等到发布 我可以用吗 将达到可接受的水平。 他们可以自信地使用新功能和 API,而无需下载 jQuery 或 polyfill。

第三个原因是 Internet Explorer 正接近完全无关紧要的状态。 IE 长期以来一直是世界各地 Web 开发的祸根。 它的错误很普遍,而且由于 IE 在 2000 年代占据主导地位并且没有使用常青更新策略,因此旧版本仍然很常见。

2016年,微软加速了IE的退役, 停止支持 第十个及更早版本,限制了对 IE 11 的支持。越来越多的 Web 开发人员可以忽略 IE 兼容性。

甚至 jQuery 也从 IE 8 开始停止支持 IE XNUMX 及以下版本 版本2.0,发表于 2013 年。 尽管在某些情况下仍然需要 IE 支持(例如,在较旧的站点上),但这些情况出现的频率越来越低。

新框架

自从 jQuery 出现以来,已经创建了许多框架,包括现代的领导者 应对, 角度方向 и Vue公司。 与 jQuery 相比,它们有两个重要的优点。

首先,它们使将用户界面分离为组件变得容易。 框架旨在处理页面呈现和更新。 而 jQuery 通常只用于更新,将提供初始页面的任务留给服务器。

另一方面,React、Angular 和 Vue 组件允许您紧密耦合 HTML、代码甚至 CSS。 正如我们将代码库划分为许多独立的函数和类一样,将界面划分为可重用组件的能力使得构建和维护复杂站点变得更加容易。

第二个优点是,最近的框架遵循声明性范例,其中开发人员描述界面应该是什么样子,并将其留给框架进行所有必要的更改以实现所需的效果。 这种方法与 jQuery 代码的命令式方法相反。

在 jQuery 中,您明确地写下进行任何更改的步骤。 在声明式框架中,您会说:“根据这些数据,界面应该如下所示。” 这可以使编写无错误的代码变得更加容易。

开发人员采用了新的网站开发方法,这就是 jQuery 受欢迎程度下降的原因。

何时使用 jQuery?

所以当 应该 使用 jQuery?

如果项目的复杂性增加,那么最好从另一个允许您有效管理复杂性的库或框架开始。 例如,将界面划分为组件。 在此类网站上使用 jQuery 起初可能看起来不错,但它很快就会导致意大利面条式代码,您不确定哪个片段影响页面的哪个部分。

我曾经遇到过这样的情况,当我试图做出任何改变时,感觉就像是一项艰巨的任务。 您不能确定不会破坏任何内容,因为 jQuery 选择器依赖于服务器生成的 HTML 结构。

另一方面是简单的网站,只需要一点交互性或动态内容。 在这些情况下我也不会默认使用 jQuery,因为您可以使用本机 API 做更多事情。

即使我需要更强大的东西,我也会寻找专门的库,例如 爱可信 对于阿贾克斯或 Animate.css 用于动画。 这比为一个小功能加载所有 jQuery 更容易。

我认为使用 jQuery 的最佳理由是它为网站前端提供了全面的功能。 您无需学习各种本机 API 或专用库,只需阅读 jQuery 文档即可立即提高工作效率。

命令式方法的扩展性不好,但它比其他库的声明式方法更容易学习。 对于功能明显有限的站点,最好使用 jQuery 并冷静地工作:该库不需要复杂的组装或编译。

此外,如果您确信您的网站不会随着时间的推移而变得复杂,并且您不关心本机功能(这肯定需要编写比 jQuery 更多的代码),那么 jQuery 是不错的选择。

如果您需要支持旧版本的 IE,也可以使用此库。 然后 jQuery 将为您提供服务,就像 IE 是最流行的浏览器时代一样。

勘探

jQuery 不会很快消失。 她 积极发展,并且许多开发人员更喜欢使用其 API,即使本机方法可用。 该库帮助整整一代开发人员创建了可在任何浏览器上运行的网站。 尽管 jQuery 在很多方面已被新的库、框架和范例所取代,但它在现代 Web 的创建中发挥了巨大的积极作用。

除非 jQuery 的功能发生重大变化,否则该库的使用量在未来几年内可能会继续缓慢但稳定地下降。 新网站往往从一开始就使用更现代的框架来构建,适合 jQuery 的用例变得越来越少。

有些人不喜欢网络开发工具过时的速度,但对我来说,这是快速进步的证据。 jQuery 使我们能够把很多事情做得更好。 她的继任者也是如此。

来源: habr.com

添加评论