图像延迟加载并替换为占位符

Question

我从 React/Redux 中的 reddit API 获取了一些图像，我考虑通过将它们的

loading

属性设置为

lazy

来延迟加载它们。

但我会在 DevTools 中收到此消息：

[干预] 图像延迟加载并用占位符替换。 加载事件被推迟。看 https://go.microsoft.com/fwlink/?linkid=2048113

我在网上找不到任何相关信息，所以我想在 Stackoverflow 中询问该消息的含义。

Answer 1

嘿，如果有人想知道这个错误是什么。

可以将加载类型设置为图片属性

LazyImages 是 Blink 中的一种机制，它推迟加载视口下方的图像，直到可能查看它们，以节省数据并加快视口中元素的加载速度。它将用作 LazyLoad 功能的一部分

希望这有帮助。 只需删除加载类型，这样您的代码就可以永恒 - 只是开玩笑。

Answer 2

我通过将加载属性设置为“eager”而不是“lazy”来消除警告。 它的行为有点不同，但您仍然可以获得性能优势