HTML5 Web应用程序有一个包含非常大的列表的页面。现在，它有400个条目，可能还有更多。我担心随着时间的推移填充更多数据，它将来会在移动平台上变得不稳定。它看起来像一个tableView。非常基本的东西。除了汉堡菜单外别无其他。
基本上，它是包含LI元素的UL元素。 body元素随着这个UL元素而增长。
每个条目都有一个关键字。它按字母顺序排序（但内容的一半以相同的字符开头）。它会导致详细页面。
有一个搜索栏可以在使用时过滤掉匹配项。如果搜索栏为空，则显示所有条目（这是必需的）。
问题是，内容无法真正拆分为类别。这是一个单一的清单。
最好的是隐藏的性能技巧，因为不应该更改GUI。
当我查看本机应用程序的UITableView时，有一个技巧：只有几行。当一行在向下滚动时离开可见部分时，它会被回收并再次添加到底部（但是该行的新内容）。用户没有注意到这一点，并认为有一堆行元素。 UITableView几乎是无穷无尽的。
我试过iScroll。但是在滚动过程中，这也增加了一些丑陋的外观和感觉（他们是否重新完成了滚动？）
我可以在HTML5中存档（或类似）吗？我更喜欢非插件解决方案，因为许多javascript插件往往会使整个应用程序膨胀或破坏其外观和感觉。我只需要为这个大清单提供性能提升。或者是否有一个技巧告诉浏览器它应该像UITableView一样？
我还尝试使用transform：translateZ（0）的css技巧。那根本不起作用。这里什么都没发生。
应用程序本身很小，基本上就是“无尽”列表加上一些小额外功能。
DOM如下： html - ＆gt;身体 - ＆gt; div-container（用于漂亮的褪色效果，有时稍微向侧面移动以揭开汉堡包菜单） - ＆gt;在ul
中的ul和searchform - ＆gt; li我没有看到在这里优化的方法。
PS：身高有限吗？或者是我无缘无故的恐惧，浏览器已经做了一些事情来阻止这些大型列表的性能下降？
答案 0 :(得分：0)
看看Clusterize.js，您可能会感兴趣。 它的创建完全是为了解决这些性能问题。
Clusterize支持<ol>, <ul>列表，不重新发送滚动，一切看起来像本机html滚动。