删除不需要的 jQuery 函数

Posted

技术标签:

【中文标题】删除不需要的 jQuery 函数【英文标题】:Remove unwanted jQuery functions 【发布时间】:2011-04-03 01:08:03 【问题描述】:

直升机,

像 jQuery 这样的库是完全加载的,并带有许多我们可能不会在脚本中使用的函数。我想知道是否有办法说阅读我的脚本找出我正在使用的所有 jQuery 函数及其依赖项,然后从 jQuery 库中删除剩余的函数。这几乎可以应用于任何库,并不是真正的 jQuery 特定问题。

请告诉我您对如何实现这一目标的想法。我知道如果说我在代码中添加了一个新函数并且该函数在 jQuery 中不存在,那么以后可能会很头疼。但我愿意承担这个风险。

【问题讨论】:

天哪,请问为什么? 是的,你可以。我们有在数千个站点上运行的软件,并且 jQuery 代码与我们的代码一起添加。但随着我们向前推进,我们希望删除不必要的部分(因为我们几乎不使用任何核心 jQuery 函数,除了少数几个)。我们一直在使用 CDN 加载 jQuery,但我们的客户不喜欢它。他们想自己托管一切。不要问我为什么,因为我不知道。 如果您想出一个合理的缓存策略,那么您可以在本地提供整个 jQuery 文件,但是缓存它,这样您就不必担心下载/附加 HTTP 请求的成本。 Caching Tutorial for Web Authors and Webmasters 是一个很好的资源。 【参考方案1】:

jQuery 不像 Prototype 和 MooTools 那样提供打包下载,并且自己构建它们可能会很困难,因为您必须手动整理所有依赖项 - 并且为每个新的 jQuery 版本一次又一次地整理。

此外,目前整个库的 gzip 大小为 24kb,我认为它的大小并不重要。该库仅加载一次 - 如果您从 CDN 加载它,它会被集中缓存,即使对于慢速调制解调器连接也是可行的。

【讨论】:

【参考方案2】:

这是个坏主意。

首先,您可能想要删除 InArray,因为您可以使用基本的 javascript 替代方案,但您保留的其他方法可能依赖于 InArray。

jQueries 方法基本上使用彼此来完成任务,这是它们保持包大小减小的方法之一。

如果你真的想这样做,我会这样做:

$M = MyjQuery = function(element,context)

    this.fn = 
    this.extend = function(base,new)
    
        //Extend them here
    

从头开始!

【讨论】:

【参考方案3】:

即使我不知道为什么,你也可以这样做:

转到http://github.com/jquery/jquery/blob/master/Makefile

这是来自 jQuery 库的 makefile。 jQuery 被分成几个模块,这些模块放在一起。那些base files 是在依赖项中排序的,所以你可能会剥离你不使用的模块......

我不能 100% 确定这是否有效,我自己从未尝试过,但你可以试一试。

【讨论】:

即使在开发阶段分成几个文件并不意味着它们能够独立运行,只是 jquery 团队组织了那里的工作人员,例如,数据团队将致力于data.js 等等,然后他们会有一群测试人员来测试新方法/功能。所以是的,它只是一个设计过程——不过是很好的参考:) @RobertPitt:我不知道,对我来说它看起来像一个依赖树。顺序是有道理的。所以我真的相信你可以删除“维度”。 尺寸可能是可能的,因为其他实体,如csselem.offsetWidth 一起工作,但删除像 css 这样的子包会导致巨大的麻烦,因为它在整个库中使用! - 更不用说添加的新库,它们也会受到影响:(【参考方案4】:

如果您的 JavaScript 在本质上不是高度动态的,那么您可以试一试Closure Compiler。

所有您的 JavaScript 收集到一个地方(包括 jQuery、插件、其他库等所有内容),并使用高级编译选项将其提供给 gcc。

这将删除所有可能会破坏您的代码的未使用函数。如果您有测试用例,或者您的 JS 小到足以手动完全测试,我只会推荐这个。

编译器进行的优化的一个简单示例是:

function hello(name) 
    alert('Hello, ' + name);


hello();

将减少到:

alert("Hello, undefined");

因为这就是基本上正在发生的一切。

【讨论】:

你会如何使用它?将 JQuery 和其他 JS 中的所有 JS 代码全部复制并删除未使用的函数?【参考方案5】:

你可以使用闭包编译器:

Java version Online version Documentation

它似乎做你想做的事。

【讨论】:

你会如何使用它?将 JQuery 和其他 JS 中的所有 JS 代码全部复制并删除未使用的函数?【参考方案6】:

jQuery 确实提供了一个精简的构建,它不包括 ajax 和效果模块: https://jquery.com/download/

附带说明一下,jQuery 的这个页面让您能够准确地选择要包含在包中的内容,但对于 UI 项目。认为这将是有用的指示:

https://jqueryui.com/download/

示例:

【讨论】:

以上是关于删除不需要的 jQuery 函数的主要内容,如果未能解决你的问题,请参考以下文章

如果在 div 中找到两个类,我想删除类,使用 jQuery 函数我尝试过但不工作

需要一个不工作的 JQuery 函数

如何从函数中删除jquery过滤器

[ jquery 方法 toggleClass(class|fn[,sw]) ] 此方法如果存在(不存在)就删除(添加)一个类

jQuery.prop() 函数详解

Javascript/jQuery onload 函数删除/添加