iframe без тормозов

iframe-video-map-another

Добавление на страницу iframe, которое не тормозит загрузку сайта

При вышеописанной технологии, поисковые системы не видят видео на странице.

Если видео в пределах первого экрана, то используем вышеописанную технологию с применением разметки Schema.org

content-visibility: auto;

Работает только для видео за пределами первого экрана.

<style>
    .wsytcontainer {
        container-type: inline-size;
        container-name:youtubei;
        width:100%;
    }
    .wsytblock {
        /*width: clamp(320px, 100cqw, 520px);*/
        /*height: clamp(180px, 56.25cqw, 293px);*/
        /*margin: 0 auto;*/
        width: 100cqw;
        height: 56.25cqw;
        contain: layout;
        content-visibility: auto;
        contain-intrinsic-width: 100cqw;
        contain-intrinsic-height: 56.25cqw;
    }
    .wsytiframe {
        border: none;
        width: 100%;
        height: 100%;
    }
</style>

<div class="wsytcontainer">
    <div class="wsytblock">
        <iframe class="wsytiframe"  loading="lazy" src="...
    </div>
</div>