弃用jQuery后,性能飞起
诞生于2006年,jQuery是一款深受前端开发者欢迎的跨浏览器JavaScript库,在受w3techs监测的网站中,全球访问流量TOP 10000的网站之中,有77.3%的网站使用了jQuery。截图自w3techs然而,随着JS能力的增强,即使不使用jQuery框架也能实现同样功能。所以,网站还有必要使用jQuery吗?有些网站已经给出了答案。弃用jQuery英国政府网站GOV.UK前端主管
诞生于2006年,jQuery是一款深受前端开发者欢迎的跨浏览器JavaScript库,在受w3techs监测的网站中,全球访问流量TOP 10000的网站之中,有77.3%的网站使用了jQuery。
然而,随着JS能力的增强,即使不使用jQuery框架也能实现同样功能。所以,网站还有必要使用jQuery吗?有些网站已经给出了答案。
弃用jQuery
英国政府网站GOV.UK前端主管Matt Hobbs在3月份宣布,该网站上的所有前端应用程序都已经移除了jQuery依赖,在所有13个FE应用程序中,JS大小减少了32KB(或占应用体积的31%~49%),具体也要取决于应用程序。
作为公共网站,精简后的网站可以确保所有人都可以访问,结果显示网站的多项性能数据都有明显提升、即使是在老旧的设备和网速较慢的地方访问,也有了明显提升。下面是Matt Hobbs晒出的一些数据指标变化图:
除了以上数据变化,在JavaScript性能方面,前后对比也有明显变化:
CPU在大任务的执行时长上,时间由原来的553ms提升到490ms,超大任务执行时长由0.23s提升到了0.21s。
极端情况下的数据表现,95%的用户阻塞时间减少了10%。
去掉页面标签后,所有页面的数据变化情况,下面是在75%页面上的前后对比:
在50%(中位数)的页面中仍然可以看到这种改进。
如果在75%的页面中只考察安卓用户,JS长任务的改进为7%。
如果限制在只有50%用户的移动设备上,JS长任务有10%的改善。
其实,关于jQuery过时的讨论由来已久。在2018年的时候,GitHub就宣布从前端代码依赖中去除了jQuery,彼时,GitHub团队就拿JS技术与jQuery进行了对比,结果发现:
-
$(selector) 可以简单地用querySelectorAll()替换;
-
CSS类名切换,可以通过Element.classList实现;
-
CSS现在支持在样式表中定义视觉动画,无需使用JavaScript;
-
$.ajax请求可以用Fetch标准实现;
-
addEventListener()接口已经十分稳定,足以跨平台使用;
-
可以用一个轻量级的库,来封装事件代理模式;
-
jQuery提供的一些语法糖,已随着JavaScript语言的发展,而变得多余。
网友:熟练使用jQuery代表过时了?
Gov.uk前端弃用jQuery的新闻也在HN上引起了热烈讨论,然而讨论的画风却是由弃用jQuery到讨论老程序员过时的话题之上。
ID为@reggieband用户分享了他的一段职业经历,讲述其在一家游戏公司工作时,有一位灰胡子的传奇人物,每次总能在系统的最后时刻,挤出一点点性能提升。然而随着硬件和编译器的进步,这些技巧开始失效。他最后抛出一个观点,如果某个应聘者在面试时提到自己的jQuery熟练程度时,他会认为这个人已经过时了。
对于reggieband的观点,也有不少人持否定态度,ID为dlandis表示,他们只是在时代的年轮上,没有及时更新知识的白胡子们,没有理由把jQuery与他们进行相关联,科技界本身就存在很大的年龄歧视,这种刻板印象的传播,真的不合时宜。
ID是lhorie也表示,对于jQuery的讨论不应该用一种高傲的姿态来吐槽过时的知识。现代框架就像是高级、复杂且不透明的编译器,而灰胡子们对HTML流、前端字体优先级和隐藏类等是如何影响性能的有非常透彻的理解。团队负责人类似于普通训练营的毕业生,知道如何使用当前的框架,但如果走出框架的舒适范围,进入这些高级话题的深处,就会感到力不从心。
他认为gov.uk的用例实际上只是一个例外,因为它实际上考虑了已经很紧凑的代码库的性能,而很多jQuery的废弃工作都是以可维护性、开发人员的生产力或招聘等名义带来的更重的替代方案。但是在对低层次问题的理解和对SDLC管理的关注之间制造一个错误的二分法似乎有点虚情假意。因为它们并不相互排斥。
参考链接:
- https://twitter.com/TheRealNooshu/status/1509487066941374466
- https://web.dev/gov-uk-drops-jquery/
更多推荐
所有评论(0)