Script Defer Iframe Video Youtube (Fast Loading)

Berbagi script defer iframe atau defer parsing iframe youtube js (fast loading) -  Mungkin masih ada yang ingin bertanya "apa itu defer iframe video youtube (youtube embed)?", Dalam bahasa inggris "Defer" artinya adalah menunda, jadi yang dimaksud dengan defer iframe youtube embed adalah; menunda pemuatan iframe youtube embed dengan bantuan sebuah javascript agar tidak membebani loading situs, sama hal nya dengan lazy loading.

Script yang berfungsi untuk menunda pemuatan iframe dari youtube embed ini lebih dikenal dengan sebutan "defer parsing of javascript youtube embed js", Script ini awalanya saya temukan ketika mengintip akun github para programer, ada banyak pengetahuan yang saya temukan disana untuk mempercepat loading situs web dan salah satunya adalah dengan menunda pemuatan iframe menggunakan script "defer parsing youtube js" ini.

Cara Kerja Defer Parsing Youtube JS

Javascript defer parsing youtube embed berfungsi untuk memberitahukan kepada browser untuk melewati atau menunda pemuatan iframe video embed sebelum loading situs selesai.

Script Defer Iframe dan Cara Menggunakan Nya

Simpan kode lengkap defer_parsing_youtube_embed.js ini diatas tag penutup body (diatas kode </body>).
[code type="JavaScript"]<script type='text/javascript'>
function init() {
    var vidDefer = document.getElementsByTagName('iframe');
    for (var i = 0; i < vidDefer.length; i++) {
        if (vidDefer[i].getAttribute('data-src')) {
            vidDefer[i].setAttribute('src', vidDefer[i].getAttribute('data-src')); } } }
window.onload = init;
</script>[/code]
Kemudian copy kode embed video youtube yang akan disematkan dan ubah kode src="" menjadi src="" data-src="" lalu kemudian sematkan kedalam konten (artikel) melalu mode pengeditan html.

example:
[code type="HTML"]<iframe width="854" height="480" src="https://www.youtube.com/embed/-U21R16Vvwk" frameborder="0" allowfullscreen></iframe>[/code]
Kode semat diatas adalah adalah kode original embed video youtube tanpa pemutar otomatis, setelah diterapkan defer iframe maka akan menjadi seperti berikut ini;
[code type="HTML"]<iframe width="854" height="480" src="" data-src="https://www.youtube.com/embed/-U21R16Vvwk" frameborder="0" allowfullscreen></iframe>[/code]
Untuk melihat lebih jelas bagaimana kinerja script defer parsing youtube embed js ini silahkan lihat pada link demo di bawah ini.

Lihat Demo

Dengan menarapkan metode "defer iframe" atau penundaan pemuatan iframe maka video yang disematkan kedalam konten situs tidak lagi membebani browser terlalu berat sehinngga loading situs menjadi lebih cepat (normal sebelum video ditambahkan). Demikian "Script Defer Iframe Video Youtube (Fast Loading)" Serta cara menggunakannya semoga bermanfaat dan menambah ilmu pengetahuan tentang blogging dan javascript.