如何在不加载页面的情况下在一个页面中加载超过 1500 个产品？

Posted 2023-02-15

【中文标题】如何在不加载页面的情况下在一个页面中加载超过 1500 个产品？

【英文标题】：How to load more than 1500 products in a page without pageloading?

【发布时间】：2021-11-21 00:21:46

【问题描述】：

我正在为类别页面添加 SEO，该类别页面中有 1500 多个产品，我不想放置分页或任何类型的 ajax，它会加载少量产品，然后在页面滚动加载下一个产品有什么办法加载所有产品而不让用户知道该页面正在加载？

【问题讨论】：

到目前为止你做了什么？

您的页面可能仅包含几兆字节的 html 代码数据。

我正在尝试延迟加载，但我希望谷歌读取我的类别页面中的所有数据，同时我希望我的用户不要觉得页面在持续加载所以有什么办法请帮助我有了这个..!!

【参考方案1】：

请注意，在一次请求中加载 1500 个产品时，您会受到很多性能损失，这会影响您客户的浏览器（冻结、崩溃等）。

如果仅用于 SEO，我认为您可以一次加载它们，但使用 CSS 将其中大部分隐藏在视图中（例如，仅显示 20-40 个产品）。它仍然可以在 HTML 代码中使用，但客户端看不到它们并且性能仍然很好。

当他们想要查看更多产品时，只需切换一些 CSS 类以显示它们，但使用延迟加载或分页来假加载。

【讨论】：

我已经尝试过这种方式，但在 Google 控制台中我没有获得我希望谷歌读取所有数据的整个产品。在我的分类页面中。

你是如何实现这个想法的？我的意思是你应用了什么样的 CSS 样式？