通过缓存选择器结果来优化基于 JQuery 的动画

Question

我制作了一个基于以下jQuery函数的动画：hide（），show（），animate（）。

这个动画消耗了很多CPU（像Flash一样的CPU使用率），Chrome告诉我（通过CSS选择器分析工具）我有很多类似的CSS选择器用法（CSS选择器配置文件）。

这些选择器是否仅由渲染引擎使用？这是否还包括使用 $（） 时的 jQuery 节点搜索（我假设它是由 hide（）、show（） 或 animate（）） 调用的？

如果对第二个问题是肯定的，我如何覆盖此函数以缓存某个节点？（通过硬编码一些选择器，其结果在我的动画逻辑中不会改变）。

编辑：我正在实现帧之间的过渡，每个帧都在其背景上作为Ken Burns效果

EDIT2 ：这是一个jQuery插件，在可能的情况下使用CSS3进行动画 https://github.com/benbarnett/jQuery-Animate-Enhanced

Answer 1

如果您使用如下代码执行大量 jquery 动画：

$('div.myclass').show();
 ...
$('div.myclass').hide();
....
$('div.myclass').toggle();

你可能想看看链接你的jquery选择：

$('div.myclass').show().addClass('sdf').children('li').slideToggle()

或将选择器分配给变量并重用该变量

 var $ele = $('div.myclass');
 $ele.show();
 ...
$ele.hide();
....
$ele.toggle();