Lazy Loading Inline Frames Bookmark

There’s a new loading attribute that allows native lazy loading in Chrome. The loading attribute is not a standard yet, but it’s being worked on and I’m really looking forward to it, I think this is a really good feature.

Besides images I noticed that it’s also possible to lazy load iframes. iframes aren’t used that much these days, but when they are, it can be helpful being able to load them only by the time the user scrolls near them, instead of loading all their associated data right away. I’m thinking Google Maps, which send quite a bit of data with their iframe maps, but I haven’t looked at or tried it yet at all.

The way to lazy-load an iframe is straight forward and just the same as you would do with images:

<iframe src="source.html" loading="lazy"></iframe>

Note: The loading attribute is only available in Chrome 76 and later, and as of this writing, no other browsers support it yet.


Leave a comment

Available formatting commands

Use Markdown commands or their HTML equivalents to add simple formatting to your comment:

Text markup
*italic*, **bold**, ~~strikethrough~~, `code` and <mark>marked text</mark>.
Lists
- Unordered item 1
- Unordered list item 2
1. Ordered list item 1
2. Ordered list item 2
Quotations
> Quoted text
Code blocks
```
// A simple code block
```
```php
// Some PHP code
phpinfo();
```
Links
[Link text](https://example.com)
Full URLs are automatically converted into links.

Replied on your own website? Send a Webmention!