iframes
External scripts from iframes are executes on load by the browsers. This happens even tough the iframes has the loading attribute set to lazy. This small function allow to really lazy-load iFrames by replacing a div tag by an iframe tag when element is close to viewport.
Installation
Import and run the function in your project
import { fnLazyloadIframes } from "@overdog/fn"
fnLazyloadIframes()
Example
The data prefix on the content div attributes is only to keep valid HTML.
<div data-lazy-iframe="wrapper">
<lazy-iframe
src="https://player.vimeo.com/video/{{ idField }}"
width="100%"
height="100%"
frameborder="0"
title="Your title"
allowfullscreen
>
</lazy-iframe>
</div>