跳至主要内容
CSS-Tricks
  • 文章
  • 笔记
  • 链接
  • 指南
  • 年鉴
  • 随机播放
搜索

文章标签
lazy loading

17 篇文章
{
,

}
直接链接到文章 延迟加载自定义元素的方法
自定义元素 延迟加载 Web 组件

延迟加载自定义元素的方法

我们这里都是 自定义元素 的粉丝。它们的结构使得它们 特别适合延迟加载,这对于性能来说是件好事。

受 一位同事 实验的启发,我最近开始编写一个简单的自动加载器:每当一个自定义...

Avatar of Frederik Dohr
Frederik Dohr 于 2023 年 2 月 13 日
直接链接到文章 如何在点击时显示图像
图像优化 延迟加载 感知性能 性能

如何在点击时显示图像

网络上大多数图像都是多余的。如果我做一个混蛋,99% 的图像实际上并不那么有用 (尽管有一些罕见的例外)。这是因为图像通常不会补充它们所在的文本...

Avatar of Robin Rendle
Robin Rendle 于 2021 年 5 月 27 日
直接链接到文章 多功能且可重用的骨架加载器的基础方法
延迟加载 加载器

多功能且可重用的骨架加载器的基础方法

像旋转器和骨架加载器这样的 UI 组件可以减少等待页面加载的挫折感,甚至可以通过正确使用来影响感知到的加载时间。它们无法完全阻止用户离开网站,但可能会鼓励...

Avatar of Adrian Bece
Adrian Bece 于 2021 年 3 月 3 日
直接链接到文章 Chrome 中的原生图像延迟加载过于急切
Chrome 延迟加载

Chrome 中的原生图像延迟加载过于急切

有趣的研究 来自 Aaron Peters 关于 <img loading="lazy" ... >

在我的 13 英寸 Macbook 上,当 Dock 位于左侧时,Chrome 的视窗高度为 786 像素,因此具有 loading="lazy" 的图像比...

...
Avatar of Chris Coyier
Chris Coyier 于 2020 年 2 月 5 日
直接链接到文章 延迟加载嵌入的 YouTube 视频
iframe 延迟加载 YouTube

延迟加载嵌入的 YouTube 视频

这是来自 Arthur Corenzan 的一个非常巧妙的想法。不要使用默认的 YouTube 嵌入,它会在页面中添加大量资源,无论用户是否播放视频。使用小的占位符网页...

Avatar of Chris Coyier
Chris Coyier 于 2021 年 12 月 27 日
直接链接到文章 每周平台新闻:HTML 加载属性、主要 ARIA 规范以及从 iFrame 到 Shadow DOM 的迁移
延迟加载 性能 Shadow DOM

每周平台新闻:HTML 加载属性、主要 ARIA 规范以及从 iFrame 到 Shadow DOM 的迁移

在本周的平台新闻汇总中,Chrome 引入了新的加载属性、面向 Web 开发人员的可访问性规范以及 BBC 将可视化内容迁移到 Shadow DOM 中。

Avatar of Šime Vidas
Šime Vidas 于 2021 年 4 月 26 日
直接链接到文章 使用 Jetpack 获得最佳的 WordPress 性能
CDN Jetpack 延迟加载 性能

使用 Jetpack 获得最佳的 WordPress 性能

Web 性能的讽刺之处在于,尽管我们更了解这个问题,并且拥有更多工具来解决它,但 网站的平均页面大小逐年增加。...

❥ 赞助
直接链接到文章 自己动手实现延迟加载的技巧
图像策略 延迟加载 响应式图像

自己动手实现延迟加载的技巧

您可能已经听说过(甚至发出过呼吁),当寻找一种方法来精简一个特别重的网页时,“我们可以使用延迟加载!”

延迟加载是一种流行的技术,用于逐步请求图像...

Avatar of Phil Hawksworth
Phil Hawksworth 于 2019 年 7 月 15 日
直接链接到文章 深入了解图像和框架的原生延迟加载
Chrome 延迟加载 性能

深入了解图像和框架的原生延迟加载

如今的网站充斥着大量媒体资产,例如图像和视频。图像占 网站平均流量的 50% 左右。然而,其中许多图像从未被用户看到,因为它们被放置在 页面下方...

Avatar of Erk Struwe
Erk Struwe 于 2019 年 7 月 14 日
  • 1
  • 2
  • 更早的

CSS-Tricks 由 DigitalOcean 提供支持。

通过我们精心制作的时事通讯

随时了解 Web 开发动态

DigitalOcean
  • 关于 DO
  • Cloudways
  • 法律声明
  • 获取免费积分!
CSS-Tricks
  • 为我们撰稿!
  • 与我们合作广告!
  • 联系我们
社交
  • RSS 订阅
  • CodePen
  • Mastodon
  • X
返回顶部

© 2024 . All rights reserved.