Tag: 性能

性能问题：存储对DOM元素的引用与使用选择器的引用

因此，在我的应用程序中，用户可以在某些div标签内创建一些内容，每个内容，或者我称之为“元素”的内容都有自己的对象。 目前我使用一个函数来计算元素放置在里面的原始div标签使用jquery选择器，但我想知道在性能方面，只要元素有一个div标签的引用就不是更好已创建，而不是以后计算？ 所以现在我使用这样的东西： $(‘.div[value=’+divID+’]’) 但是当我创建元素时，我可以将引用存储在元素中。 这对表现会更好吗？

jQuery委托对大型列表上的click事件的性能 – 如果动态添加更多元素，速度会降低吗？

我有一个像这样的项目的可视列表： http://jsfiddle.net/viatropos/XCe3T/1/ 在真正的应用程序中，我只加载了200个项目。 但问题是，即使只有200个项目， click事件也需要几秒钟来调用处理程序。 无论列表中有多少项， mouseover事件回调都会立即执行。 我的问题是，无论页面上有多少元素，委托方法是否应该同样快？ 我所做的就是： $(“body”).delegate(“a”, “click”, function(event) { console.log($(event.target).get(0)); return false; } 如果您转到上面的jsfiddle示例和Web检查器，并单击渲染结果中的链接，它将再添加200个元素。 注意你添加的元素越多，它得到的速度就越慢。 奇怪的是，如果你从6000个项目开始，委托/点击执行的速度比你从2000年开始要快得多，并且一次增加200个，直到达到6000。 您有什么想法，如何提高jQuery delegate方法对click事件的性能？ css会导致这种情况变慢（可能是太多样式还是未经优化的布局）？

加载微调器gif图像卡住了

我有一个6kb动画gif加载微调器。 当我在浏览器窗口中打开它时，旋转很好。 但是当它在我的网页上的ajax调用打开时，它就会卡住。 它准时出现，并且准时消失，但不会旋转。 有任何想法吗？ 这是jquery代码： $(‘#please-wait’) .css(“visibility”, “visible”)//.hide() .ajaxStart(function() { $(this).css(“visibility”, “visible”); }) .ajaxStop(function() { $(this).css(“visibility”, “hidden”); }); 要么 $(‘#please-wait’) .show() .ajaxStart(function() { $(this).show(); }) .ajaxStop(function() { $(this).hide(); }); 有任何想法吗？

基于每行输入动态推送数组

基于我的代码，我想将每行的输入推送到每个数组。 如果是row1，则应将第1行的所有输入值推送到数组a1 。 第二行的输入应该被推送到数组a2 ，依此类推。 这主要是为了我的代码的性能优化，因为我的真实代码行是20+，我试图像下面这样做，但没有成功。 我希望能够知道每一行的数据（用于validation目的） $(‘#check’).click(function(event){ event.preventdefault; var a1=[];var a2=[]; $(“[id^=row]”).find(“td input”).each(function(i) { a[i].push(this.value); }); $(‘#output’).html(‘Pushed arrays:a1: [‘+a1 +’] a2: [‘+a2+’]’); }); 1 1 Check Values

如何让这个jQuery比我的更快？

目前，我将此脚本用于一种“tab”系统。 单击一个选项卡时，它会隐藏所有其他选项卡。 他们都是div。 但是现在，我认为在选定的div加载之前它的消失速度不够快。 它最终会被选中并正在显示的div下方移动。 我不想要切换，因为正如你所看到的，我有5个标签，我想在它们被点击时打开它们各自的“_s”div。 淡出，淡出。 任何使淡出效果在淡入之前发生的方法，或者可能会延迟？ 我不知道如何在此脚本中添加延迟，或检查以确保div在新div淡入之前完全淡化。 我很感激任何帮助。 谢谢！ $(“#teach_one”).click(function() { $(“#teach_one_s”).fadeIn(“slow”); $(“#teach_two_s”).fadeOut(“fast”); $(“#teach_three_s”).fadeOut(“fast”); $(“#teach_four_s”).fadeOut(“fast”); $(“#teach_five_s”).fadeOut(“fast”); }); $(“#teach_two”).click(function () { $(“#teach_two_s”).fadeIn(“slow”); $(“#teach_one_s”).fadeOut(“fast”); $(“#teach_three_s”).fadeOut(“fast”); $(“#teach_four_s”).fadeOut(“fast”); $(“#teach_five_s”).fadeOut(“fast”); }); $(“#teach_three”).click(function () { $(“#teach_three_s”).fadeIn(“slow”); $(“#teach_one_s”).fadeOut(“fast”); $(“#teach_two_s”).fadeOut(“fast”); $(“#teach_four_s”).fadeOut(“fast”); $(“#teach_five_s”).fadeOut(“fast”); }); $(“#teach_four”).click(function () { $(“#teach_four_s”).fadeIn(“slow”); $(“#teach_one_s”).fadeOut(“fast”); $(“#teach_two_s”).fadeOut(“fast”); $(“#teach_three_s”).fadeOut(“fast”); $(“#teach_five_s”).fadeOut(“fast”); }); $(“#teach_five”).click(function () { $(“#teach_five_s”).fadeIn(“slow”); $(“#teach_one_s”).fadeOut(“fast”); $(“#teach_two_s”).fadeOut(“fast”); $(“#teach_three_s”).fadeOut(“fast”); $(“#teach_four_s”).fadeOut(“fast”); }); […]

JQGrid重绘速度很慢

大家好！ 所以我已经在我的应用程序中使用了JQGrid一段时间了，并且在我开始优化之前，网格的速度并没有真正困扰我。 如果发现即使我有一个小网格（每页20个项目），hover突出显示速度很慢，如果网格恰好需要页面上的滚动条，则页面的滚动速度非常慢。 我尝试了异步post和loadonce：true，它们都画得很慢。 我正在使用jquery.ui.theme css。 我已经一起删除了分页，因此网格绝对只包含屏幕上的20个项目，而且hover的绘图仍然很慢。 为了确保它在我的页面上没有任何其他东西我将网格的显示设置为无，并且页面像往常一样快速运行 – 就像我怀疑的那样。 使用IE8调试器，我使用分析器来测量我的javascript和html的速度，这些速度非常快 – 所以它绝对是屏幕上网格的绘制。 我很感激任何和所有帮助或建议，以提高性能。 我会附上我的网格定义（它非常大），万一你认为它可能是那里的东西： $(“#tblVariables”).jqGrid({ url: ‘/StudyAdmin/GetVariable.aspx?FilterType=’ + Filter + ‘&SelectedFolder=’ + SelectedFolder + ‘&SelectedGroup=’ + SelectedGroup, datatype: “json”, mtype: “POST”, colNames: [‘Variable Name’, ‘Hidden Original Text’, ‘Original Text’, ‘Label’, ‘Hidden’, ‘Groups’, ‘HiddenGroups’], colModel: [ { name: ‘VarName’, index: ‘VarName’, editable: false }, { […]

在jQuery中，如何有效地添加大量元素？

我目前有一个真实的发电机草图。 虽然它工作正常，但它很慢。 我使用jQuery添加到 每个布尔值组合。 对于每个值， 元素由jQuery创建，然后添加到 。 而且，我正在使用jQuery UI来获得漂亮的按钮而不是单选按钮。 在我发布的代码提取中， table是一个包含每个布尔组合的数组。 也许我的代码有点不可思议，但它基本上归结为4个布尔变量（16种可能性），96个 元素是在添加了类和data属性集的情况下创建的。 在第二部分中，创建三组三个单选按钮并将其转换为jQuery UI按钮组。 使用计时器我发现在所有东西都填满之前需要大约0.4秒。 没有那么大的交易，但它肯定是显而易见的，并没有对用户产生积极的影响，因为每次他输入一个不同的布尔公式，它需要半秒钟加载。 $table = $(‘#table’); $.each(table, function(k, v) { $tr = $(”).addClass(‘res’).data(‘number’, k); $.each(v[0], function(k2, v2) { $td = $(”).text(v2).addClass(v2 ? ‘green notresult’ : ‘red notresult’); for(var i = 0; i < 4; i++) { $td.data(i, i === k2); } […]

.find（）比基本后代选择方法快吗？

在Paul Irish的博客中提到的幻灯片30： $(‘#container’).find(‘div.robotarm’)比$(‘#container div.robotarm’)快 这是真的？

具有ID的jQuery选择器的性能

我知道在jQuery中如果我们使用ID来选择元素，那就非常有效。我对这个选择器有一个疑问： 请考虑这3个选择器： $(‘#MyElement’) $(‘#Mytbl #MyElement’) $(‘#Mytbl .MyClass’) 哪一个更快，为什么？我如何检查在jQuery中选择我的元素所用的时间？

如果该函数被多次调用，那么在函数中缓存选择器会更高效吗？

好的，我想我知道答案，希望确认。 所以我有一个只使用过一次的选择器，但是它被用在一个多次调用的函数中。 从性能的角度来看，因为每次调用函数时都会重新搜索该选择器，所以缓存选择器可能（尽管稍微好一点）？ 换句话说，下面…… function testFunction() { alert($(“#input”).val()) } $(“#a”).click(function() { testFunction() }) $(“#b”).click(function() { testFunction() }) $(“#c”).click(function() { testFunction() }) ……不如下面的表现 input = $(“#input”) function testFunction() { alert(input.val()) } $(“#a”).click(function() { testFunction() }) $(“#b”).click(function() { testFunction() }) $(“#c”).click(function() { testFunction() })