Tag: 优化

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？