首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

将jQuery重写为普通的旧JavaScript - 性能增益值得吗?

这个问题涉及到了前端开发和JavaScript的性能优化。将jQuery重写为普通的旧JavaScript,可能会带来一定的性能增益,但是这个增益是否值得,需要根据具体的项目需求和性能要求来决定。

首先,jQuery是一个流行的JavaScript库,它简化了许多前端开发中的复杂操作,例如DOM操作、事件处理等。如果项目中大量使用了jQuery,将其重写为普通的旧JavaScript可能会导致代码量增加,开发难度增加,维护成本增加等问题。

其次,普通的旧JavaScript在某些情况下可能会比jQuery更快,因为它不需要加载jQuery库。但是,如果项目中已经在使用jQuery,那么将其重写为普通的旧JavaScript可能不会带来明显的性能提升。

最后,针对性能优化,可以采用一些其他的方法,例如代码压缩、图片优化、缓存策略等,这些方法可以在不影响项目开发效率的情况下,带来更好的性能提升。

总之,将jQuery重写为普通的旧JavaScript是否值得,需要根据具体的项目需求和性能要求来决定。如果项目中已经在使用jQuery,并且不会带来明显的性能提升,那么可以考虑其他的性能优化方法。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Github 移除 JQuery 的过程

未来几年的Web标准 多年来,GitHub成长为一家拥有数百名工程师的公司,并逐渐组建了一个专门的团队,负责为web浏览器服务的JavaScript代码的大小和质量。...增量解耦 即使有了最终目标,我们知道仅仅分配所有资源是不可行的,我们必须重写从jQuery到vanilla JS的所有内容。...大量与rails行为接口的旧代码,我们的Ruby on rails适配器采用“不引人注目”的JS方式,将AJAX生命周期处理程序附加到某些表单: 我们不必一次将所有这些调用站点重写为新方法,而是选择触发假...因此,即使那些使用JS增强的web表单和其他UI元素通常也会在浏览器中禁用JavaScript。在某些情况下,我们能够完全删除某些遗留行为,而不必在vanilla JS中重写它们。...因为polyfilling现在会导致性能损失,即使是处理与web组件无关的DOM部分的代码,我们也不可能开始在生产中使用它。

2.1K10

都9102年了,还需要用到 jQuery 吗?

随着现代库和框架的出现,浏览器 API 的标准化以及需要 jQuery 技能的职位减少,开发人员仍然需要继续学习 jQuery 吗。...基本上它是一个 JavaScript 库,它使在访问 DOM 的同时对 DOM 操作成为可能,并能在旧浏览器中用 JavaScript 执行某些几乎不可能做到的操作。...开发人员对 jQuery 的吐槽 使用 jQuery 需要付出一定的成本: 渲染性能 - jQuery 为了实现大量很棒的功能牺牲了性能。...在一些简单的或普通的网站中,性能缓慢几乎不会引起注意,并且可能是为了更多功能所做的折衷,但是在每一毫秒都很重要的大型复杂网站中,jQuery 一般会降低此类网站的性能。...jQuery 与现代前端库和框架进行比较 jQuery 被较少使用的一个主要原因是 JavaScript 库和框架(例如ReactJS、AngularJS 和 VueJS)的兴起,在本节中我们将看看它们的区别

2.2K40
  • jQuery 4.0震撼发布:这是复兴还是告别?

    本文将分享jQuery 4.0更新的亮点,回顾其辉煌的发展历程,并讨论jQuery的未来前景。 jQuery 4.0更新亮点 经过慎重准备,jQuery团队终于发布了v4.0的beta版本!...这个版本带来了错误修复、性能提升和显著变化,最值得注意的是放弃了对IE的支持,以更好地适应现代web标准。...这些函数要么是为内部使用而设计,要么对于所有支持的浏览器都有原生的替代方案。...事件顺序变化:jQuery 4.0中focusin和focusout事件的处理顺序发生了变化,以符合最新的W3C规范。这可能会影响依赖旧顺序的插件或代码。...许多网站和web应用仍然依赖于jQuery,因为它的易用性、广泛的插件生态系统和对老旧浏览器的兼容性。 jQuery还有相关性吗?

    1.7K10

    2020前端性能优化清单(三)

    23 在生产环境中使用 JavaScript 原生模块。 还记得优秀的 cut-the-mustard [3] 技术吗?该技术将核心体验发送到旧版浏览器并将增强体验发送到现代浏览器的。...这里有一些值得研究的资源: Surma 已发布了一份 如何脱离浏览器的主线程运行 JavaScript 的出色指南[31]。该帖子还以 Surma 的演讲为卖点,解释了主线程体系结构。...30 通过增量解耦识别并重写老旧代码。 长期存在的项目会有尘封代码和过时代码越积越多的趋势。重新审视你项目的依赖并评估重构或重写最近引起问题的旧代码需要多少时间。...之后,你将该图像设置为 CSS 中特定选择器的背景,如果该图片的访问记录出现在日志中就再等待几个月,如果没有出现,则表示没有人在其屏幕上出现过该旧组件:你可能可以进一步将其全部删除。...它可以将 JavaScript 编译为等效的 JavaScript 代码,但是与 Babel 或 Uglify 不同,它可以让你编写普通的 JavaScript 代码,输出运行速度更快的等效 JavaScript

    2.2K20

    2020前端性能优化清单(三)

    23 在生产环境中使用 JavaScript 原生模块。 还记得优秀的 cut-the-mustard [3] 技术吗?该技术将核心体验发送到旧版浏览器并将增强体验发送到现代浏览器的。...这里有一些值得研究的资源: Surma 已发布了一份 如何脱离浏览器的主线程运行 JavaScript 的出色指南[31]。该帖子还以 Surma 的演讲为卖点,解释了主线程体系结构。...30 通过增量解耦识别并重写老旧代码。 长期存在的项目会有尘封代码和过时代码越积越多的趋势。重新审视你项目的依赖并评估重构或重写最近引起问题的旧代码需要多少时间。...之后,你将该图像设置为 CSS 中特定选择器的背景,如果该图片的访问记录出现在日志中就再等待几个月,如果没有出现,则表示没有人在其屏幕上出现过该旧组件:你可能可以进一步将其全部删除。...它可以将 JavaScript 编译为等效的 JavaScript 代码,但是与 Babel 或 Uglify 不同,它可以让你编写普通的 JavaScript 代码,输出运行速度更快的等效 JavaScript

    2.1K10

    React 17 RC 版发布:无新特性,却有新期待!

    在这篇文章中,我们将介绍此版本的意义,它值得期待的变更以及试用指南。 无新特性 React 17 版本很特别,因为它并没有任何面向开发者的新功能,而是专注在了如何更轻松地升级 React 本身。...渐进式升级 在过去的七年中,React 的升级一直很极端。你要么停留在旧的版本,要么将整个应用升级到新版本,不能选择中间态。 这个策略至今运作良好,但我们也遇到了这种「极端」升级策略带来的局限。...如果你不喜欢 React 了,想用 jQuery 重写你的应用,你可以从 shell 开始将其从 React 转换为 jQuery, 而不会影响事件冒泡。.../ 在 React 16 及以前版本中会引发 crash text: e.target.value })); } 这是因为 React 在旧浏览器中为了提高性能而复用了不同事件之间的事件对象,并将所有事件字段设置为...在 React 17 中,组件堆栈是通过不同的机制生成的,该机制将组件堆栈与原生 JavaScript 堆栈简单结合在一起。这使你可以在生产环境中获得完全符号化的 React 组件堆栈跟踪。

    2.4K20

    作为面试官,为什么我推荐微前端作为前端面试的亮点?

    主要优点: 解耦: 微前端架构可以将大型项目分解为多个可以独立开发、测试和部署的小型应用。这种解耦可以提高开发效率,减少团队间的协调成本。...技术栈无关: 不同的微前端应用可以使用不同的技术栈,这为使用新技术、升级旧技术提供了可能。 并行开发: 因为微前端应用是独立的,所以多个团队可以并行开发不同的应用,无需担心相互影响。...方案二:劫持标签插入函数 这个方案分为两步: 对于 HTML 中已有的 img/audio/video 等标签,qiankun 支持重写 getTemplate 函数,可以将入口文件 index.html...以下是一些可能的解决方案: 使用 qiankun 的 getTemplate 函数重写静态资源路径:对于 HTML 中已有的 img/audio/video 等标签,qiankun 支持重写 getTemplate...,一个潜在的缺点是它需要浏览器支持Shadow DOM,这在一些旧的浏览器或者不兼容Shadow DOM的浏览器中可能会出现问题。

    1.1K10

    深刻理解 React (一) :JSX 和虚拟DOM

    虽然在关注总量上 React 还远不及 jQuery 和 Angular 等等,但它的增长幅度超乎你想象,你知道这意味着什么吗?这意味着关注 React,你就比大多数人走在了业界的前沿!...引用官网的简介,“一个用来构建用户界面的javascript库”。...所以如果你喜欢它,你可以很容易的将它接入到现有工程中,然后用 React 重写 HTML 部分即可,不用修改逻辑。...当数据变化时,然后React会自动更新虚拟DOM,然后拿新的虚拟DOM和旧的虚拟DOM进行对比,找到有变更的部分,得出一个Patch,然后将这个Patch放到一个队列里,最终批量更新这些Patch到DOM...这时的 Article 组件看起来就是一个普通的标签而已,简单吧。 这个是热问组件,也复用了 Article 组件。 这就是 React 如丝般顺滑的组件复合。

    4K00

    2017年前端开发工具趋势

    编译器:将ES6代码编译为ES5 62%的开发人员正在使用Babel这样的编译器,来将ES6代码编译为对旧浏览器更为友好的ES5代码。31%的受访者听说过这样的编译器,但是并未使用过。...7%的开发者从未听说过这样的编译器。 62%这个数据是比较高的。IE和旧的应用并不支持最新的JavaScript语法,所以如果你正在编写的是ES6代码,那么就需要最新的浏览器来支持。...如果项目需要在旧的浏览器版本下运行,那么最好编写ES5代码。...有以下几点值得注意: 如果你需要使用更多的工具,那么Node.js和npm值得选择 Gulp和Webpack值得尝试 ​学习ES6,即便你一直工作在向后兼容的ES5项目中。...如果你还没选定框架,那么可以先学习HTML、CSS、JavaScript和浏览器开发的基础知识。这些知识能够帮助你更好了解框架,甚至也可能促使你为框架系统的改进做出贡献。

    45730

    前端面试宝典 v1

    理解JavaScript的预解析机制,js的运行主要分两个阶段:js的预解析和运行,预解析阶段所有的变量声明和函数定义都会提前,但是变量的赋值不会提前 49、如何编写高性能的Javascript?...应该避免使用eval,不安全,非常耗性能(2次,一次解析成js语句,一次执行) 54、JavaScript 原型,原型链 ? 有什么特点? 1....,优化javascript性能。...(流程说的越详细越好) 要熟悉前后端的通信流程,最好把动态网站的背后细节也介绍一遍 七、流行框架 1、JQuery的源码看过吗?能不能简单概况一下它的实现原理?...this执行init构造函数自身,其实就是jQuery实例对象,返回this是为了实现jQuery的链式操作 1、jquery中如何将数组转化为json字符串,然后再转化回来?

    2.4K41

    从GitHub.com放弃使用jQuery说起

    近些年的Web标准 这些年来,GitHub 成长为一家拥有数百名工程师的公司,并逐渐成立了一个专门的团队来负责把关 JavaScript 代码的规模和质量,这些代码会服务于 Web 浏览器。...逐步解耦 虽然有一个目标在望,但是我们很清楚,用所有资源重写代码来替换 jQuery 是不可行的。如果冒然行动,如此匆忙的努力可能会导致网站功能出现许多倒退,然后很快将不得不淘汰这些倒退的功能。...现在旧代码中有很多违反 eslint 规则的行为,所有这些我们都在代码注释中使用特定的 eslint-disable 规则进行了注释。...每当某个 IE 版本的使用率低于某个阈值时,我们就会停止为其提供 JavaScript支持,并专注于测试和支持更现代的浏览器。...例如, 默认显示原始时间戳,被升级为将时间戳转换为本地时区的时间;当 嵌套在 中时,即使没有 JavaScript 也具有交互功能

    90620

    现代Web开发需要学习的15大技术

    框架,例如jQuery、Knockout等的爆发。...快进到现在,我发现现代web开发再一次将发生压倒性的改变。信息资讯的铺天盖地令人迷惑,尤其对于初学者而言。...并且有更多的工具可用于转换ES6代码为普通的旧的JavaScript代码,也就是ES5。 ? 我概括了一系列我们应该学习的编程语言/工具,以便于理解势不可挡和快速变化的现代web开发。...Bower 这是用于前端库本身的一个软件包管理工具。想添加Jquery到你的应用程序?和使用bower install jquery一样容易。 上述工具用于基本的前端开发已经足够。...这是一个伟大的库,你可能会在你的app中大量使用它,但是当你关注于性能影响时,它就完全没用了。 Angular 2 Angular 2是JavaScript中最流行的MVC框架之一的下一个版本。

    2.5K20

    「沙里淘金」精选浏览器端JavaScript库资源推荐

    jsfmt - 用于格式化,搜索和重写JavaScript。 jsinspect - 检测复制粘贴和结构相似的代码。 buddy.js - JavaScript的幻数检测。...url-pattern - 比url和其他字符串的正则表达式字符串匹配模式更容易。将字符串转换为数据或数据为字符串。 数字 Numeral-js - 用于格式化和操作数字的JavaScript库。...ocrad.js - 通过Emscripten在JavaScript中进行OCR。 机器学习 ConvNetJS - JavaScript中的深度学习。在您的浏览器中训练卷积神经网络(或普通的)。...jQuery-Tags-Input - 使用这个jQuery插件将一个简单的文本输入神奇地转换为一个很酷的标签列表。 vanilla-masker - 纯JavaScript掩码输入。...值得一读 你不懂JS - 可能是用现代JavaScript编写的最好的书,完全可以免费在线阅读,或者可以买来支持作者。

    5.9K20

    「首席架构师推荐」一系列很棒的的浏览器端JavaScript库资源

    jsfmt - 用于格式化,搜索和重写JavaScript。 jsinspect - 检测复制粘贴和结构相似的代码。 buddy.js - JavaScript的幻数检测。...url-pattern - 比url和其他字符串的正则表达式字符串匹配模式更容易。将字符串转换为数据或数据为字符串。 数字 Numeral-js - 用于格式化和操作数字的JavaScript库。...ocrad.js - 通过Emscripten在JavaScript中进行OCR。 机器学习 ConvNetJS - JavaScript中的深度学习。在您的浏览器中训练卷积神经网络(或普通的)。...jQuery-Tags-Input - 使用这个jQuery插件将一个简单的文本输入神奇地转换为一个很酷的标签列表。 vanilla-masker - 纯JavaScript掩码输入。...值得一读 你不懂JS - 可能是用现代JavaScript编写的最好的书,完全可以免费在线阅读,或者可以买来支持作者。

    6.7K21

    【前端架构】从 JQuery 到 React、Vue、Angular——前端框架的演变及其差异

    这是前端面试中必然会问到的问题 前端开发多年来一直在不断改进。从简单的静态页面到现在复杂的单页面应用程序,我们的工具变得越来越强大。现在,三大前端框架统治着前端开发,那么你知道这三个框架的区别吗?...但是 DOM API 比较繁琐,在不同的浏览器中存在兼容性问题。为了简化dom操作和兼容不同的浏览器,jQuery开始流行起来。在那个时候,jQuery可以说是前端开发者必学的技术。...JSX 代码和普通的 JavaScript 代码将在同一个执行上下文中执行,因此 JSX 可以很容易地与 TypeScript 结合。...每次组件应该更新后都会重新生成一个虚拟 DOM,React 会获取新虚拟 DOM 和旧虚拟 DOM 之间的差异。然后 React 决定是否以及如何更新真实的 DOM。...因为数据是在光纤节点上使用的,所以 API 被命名为 useXxx。 结论 三个前端框架各有优缺点。简单地比较谁更好是没有意义的。我们需要做的是为一个应用场景选择一个合适的解决方案。

    2.2K20

    TypeScript魔法堂:函数类型声明其实很复杂

    前言 江湖有传“动态类型一时爽,代码重构火葬场”,由于动态类型语言在开发时不受数据类型的约束,因此非常适合在项目原型阶段和初期进行快速迭代开发使用,这意味着项目未来将通过重写而非重构的方式进入成熟阶段。...而TypeScript的类型系统和编译时类型检查机制则非常适合用于构建企业级或不以重写实现迭代升级的应用系通。...= [[q00,q01],[q10,q11]] 而TypeScript中的函数重载并没有让我们定义得更轻松,可以理解为在原JavaScript实现的基础上添加类型声明信息,这样反而让定义变得复杂,但为了能更安全地调用却是值得的...x: JQuery, p: JQuery): HTMLElement // 和JavaScript一样需要定义一个Dispatch函数,用于实现调用重载函数的具体规则 function querySelector...函数类型兼容 函数类型兼容的条件: 形参列表个数小于等于目标函数类型的形参列表个数; 形参列表中形参类型的顺序和目标函数类型的形参列表一致,或形参类型为目标函数类型相应位置的参数类型的子类型; 函数返回值必须为目标函数类型返回值的子类型

    1.3K10

    2018前端最值得关注的技术有哪些?

    就在今年,谷歌也宣布:PWA将获得与安卓原生应用同等的待遇与权限。这就意味着以后的网页基本和APP将越发将近,那么关注度将会进一步的上升。...它被定义为“精简、加载时间短的格式和执行模型”,并且被设计为Web 多编程语言目标文件格式。...这意味着浏览器端的性能会得到极大提升,它也使得我们能够实现一个底层构建模块的集合,例如,强类型和块级作用域。...2017 JavaScript 现状报告:询问了23000名开发者,他们给出了这样的答案 2018 年最值得关注的 JavaScript 趋势 无论如何,框架这个我觉得没有最好,只有最适合。...这个项目是 Reactive-Extensions/RxJS(RxJS 4) 的重写,具有更好的性能、更好的模块性、更好的可调试调用堆栈,同时保持大部分向后兼容,只有一些破坏性的变更(breaking

    1.1K20
    领券