使用链接预加载预览图像以提高性能
Preloading Images With A Preview Image Like Linked In To Improve Performance
我正在寻找预加载图像的最有效方式。我熟悉延迟加载等，但我正在寻找特定的东西。例如，LinkedIn 在加载时会在加载物理 post 图像之前为所有 post 预加载通用 svg 图像。
我想对网站做同样的事情，并使用单一图像或背景颜色，同时预加载图像直到准备就绪。我也很想知道这是否是符合核心网络生命力的最佳方法。
也许我在谷歌上搜索了错误的术语，但据我了解，该方法可能是使用 src 和数据属性的组合，或者可能使用 JQuery 覆盖图像加载以加载占位符。我不确定，但如果有人可以指点我一些文档或给我一个演示，那就太好了。
提前致谢
我认为您要查找的术语是“占位符”或可能是“低质量图像占位符”。预加载通常是指using preload resource hints提前加载一个资源。对于 Core Web Vitals，如果您决定对图像使用预加载，您可能应该将其使用限制在单个图像上——可能是英雄图像。
这些链接可能会有帮助：
我正在寻找预加载图像的最有效方式。我熟悉延迟加载等，但我正在寻找特定的东西。例如，LinkedIn 在加载时会在加载物理 post 图像之前为所有 post 预加载通用 svg 图像。
我想对网站做同样的事情，并使用单一图像或背景颜色，同时预加载图像直到准备就绪。我也很想知道这是否是符合核心网络生命力的最佳方法。
也许我在谷歌上搜索了错误的术语，但据我了解，该方法可能是使用 src 和数据属性的组合，或者可能使用 JQuery 覆盖图像加载以加载占位符。我不确定，但如果有人可以指点我一些文档或给我一个演示，那就太好了。
提前致谢
我认为您要查找的术语是“占位符”或可能是“低质量图像占位符”。预加载通常是指using preload resource hints提前加载一个资源。对于 Core Web Vitals，如果您决定对图像使用预加载，您可能应该将其使用限制在单个图像上——可能是英雄图像。 这些链接可能会有帮助：