new: img lazy loading in html
This commit is contained in:
parent
7ba547d5c0
commit
f18bbb125e
15
img lazy loading in html.md
Normal file
15
img lazy loading in html.md
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
# img lazy loading in html
|
||||||
|
|
||||||
|
To implement [[Lazy Loading]] to an `<img ... >` tag, add the attrbitue `loading=lazy`
|
||||||
|
|
||||||
|
<img loading=lazy ... >
|
||||||
|
|
||||||
|
This will load the image when scrolling is near the viewport, using the [Intersection Observer API](https://developers.google.com/web/updates/2016/04/intersectionobserver)
|
||||||
|
|
||||||
|
## Further reading
|
||||||
|
|
||||||
|
- <https://web.dev/native-lazy-loading>
|
||||||
|
|
||||||
|
## Why learned this
|
||||||
|
|
||||||
|
- Accidentally: a rabbit hole that started at [Jason Crawford's github](https://github.com/jasoncrawford) and ended at <https://github.com/owid/owid-grapher/pull/422>
|
Loading…
Reference in New Issue
Block a user