Tag: 性能

jQuery / JavaScript：当tab变为非活动状态时，我的递归setTimeout函数会加速: 在我正在构建的jQuery幻灯片插件中，我有一个奇怪的小难题。这没什么特别的，我迄今为止编写的代码工作得很好但是我注意到当我离开网站运行并切换到新选项卡并继续在另一个选项卡中浏览网页（在我的情况下是Chrome for Mac）时我回到我的网站， setTimeout调用似乎加速了，而不是等待计时器完成火灾事件，它不断发射。这是我的（简化）代码： var timer; var counter; var slides; // collection of all targeted slides. // animate to the next slide function nextSlide() { // stop timer methods.stopTimer(); // increase counter counter++; if ( counter > slides.length-1 ) { counter = 0; } // if counter is greater than the amount of […]

如何使用叠加效果高亮显示鼠标光标下的元素？: 仍然试图回答这个问题，我想我终于找到了一个解决方案，但它运行得太慢了。 var $div = $(”) .css({ ‘border’: ‘1px solid red’, ‘position’: ‘absolute’, ‘z-index’: ‘65535’ }) .appendTo(‘body’); $(‘body *’).live(‘mousemove’, function(e) { var topElement = null; $(‘body *’).each(function() { if(this == $div[0]) return true; var $elem = $(this); var pos = $elem.offset(); var width = $elem.width(); var height = $elem.height(); if(e.pageX > pos.left && e.pageY > […]

jQuery选择器与局部变量的性能: 当我需要在函数范围内多次访问jQuery选择器的结果时，我建议运行一次选择器并将其分配给局部变量吗？请原谅我这里的陈词滥调，但我认为这说明了这个问题。那么，这段代码的执行速度会更快： var execute = function(){ var element = $(‘.myElement’); element.css(‘color’,’green’); element.attr(‘title’,’My Element’); element.click(function(){ console.log(‘clicked’); }); } 比这个代码： var execute = function(){ $(‘.myElement’).css(‘color’,’green’); $(‘.myElement’).attr(‘title’,’My Element’); $(‘.myElement’).click(function(){ console.log(‘clicked’); }); } 如果没有区别，有谁可以解释原因？ jQuery是否在选择后缓存元素，以便后续的选择器不必再费心搜索dom了？

具有上下文的jQuery选择器的性能: 我正在阅读Brandon Aaron的这篇文章，关于jquery上下文如何帮助。所以我想做一个自己的测试。所以这就是我所做的。在前面创建的“#context”中创建了一个id =“context”的DIV和嵌套的DIV，id =“holder”。创建了深度为18的嵌套DIV，并将附加到其中，从而生成20个嵌套DIV 现在我测试了通过以下选择器访问“#holder”所花费的时间：一个。 $(“#holder”) // no context 湾 $(“#holder”, “#context”) // with “#context” selector string C。 $(“#holder”, $(“#context”)) // sending jquery object each time with selector “#context” d。 $(“#holder”, $context) // where, var $context = $(“#context”). Caching jquery obj 记录了每次访问X = 1000次并开始和结束时间差的情况。我发现所花时间：案例（a）是最不一致的28-32毫秒[jquery-1.3.2] 情况（b）+（c）的最高时间分别为60-65毫秒和70-75毫秒情况（d）有40-50毫秒，有1或2个加标值。这种基本检查有效吗？ […]

Javascript（jQuery）性能测量和最佳实践（不加载时间）: 我会马上说这个问题不是关于加载时间; 我了解YSlow，Firebug分析器，以及googlage显示的有关页面组件加载时间的最佳实践和工具。我想问一下，在改进实际用户体验的过程中，有哪些好的分析工具或库或附加组件可用于测量Javascript（特别是jQuery）的实际执行情况。例如，在屏幕上测量从点击到可见结果的时间，或者帮助确定基于jQuery的hover效果响应速度慢的原因。我们注意到当页面/ DOM增长相对较大时（比如，70kb到150kb的HTML，不包括外部CSS，JS和图像），和/或具有非常深的嵌套（从到最深的标签的14-25级别）），jQuery事件触发得更慢，或者整个JS用户体验变得缓慢。我也用Google搜索并了解了选择器的最佳实践（例如，通过id选择比选择类更快），我将实现这些实践。但是，一旦所有jQuery完全加载，并且所有事件都挂起，我们仍然需要改进实际的事件触发和执行。我已经实现了一些事件委托，并且我确实感觉到拥有更少的钩子DOM元素会让事情稍好一点，但整体体验仍需要大页面的改进。我应该提一下，由于该站点是AJAX很重（通过AJAX加载批次而不是初始HTTP命中），我们正在大量使用livequery而不是普通的jQuery事件挂钩。我还要提一下，我们稍微关注IE（7+）的性能，但也需要良好的Firefox性能。当我开发和进行更改时，我认为我需要一种方法来测量变化前后的速度，因此我可以具体说明变更是否能改善任何事情。任何提示，工具，库，博客文章，URL？

使用Javascript或jQuery在第一列快速对表进行排序: 我有一个从FullCalendar动态填充的表。问题是FullCalendar不关心它的原始顺序。该表如下所示： Date hours … 1 … 3 … 2 … 4 … 每行的第一行包含表应该排序的数字。我有这个代码来排序它： var rows = $(‘#caltbl > tbody’).children(‘tr’).detach(); for (var counter = 1; counter tbody:last’).append($(this)); } }); } 这在Firefox中运行良好，但在Internet Explorer中引起了我的一个主要问题，因为有超过500个项目并且它挂起。我可以添加一个setTimeout但这不能解决真正的问题。排序很慢。什么是更快的排序方式？而不是必须从 html开始，因为我说它被动态填充，所以我有一个包含html的Array 。每件 1 1项（未分类）