前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >JQuery逐渐退出前端历史舞台?

JQuery逐渐退出前端历史舞台?

作者头像
创译科技
发布2019-07-01 16:45:18
1.3K0
发布2019-07-01 16:45:18
举报
文章被收录于专栏:Node开发Node开发

现在各大技术论坛经常有类似的问题出现,PHP是否过时了,JQuery是否已经被淘汰?前段时间GitHub宣布改版,并且放弃了JQuery依赖,而且发布文章详细的解释了为什么放弃JQuery。这里贴下GitHub英文原版文章:

代码语言:javascript
复制
https://github.blog/2018-09-06-removing-jquery-from-github-frontend/

正如GitHub文章里面所说,在JQuery发展鼎盛时期为什么会被广泛使用呢?我觉得主要有以下几个原因:

代码语言:javascript
复制
当时没有标准的方法来通过css选择器查询DOM元素。
当时没有标准的方法来实现动画的视觉效果。
IE的XMLHttpRequest接口存在浏览器的兼容问题。

JQuery使得开发人员操作DOM元素、实现动画效果以及发起ajax请求变得很简单,所以JQuery从中脱颖而出,最重要的一点是JQuery对于浏览器的兼容问题处理的比较到位。

那为什么GitHub这样的公司都会逐渐把JQuery慢慢剥离呢?因为现在web标准越来越完善,我们使用JQueryAPI的时候会习惯性与标准API进行比较,我们可以随便举几个例子:

代码语言:javascript
复制
$(selector)完全可以使用querySelectorAll()进行替代。
css类名切换可以使用Element.classList.
css现在支持在样式表实现动画。
发起ajax请求完全可以使用axios替代,并且性能更高。
addEventListenner监听支持跨平台使用。
随着JavaScript的高速发展,JQuery提供的语法糖变得越来越多。

也就是说,我们一直以来依靠JQuery来做的事情,现在通过原生JS完全可以做到的。JQuery具有独特的链式语法和短小清晰的功能接口,具有灵活的css选择器,而且在浏览器兼容处理做的非常好,而不用管原生JS是否会支持,这就是JQuery在前端领域一直备受重视的原因。很多开发者现在更倾向于使用三大现代框架Vue/React/Angular进行前端开发,Vue这种现代框架有什么优点呢?最显著的特点应该就是:

代码语言:javascript
复制
现代框架为了性能也为了代码便于维护,开发者无法直接操作DOM树。

框架会维护一个virtual DOM,组件有进行改动自动渲染DOM到页面中,所以我们使用Vue之类的框架我们只需要关心如何去实现组件,如何处理请求数据,不用和JQuery去对DOM元素进行操作了,大大简化了开发者的工作量。但是我们可以发现三大现代框架相比较JQuery存在着一个显著的缺点:

代码语言:javascript
复制
使用三大现代框架进行前后端分离开发,对搜索引擎SEO不友好。

搜索引擎SEO的原理是通过URL,获取网页源代码进行解析。如果我们使用现代框架进行开发实现数据渲染,SEO最终获取到的是模型界面而不是数据渲染界面。当然,业界都会提供对应的解决方案,比如我拿vue做示例,一般有三种解决方案:

代码语言:javascript
复制
页面预渲染
服务端渲染
路由采用 H5 history模式

那我们现在再次提出这个问题:JQuery会最终退出前端的历史舞台么?我们不得不先说的是JQuery目前存在几个比较显著的缺点:

代码语言:javascript
复制
JQuery项目过去庞大,有很过实际无用的的功能存在。所以存在着很多精简版的JQuery项目。
JQuery全是对DOM元素进行操作,一旦改动页面结构,解耦性太紧,一般都需要大幅度改动。
无法避免大量拼写html字符串的操作。
无法从根本上解决XSS攻击隐患。

虽然官方不愿承认,而且一直促使JQuery跟随潮流往MVVM概念进行更新,甚至制定了移动端定制库,但是依旧越来越多的项目抛弃了JQuery。但是我觉得JQuery是不可能完全过时的,JQuery的开发思想是永远不会过时的。JQuery能在前端领域被广泛使用十来年,绝对不是偶然因素。因为JQuery的选择符,API,浏览器间兼容,DOM元素的处理,这些都有实际存在的强大的应用。所以说我们依然要学习JQuery的思想,可以对我们写代码以及封装库起到一定的帮助。为何会对我们写代码和封装库起到帮助呢,我可以举个例子给大家看看:

如果我们使用原生JS实现按钮监听,我们可能需要这样:

代码语言:javascript
复制
if (button.addEventListener)
    button.addEventListener('click', function(err, data){
// to do sth
    });
else if (button.attachEvent) {
    button.attachEvent('onclick', function(err, data){
// to do sth
    });
} else {
    button.onclick = function(err, data){
// to do sth
    };
}

但是如果使用JQuery,我们可以把逻辑简化成几行代码:

代码语言:javascript
复制
$(button).on('click', function(err, data){
// to do sth
});

我们可以发现,JQuery的代码可读性非常强。我们平时写代码就可以学习JQuery的思想尽可能去设计优雅的API。很多人就是不会自己设计优雅的API,只懂得一直调用框架提供的功能,所以技术水平一直被局限。

JQueryGitHub移除所有的依赖,但是并没有选择使用任何现代化框架,而是选择用原生JS去重构。所以,从这件事来判定JQuery已经过时是不对的。我们应该以这样的眼光去看待:现在web标准越来越完善,而且越来越多的优秀框架不断涌现,不再是JQuery一枝独秀的时代了。我们准备开发一个项目时我们会更多开始用JQuery是否适合?如果项目涉及很多动态数据渲染,我们用JQuery可能会是更合适的选择。如果需要频繁的对DOM元素进行增删改查,可能我们会偏向于选择Vue之类的现代框架。用MVVM我们只需要操作数组,非常的方便。反之JQuery各种操作DOM,各种html字符串拼接,我相信没几个人会不感到厌倦的。

使用现代框架进行前后端分离开发,一般前后端协作都是以CORS跨域的方式进行协作开发。后端开放权限,前端发起请求。但是如果涉及不得不用JSONP的时候,现代框架处理是比较麻烦的,而这种情况下我们使用JQueryajax请求是非常方便的。

我对技术没有偏见,随着时代的发展,JQuery的市场占有率越来越少,也许有一天真的完全被抛弃。但是它也在不断去除自身的糟粕,而JQuery的精华有些也演化成了Web标准。短期内JQuery还不会退出历史舞台,目前网站里面至少有90%目前还依赖着jQuery,这个逐步退出的过程还会持续很多年。当然这也改变不了它最终的宿命,jQuery很好地完成了前端发展的历史使命,精华部分被JS标准吸收,前端开发也过了纯操作DOM的年代,程序员可以更好地专注于业务逻辑,这代表时代是在向前发展,对于开发者来说其实是一件好事。

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2019-06-22,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 程序猿周先森 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档