文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布

从GitHub.com放弃使用jQuery说起

jQuery 我们最近完成了一项里程碑式的工作，去除了GitHub.com 网站前端代码对 jQuery 的依赖。...这标志着一个长达数年的与 jQuery 逐渐剥离的过渡工作的结束，我们现在已经能够完全删除该库。...在这篇文章中，我们将解释一下我们最初是如何依赖 jQuery 的，又是如何意识到何时不再需要它的，并指出——我们能够使用标准浏览器 API 实现我们需要的一切（而不是用另一个库或框架替换它）。...与此同时，我们也一直在寻找并排除技术债务，有时技术债务会随着依赖项的增多而增长，这些依赖项在一开始的时候给我们带来价值，但是随着时间推移和技术演变，价值会逐渐消失。...30kb的依赖，从而加快页面加载速度和 JavaScript 执行速度。

1.3K20

Github 移除 JQuery 的过程

/ 我们最近完成了一个里程碑，我们可以将jQuery作为GitHub.com前端代码的依赖项删除。...在这篇文章中，我们将解释一点我们最初是如何开始依赖jQuery的，我们是如何意识到不再需要jQuery的，并指出我们没有用另一个库或框架替换它，而是能够使用标准的浏览器api实现所需的一切。...为什么jQuery在早期就有意义 GitHub.com在2007年底引入jQuery 1.2.1作为依赖项。从某种意义上讲，那是谷歌发布其Chrome浏览器第一个版本的前一年。...最重要的是，使用jQuery在一个浏览器中构建的JavaScript特性通常也可以在其他浏览器中工作。...总之，与jQuery分离意味着我们可以更多地依赖web标准，让mdnweb文档成为我们的前端开发人员事实上的默认文档，在未来维护更具弹性的代码，并最终从打包的包中删除30kb的依赖项，从而加快页面加载时间和

2.9K10
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    Wijmo 更优美的jQuery UI部件集：发现 Wijmo

    如何引用Wijmo 你可以通过使用内容传送网络（CDN）轻松的将Wijmo加载到你的web页面。CDN使得使用外部库以及部署到最终用户的过程变得更加方便快捷。CDN是遍布世界各地的计算机网络。...这些文件已经被精简并压缩，换句话说，所有不必要的字符都已经被删除以便网页加载的速度更快。你也许同时注意到，没有到独立的.js文件的引用。...在此示例工程，你将学习添加一个Wijmo部件，wijcalendar，到你的工程，然后定制一些选项。 第一部是创建一个HTML页面并向标记内部添加工程依赖项的链接。...你所要做的只是为每一个工程链接到内容传送网络（CDN）： 注意：: 请从CDN引用依赖项的最新版本自http://www.wijmo.com/downloads/cdn。 的工程，你将发现一个功能完整的日历部件，如下图所示： 但是如果该工程希望制定今天之前以及随后的几个月的日期不显示在日历上，应当如何做呢？显然删除它们不是一个明智选择。

    3.8K90

    达观数据基于RequireJS的前端模块化设计

    这种做法的好处是，随时都可以调用外部模块而不用预定义，简单方便。但与此同时，在代码执行期间，需要不断的遍历工程多次来查找require对应模块的位置，这对代码的整体性能有所牺牲。...AMD是以requirejs为代表的模块化标准，其特点是推崇依赖前置 ? AMD模式下模块调用方式 如图，在进入模块时，模块已经知道了依赖关系，只有在所有的依赖项加载完成时，模块内部代码才会被执行。...这种写法的优点是，性能相比CMD要好，在模块运行时已经知道需要加载哪些模块，不再需要对整段代码进行遍历查找依赖。...顺便一提，我们在requirejs的官方文档中也会发现和CMD用法相同的API，但requirejs官方还是推荐使用AMD的方式来建立依赖关系。...这样一个项目中的依赖部分就算完成了，之后在每个模块定义的时候，只要遵循requirejs模块定义语法，就可以实现web前端的模块化加载。

    1K50

    jQuery 对AMD的支持（Require.js中如何使用jQuery）

    AMD 模块格式本身是一个关于如何定义模块的提案，在这种定义下模块和依赖项都能够异步地进行加载。...RequireJS RequireJS是一个工具库，主要用于客户端的模块管理。它可以让客户端的代码分成一个个模块，实现异步或动态加载，从而提高代码的性能和可维护性。它的模块管理遵守AMD规范。...() { return jQuery; } ); } 其工作的原理是，所使用的脚本加载器通过指定一个属性，即 define.amd.jQuery 为 true，来标明自己可以支持多个 jQuery 版本...如果有兴趣了解特定的实现细节的话，我们可以将 jQuery 注册为一个具名模块，因为可能会有这样的风险，即它可能被与其它使用了 AMD 的 define() 方法的文件拼合在一起，而没有使用一个合适的、...，并且感觉jQuery UI的依赖关系加载就可以了。

    5K40

    时隔一年多jQuery发布3.6.1新版本，你还在用JQ吗？

    以下是 jQuery 3.6.1 的一些改进：基础设施改进在这个版本中团队做了很多工作来更新项目的一些测试和构建基础设施，包括将 CI 从 Travis CI 迁移到 GitHub Actions，在...附加带有 HTML 注释的脚本团队在正则表达式中发现了一个问题，即在附加脚本时从脚本中去除 HTML 注释，最终在某些边缘情况下删除了部分可执行脚本。...幸运的是更多地依赖浏览器可以成为解决问题的方法，但团队仍然需要在 3.x 分支中为 IE 去除 CDATA 部分。这将在 4.0 中删除。...jQuery.trim 的性能提升虽然jQuery.trim已在主分支上删除以支持原生的String#trim（准备下一个主要版本上线），但对于分支支持的某些浏览器（例如 Android 4.0）在 3...最后我想用去年 jQuery 3.6.0 发布时底下寥寥数个评论中的一句话来作为结尾：非常感谢您为维护和改进 jQuery 所做的所有辛勤工作，因为我们中的许多人仍然依赖 jQuery 来处理大多数生产中运行的项目

    2.6K20

    Vue3项目中集成科学计算器的实现方案

    Vue3项目中集成科学计算器的实现方案前言在开发在线工具平台时,科学计算器是核心功能之一。...本文介绍如何在Vue3项目中优雅地集成一个功能完善的科学计算器,重点讨论外部JavaScript引擎的加载策略和Vue组件的封装方案。...-2.2.4.min.js#jQuery依赖public/js/calculator-original.js#计算引擎核心实现1.动态脚本加载策略关键问题:计算器引擎依赖jQuery,必须确保正确的加载顺序...动态添加的script标签和全局变量方案:onUnmounted钩子清理资源总结本文介绍了在Vue3项目中集成科学计算器的完整方案,核心要点:架构设计:UI与计算引擎分离,通过桥接通信加载策略:链式加载保证依赖顺序...,添加重试机制命名冲突:使用引用保存原始函数,避免全局污染生命周期:正确管理资源加载和清理通过这种方式,我们成功将原生JavaScript计算器引擎集成到现代Vue3项目中,保持了代码的可维护性和扩展性

    13610

    .Net 高效开发之不可错过的实用工具 工欲善其事，必先利其器，没有好的工具，怎么能高效的开发出高质量的代码呢？本文为各ASP.NET 开发者介绍一些高效实用的工具，涉及SQL 管理，VS插件，内

    在远程调试期间，VS 在调试主机运行，MSVSMON 在远程机器中运行。 WIX toolset: 可以将XML 源代码文件编译成Windows 安装包。...MSMQ QueueExplorer 3.4: 提供消息操作功能，如复制，删除，移动消息，保存和加载，强压测试，浏览编辑等 LINQ LINQ Pad: LINQPad 是一个轻量级工具...Internals Viewer for SQL Server: Internals Viewer 用来在SQL Server 的存储引擎中的查找工具，以及获取数据在物理层是如何分配，组织和存储的。...TreeTrim: TreeTrim 是调整代码的工具，能够删除一些无效的debug文件和临时文件等。 BrowserStack: 支持跨浏览器测试的工具。...BugShooting: 屏幕截图软件，能够铺货和附加工作项，bug，问题跟踪项等。 Postman: REST 客户端，能够发送http请求，分析REST 应用程序发出的响应。

    4.8K60

    2022 Web 年鉴 — JavaScript

    目前观察到的所有移动端页面中，只有 0.34% 的页面使用动态 import() 而PC端只有 0.41% ，这一比例低得惊人。这是一个在启动期间交付更少代码的优化手段。...如果你有大量工作可以在不直接访问 DOM 的情况下完成，那么使用 Web Worker 是一个不错的选择。...开发者在这方面有很多工作要做，我们希望看到这个数字随着时间的推移而下降，因为 JavaScript 语言的演变已经相对稳定了。 JavaScript 是如何使用的？.../ jQuery 仍然是当今网络上使用最多的库，这没什么大惊小怪的。...鉴于 Grid 或 Flexbox 等新兴的 CSS 布局模式的发展，我们可能会看到 Bootstrap 的使用随着时间的推移而减少，或者开发者会更新他们的 Bootstrap 依赖项以发布更安全的网站

    98220

    【Hybrid开发高级系列】WebPack模块化专题

    文件document.write("看看如何让它工作！")...了解过code splittiog的同学便会知道，我们有些代码在加载页面的时候不会被使用时，使用code splitting，可以实现将这部分不会使用的代码分离出去，独立成一个单独的文件，实现按需加载。...现在，我们在开发期间就知道是否错误地引用了模板，而不会在构建时才发现引用路径偏移了一个目录级别。         ...ProvidePlugin 是一个将出现的全局变量替换为显示导出的已加载关联模块的插件，它对我们的改进工作不可或缺。...SPA应用来处理的，这就意味着我们会根据前端路由来动态加载相应子页面，使用官方的vue-router是很容易实现的，比如我们在question/index.js中可以如下写： router.map({

    93850

    jQuery已“死”？为清除技术债，我们删掉了前端所有jQuery依赖

    作者 | 褚杏娟 近期，英国公共部门信息网站 GOV.UK 前端开发主管 Matt Hobbs 宣布该公司删除了 jQuery 作为所有前端应用程序的依赖项，这意味着“在所有 13 个 FE 应用程序中...根据 Matt 说法，删除 jQuery 的本意是清理技术债。“它最初是为了支持浏览器而存在的，但随着时间的推移，情况发生了变化，所以 bits 可以被删除。...JQuery 提供了一个可以在大多数浏览器上工作的 API，这在当时使用 JavaScript 是很难实现的。...有网友评论道，“我个人发现普通的 JS API 和 fetch 甚至比 jQuery 的东西更干净。人们仍然出于习惯使用 jQuery，是因为摆脱它需要做很多工作。” jQuery 已“死”？...但随着 GitHub 成长为一家拥有数百名工程师的公司，jQuery 带来的价值已经随着时间的推移而下降。比如技术债会随着依赖项的增多而增长，给企业带来很大的维护成本。

    1.2K30

    几个常见的前端模块管理器

    模块化结构已经成为网站开发的主流。 制作网站的主要工作，不再是自己编写各种功能，而是如何将各种不同的模块组合在一起。 ?...为了解决这个问题，前端的模块管理器（package management）应运而生。它可以轻松管理各种JavaScript脚本的依赖关系，自动加载各个模块，使得网页结构清晰合理。...Require.js的问题在于各种参数设置过于繁琐，不容易学习，很难完全掌握。而且，实际应用中，往往还需要在服务器端，将所有模块合并后，再统一加载，这多出了很多工作量。 ?...我只是想用最简单的例子，说明它们是干什么用的，使得读者有一个大致的印象，知道某一种工作有特定的工具可以完成。详细的用法，还需要参考它们各自的文档。 Bower ?...$ bower uninstall jquery 注意，默认情况下，会连所依赖的模块一起卸载。比如，如果卸载jquery-ui，会连jquery一起卸载，除非还有别的模块依赖jquery。

    1K30

    前端模块管理器简介

    模块化结构已经成为网站开发的主流。 制作网站的主要工作，不再是自己编写各种功能，而是如何将各种不同的模块组合在一起。...为了解决这个问题，前端的模块管理器（package management）应运而生。它可以轻松管理各种JavaScript脚本的依赖关系，自动加载各个模块，使得网页结构清晰合理。...Require.js的问题在于各种参数设置过于繁琐，不容易学习，很难完全掌握。而且，实际应用中，往往还需要在服务器端，将所有模块合并后，再统一加载，这多出了很多工作量。...我只是想用最简单的例子，说明它们是干什么用的，使得读者有一个大致的印象，知道某一种工作有特定的工具可以完成。详细的用法，还需要参考它们各自的文档。...$ bower uninstall jquery 注意，默认情况下，会连所依赖的模块一起卸载。比如，如果卸载jquery-ui，会连jquery一起卸载，除非还有别的模块依赖jquery。

    1.4K80

    为Vue2集成UIkit

    这是个比拼开发速度的年代，我们已经没有时间重复发明轮子了，最正确的选择是使用界面框架，例如Bootstrap、UIkit、Foundation等来代替这种大量的重复性极强的界面样式开发工作。...' 这样写就违反了一个配置约定，我们不应该将“库”或“依赖包”以全路径方式引入到代码文件中，而应该用webpack的resolve配置项，用别名来代替全路径。..., () => { // 这里编写对数据进行删除的代码 }) } } 上述的confirm方法有一个明显的弱点，就是在回调时this上下文会指向window而不是Vue实例本身，这样的话对于编码的使用体验就很差了...估计是UIkit在生成加载代码时变量的映射与初始化顺序出现问题了。...这个插件是用于JS代码加载后在window上注册全局变量的一个webpack插件，加入了以上的配置后程序就能正常运行了。

    1.7K20

    我们如何使用 Webpack 将启动时间减少 80%

    果然，在设置好 clinic 并进行了几次测试运行之后，我们生成了一些火焰图（火焰图是一种显示每个方法和依赖项需要多少执行（CPU）时间的方式），它们揭示了问题。...消除这种依赖需要大量的工作，并可能通过限制我们的工具集而导致 DX 的进一步退化。所以，我们只有一个选择：删除 Typescript。 当然，不是完全删除 Typescript，只是在生产环境。...Typescript 在设计上不会修改依赖项的导入路径，带有模块的 Node.js 对文件名应该如何表示有严格的要求。...注意：所有这些依赖项只能在开发和构建期间使用，不需要在生产构建中加载它们！...我们从运行时的依赖项中删除了 Typescript，所以我们在最终的生产制品中不再需要它，这样我们完全摆脱了这些依赖！

    1.8K20

    Day01_webpack

    别人使用你的包必须下载的依赖, 比如yarn add jquery * devDependencies 开发你的包需要依赖的包, 比如yarn add webpack webpack-cli -..., 它有什么作用 知道yarn的使用过程, 自定义命令, 下载删除包 有了webpack让模块化开发前端项目成为了可能, 底层需要node支持 对webpack各种配置项了解 入口/出口...完成模块编译：在经过第4步使用 Loader 翻译完所有模块后，得到了每个模块被翻译后的最终内容以及它们之间的依赖关系 6....类型为数组，每一项都是一个Object，里面描述了对于什么类型的文件（test），使用什么加载(loader)和使用的参数（options） ​ Plugin在plugins中单独配置。...类型为数组，每一项是一个plugin的实例，参数都通过构造函数传入。

    2.1K20

    jQuery.noConflict() 深度剖析与应用指南

    第一步的直观含义是看清楚这行代码本身的结构。这里出现了一个对象 jQuery, 这是当页面加载了 jQuery 库之后所具备的全局对象。...在概括以上解释之前, 可以给出一个真实世界的案例, 来说明为什么 jQuery.noConflict() 在实际项目中是如此重要。...答案是, 如果只依赖一个现代化的构建系统(比如 Webpack 或 Vite) 并采用模块化的方式去组织代码, 那么命名冲突确实比过去少了很多。...作为一项简洁但关键的功能, 它让 jQuery 能够与其他库共存于同一个页面, 也给项目的开发带来了灵活性。...就像在团队协作里如何尊重并容纳彼此的工作, jQuery 通过 noConflict 这个方法告诉我们, 库与库之间也可以大度且从容地进行共存, 帮助开发者在复杂环境里优雅地应对命名冲突与版本兼容等诸多挑战

    26300

    Require.Js 前端模块化

    AMD : Async Module Definition 异步模块定义 require.js 依赖前置：在一开始就将所有的依赖项全部加载 CMD : Common Module Definition...通用模块定义 sea.js 依赖延迟：在需要的时候才去加载依赖项 模块化的实现（require.js） 下载后，把它放在目录下面，就可以加载了 　在定义模块的时候，需要使用requirejs提供的函数define() 进行定义 语法： define("模块名称", ["模块的依赖项"], function(){ 模块中所有的代码全都放到这个函数中...//模块加载成功之后的回调函数 //模块的加载是异步的，在模块加载完成之后，才能使用模块的相关功能 }) 模块的注意项 定义模块的时候，有导出项的情况 如果有导出项，只需要把导出项通过...，这个模块内部可能会使用到其他模块的内容，这些其他模块就可以称作当前模块的依赖项 //5-模块的 依赖项 define(['.

    4.3K40
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号

      领券