Javascript 大规模Dom操作

Javascript 大规模Dom操作,javascript,jquery,ajax,dom,Javascript,Jquery,Ajax,Dom,我想知道是否有人可以提供一些安全指南,说明在不冻结浏览器的情况下使用jquery可以进行的最大级别的dom操作 也是海量DOM操作的最佳方法 基本上,在任何时候,我都可以处理多达40kli的列表 我真正做的就是展示一个,隐藏另一个 下面是我的问题 理论上,我一次可以操作多少个li而不会使浏览器崩溃? 我应该如何与李氏合作? 作为单个对象进行操作(ul级别) 在第一个列表中的每个li上循环删除它们,然后循环插入每个新li 在李的大块上循环(如果是的话,一次有多大10、100、1000、1000

我想知道是否有人可以提供一些安全指南,说明在不冻结浏览器的情况下使用jquery可以进行的最大级别的dom操作

也是海量DOM操作的最佳方法

基本上,在任何时候,我都可以处理多达40k
li
的列表

我真正做的就是展示一个,隐藏另一个

下面是我的问题

  • 理论上,我一次可以操作多少个li而不会使浏览器崩溃?
  • 我应该如何与李氏合作?
    • 作为单个对象进行操作(ul级别)
    • 在第一个列表中的每个li上循环删除它们,然后循环插入每个新li
    • 在李的大块上循环(如果是的话,一次有多大10、100、1000、10000?)
  • 我应该如何获取数据?(json格式)
    • 在一次ajax调用中获取整个列表的数据(价值40k li)
    • 在页面创建时插入每个列表的数据(最多20个列表=800000 li
    • 执行几个ajax调用来获取数据(如果是的话,一次有多大10、100、1000、10000?)

如果你真的想操纵这么多,那么你可能应该采取类似的措施

作为一次应该使用多少的答案,你可以建立一个校准,查看最后一组完成的速度,并相应地使用更多/更少。这可以让你在从桌面chrome到移动IE的所有方面都能使用


ajax调用也是如此,使其能够根据网络速度提升。

如果您真的想处理这么多调用,那么您可能应该采用类似的方法

作为一次应该使用多少的答案,你可以建立一个校准,查看最后一组完成的速度,并相应地使用更多/更少。这可以让你在从桌面chrome到移动IE的所有方面都能使用


ajax调用也是如此,使其能够根据网络速度进行升级。

作为警告:这非常依赖于您的计算机性能。坦率地说,DOM操作中任何接近100个元素的操作都会变得有点愚蠢和昂贵。也就是说:

1) 取决于你的系统,我的旧系统最高可达30个,而我的新系统在我破坏东西之前最高可达120个

2) 在尽可能大的层面上与他们合作。操纵一个包含一堆li的ul要比操纵一堆li快得多。使用jQuery并将对象存储在一个变量中(这样您就不会每次使用DOM时都查询它),以提高性能


3) 首先加载用户将看到的第一个数据,然后以类似大小的批获取数据。如果一次只能看到20个li元素,则没有理由加载更多的元素,再加上一点缓冲区(30?)。

作为警告:这取决于计算机性能。坦率地说,在DOM操作中,任何接近100个元素的操作都会变得有点愚蠢和昂贵。也就是说:

1) 取决于你的系统,我的旧系统最高可达30个,而我的新系统在我破坏东西之前最高可达120个

2) 在尽可能大的层面上与他们合作。操纵一个包含一堆li的ul要比操纵一堆li快得多。使用jQuery并将对象存储在一个变量中(这样您就不会每次使用DOM时都查询它),以提高性能


3) 首先加载用户将看到的第一个数据,然后以类似大小的批获取数据。如果一次只能看到20个li元素,那么没有理由加载更多的元素,再加上一点缓冲区(30?)。

Hmm.40k
li
s?那太多了。谁会看到他们所有人?您考虑过延迟加载或分页吗?对于每个不同的浏览器实现,答案都会大不相同。我认为这个问题的答案将来自你自己进行的测试,而不是这里提供的任何答案?一个如此大的DOM会激怒你的用户。我们需要一个虚拟机或将你的RAM限制在1G以进行测试。我建议将计时器集成到循环函数中,以便当计时器超过某个持续时间时,在继续迭代之前设置一个短暂的超时。理想情况下,它会让浏览器在继续漫长的进程之前有一点喘息。好了,伙计们,我会尝试分页,接下来想到的问题是,假设我加载了一个组,我查看了5个页面,我应该将这些页面(作为变量)存储在任何地方,以便我可以快速再次加载它们,还是每次都可以获取它们。我在考虑内存使用等问题。40k
li
s?那太多了。谁会看到他们所有人?您考虑过延迟加载或分页吗?对于每个不同的浏览器实现,答案都会大不相同。我认为这个问题的答案将来自你自己进行的测试,而不是这里提供的任何答案?一个如此大的DOM会激怒你的用户。我们需要一个虚拟机或将你的RAM限制在1G以进行测试。我建议将计时器集成到循环函数中,以便当计时器超过某个持续时间时,在继续迭代之前设置一个短暂的超时。理想情况下,它会让浏览器在继续漫长的进程之前有一点喘息。好了,伙计们,我会尝试分页,接下来想到的问题是,假设我加载了一个组,我查看了5个页面,我应该将这些页面(作为变量)存储在任何地方,以便我可以快速再次加载它们,还是每次都可以获取它们。我在考虑内存使用等问题。