Is it possible to do lazy loading like with the iframe?

[brvnonascimento]

No description provided.

[brvnonascimento]

Here's the solution I came up with:

    const [lazyYoutube, setLazyYoutube] = useState(true)
    const lazyYoutubeHandler = () => setLazyYoutube(prevState => !prevState)
    //bypass safari autoplay blocker, but not Brave so the user will have to click twice with it
    const autoPlayHandler = e => e.target.playVideo()

    return (
                <div className={!lazyYoutube ? `px-0 embed-responsive embed-responsive-16by9` : 'px-0'} >
                    {!lazyYoutube ?
                        <YouTube
                            videoId={video}
                            opts={{autoplay: 1}}
                            onReady={autoPlayHandler}
                            /> :
                        <div className='d-flex h-100 justify-content-center btn p-0' onClick={lazyYoutubeHandler}>
                            <img src='/assets/youtube.svg' alt='Youtube Botão Play' className='yt-button align-self-center' />
                            <img src={`https://img.youtube.com/vi/${video}/sddefault.jpg`} alt={title} className='w-100' />
                        </div>
                    }
      </div>