一页有100万个链接元素？

Posted 2023-05-09

【中文标题】一页有100万个链接元素？

【英文标题】：1 million link elements in one page?

【发布时间】：2011-01-14 02:18:41

【问题描述】：

如果我获取 100 万个链接元素并将其放入 DOM，它会变得“滞后”吗？

因为我想在顶部有一个导航列表..它有点像苹果在他们网站上的导航列表，你可以用键盘向左或向右滚动。唯一的区别是中心图像的尺寸会比其他图像更大。

链接元素如下：

 <a><img src.../ ></a>

在这个滚动条中有 100 万个链接元素会不会是个坏主意。因为我希望显示所有链接（由用户添加）。还有哪些可能？

有人知道这类动画插件吗？

谢谢！

【问题讨论】：

您可以只添加可见链接，如果它们不在视线范围内，则将其删除。这将减少 DOM 中的链接数量。

这是你吗？ i46.tinypic.com/1z55k7q.jpg

正在部署新版本的“100 万美元页面”？

为什么不自己试试看会发生什么？

@saggi: 有点:) @bugspy: 我担心它会滞后

【参考方案1】：

是的，将 100 万个项目放入一个 GUI 元素将：

慢慢来 违反可用性准则。

尝试将您的信息组织成标签或类别，并为用户提供：

分页 排序 过滤 收藏列表 等等……

例如，看看 Stack Overflow 的问题列表是如何工作的。

【参考方案2】：

只有数据传输需要很长时间。你数过吗？

【参考方案3】：

除非您真的希望用户滚动浏览所有一百万个链接，否则我认为用户界面本身需要重新考虑。是的，页面中包含这么多信息会变得非常“滞后”。

【参考方案4】：

是的，一百万个链接会导致您的页面非常滞后。您应该只加载当时可见的链接数量，例如分页。

另外，你不想在一个页面上加载一百万张图片，这会导致很多延迟，如果你有多个用户，你的服务器可能不喜欢这种负载。 （一个用户的带宽可能无法在服务器上施加足够的负载而导致问题。）

【讨论】：

+1 但可能比显示的多一点，以使分页平滑（例如，如果页面大小为 50，则保留显示的 50 之前的 50 和之后的 50 ; 当用户翻页时，您可以立即显示新页面，然后在后台抓取现在刚刚离屏的 50 个页面。

@crowder。你知道这样的插件吗？

【参考方案5】：

问题是你无法做到这一点

我在我的网站上做了一次压力测试，加载了 40k 行的纯文本表格，一行 4 个单元格，每个单元格不超过 5 个字...

IE 崩溃了，Firefox 成功使用 1G 内存...滚动需要永远...

所以你的 100 万张图片是一项不可能完成的任务……太糟糕了

【讨论】：

哦，太好了......我相信你的结果和这里的所有答案......现在我知道它不可能完成的任务 4！

【参考方案6】：

在滚动条中放置 100 万个链接并不是一个好主意。您应该检查是否可以在滚动条中放置更少数量的链接（比如说 20 个）并按需加载其他链接，同时忘记那些因滚动而变得不可见的链接。

【讨论】：

但我想要元素之间的平滑滚动动画。你知道这样的插件吗？

@noname 这是一个糟糕的用户界面设计。假设用户可能会花 1/2 秒的时间查看特定图像以查看它是否有趣。下一张图像需要 1/2 秒才能滚动到视图中。因此，盯着屏幕，以每秒 1 次左右的速度滚动图像，您的用户需要将近六天的时间才能完成列表的一半。

【参考方案7】：

你能想象你的用户体验会有多糟糕，不得不手动滚动超过一百万个项目吗？你知道“一百万”有多大吗？

如果您有很多东西要查看，请创建一个分页表，并添加搜索/过滤工具。让您的计算机发挥作用，让您的用户生活更轻松。

【参考方案8】：

关于其他可能性：创建单个大图片并处理 onclick 事件，然后在客户端或服务器上转换坐标，将其映射到数百万个可能的 url 之一

【参考方案9】：

不会有人想到儿童用户！？

说真的，给用户一个包含 100 万个链接的列表有什么意义？ 100 个链接对于用户滚动浏览来说是令人生畏的。你想把它乘以 10000？

您提到了 Apple 网站...他们在网站的什么地方使用了这个？