我目前正在使用此网站... http://bit.ly/yR6xzta
在滚动网站或使用向上和向下箭头键导航时,您会发现滚动行为非常缓慢且缓慢。
知道是什么原因引起的吗?我正在使用HTML5和简单的img
标签,宽度为85%,高度为85%。 Javascript不是原因。如果我彻底摆脱所有JS,它仍然是迟钝的。
知道是什么造成的吗?我希望在滚动时提高此网站的性能。
感谢您的帮助。
答案 0 :(得分:1)
这里有相当多的图像,使这个过程更顺畅的一种方法是异步添加和删除图像。这将允许页面内存保持较低并且加载/显示图像的计算能力较低。逻辑很简单:当你在一张幻灯片上,加载+ 5 / -5幻灯片'图像(一些幻灯片有多个图像,所以我们将它放在幻灯片上)。 使用箭头键事件并添加滚动事件以调用异步方法以确定要加载的幻灯片以及删除任何标记的幻灯片。
您可以通过简单地用文本替换所有图像来测试内存概念。你的经历应该有很大的改善。
注意:您必须使用CSS来保持图像容器的高度恒定,这样您的滚动高度就不会改变并取代您的视图窗格。
答案 1 :(得分:0)
尝试缩小图像尺寸,我认为这与js相关。
答案 2 :(得分:0)
我的游戏装备上的滚动和方向键都很平滑,而且我的Chromebook基本无法使用。它的长短是你在一个页面上有5100万像素的图像(大概10MB左右?)。移动它时的性能将在很大程度上取决于浏览器如何处理它(硬件加速与否)以及硬件本身。对于将电源管理融入操作系统的笔记本电脑来说尤其如此。例如,JS无法触发切换到专用图形,这意味着将所有这些像素移动到CPU(实际上不是它的意图)。
要考虑的选项:
opacity: 0;
不起作用,display: none;
或{ {1}}可能。您也可以直接删除节点,如果将它们重新添加,它们将在以后加载,因为它们将被缓存。)