DOM HTML
Pengertian :
DOM (Document Object Model) bisa diartikan sebagai Model dari sebuah Objek didalam dokumen HTML.
DOM ini biasanya didapati pada saat browser memuat suatu halaman yang akan ditampilkan.
Dan DOM terbentuk sebagaimana sebuah pohon objek sehingga akan didapati seberapa "kedalaman" suatu objek mempengaruhi tata letak dokumen.
Dibawah ini screenshot hasil uji suatu halaman yang terpengaruh oleh model objek (DOM) yang terdapat didalamnya.
Pada screenshot diatas, model objek (DOM) yang mempengaruhi pemuatan halaman adalah berasal dari ikon SVG pada tombol share bawaan template Blogger versi 3.
Penyebab DOM mempengaruhi pemuatan halaman.
Yang menyebabkan terjadinya pengaruh DOM ini adalah elemen didalam template yang sebenarnya tidak ditampilkan dihalaman tetapi elemen tersebut masih berada didalam template.
Dalam kasus ini,template yang terkait screenshot diatas adalah template yang tombol share-nya diganti dengan elemen lain sehingga elemen tombol share bawaan template tidak lagi digunakan / ditampilkan tapi tidak dihapus dari template. Sehingga elemen tersebut masih dapat dirender oleh browser meskipun tidak muncul dihalaman.
Disamping itu CSS yang seharusnya diterapkan pada elemen bersangkutan pun pada akhirnya terbaca namun juga tidak dapat dieksekusi karena elemennya tidak berfungsi. Hal itulah yang menyebabkan kinerja browser membutuhkan lebih banyak memori karena harus membaca objek yang seharusnya tidak perlu dibaca / dirender sekaligus memperlambat pemuatan halaman.
Kesimpulan :
Jadi penyebab DOM suatu elemen mempengaruhi pemuatan halaman bisa dikatakan karena adanya JUNK atau anggaplah sama seperti sampah sistem pada aplikasi yang menghambat kinerja dan membutuhkan memori RAM berlebih yang dapat menyebabkan pemuatan halaman menjadi tersendat / terhambat.
Selanjutnya, bagaimana cara mengatasi efek DOM tersebut agar tidak menghambat pemuatan halaman?. Dibawah ini kita bahas secara ringkas, bagaimana cara mengatasi masalah tersebut
Cara mengatasi pengaruh DOM
Berdasarkan kasus diatas untuk mengatasi pengaruh DOM adalah dengan menemukan elemen tersebut didalam template beserta CSSnya kemudian menghapusnya.
Tips :Disamping menyisir elemen HTML beserta CSS yang tidak berfungsi didalam template sebenarnya skill dan wawasan admin pengelola web / blog bersangkutan mengenai HTML dan CSS juga berpengaruh. Karena pengambilan keputusan pada saat suatu kode dalam template hendak dihapus, admin tersebut setidaknya mampu memperkirakan apa efeknya, apa kode penggantinya dsb.
Selebihnya untuk memaksimalkan pemuatan halaman selanjutnya, akan lebih baik memeriksa elemen lain dan CSSnya yang mungkin tidak digunakan agar dihapus dari template.
Untuk memeriksa kode CSS gunakan CSS Validator akan lebih cepat menemukan kemungkinan adanya kesalahan CSS yang ada dalam template.
Untuk memeriksa HTML template bisa menggunakan W3 Markup Validator.
PERHATIAN :Untuk HTML validator ini, harap diperhatikan jika memeriksakan URL Blogspot.com karena template Blogger tidak murni HTML atau sudah dimarkup dengan data layout yang tidak termasuk didalam tag HTML standart sehingga apabila hasil validasi menemukan banyak error bukan berarti kesalahan tetapi lebih kepada efek penggunaan data layout template sehingga terbaca sebagai error.