Event DOMContentLoaded dan load merupakan html event penting wajib diketahui bagi front-end web developer.

DOMContentLoaded merupakan event html yang dipanggil ketika dokumen HTML telah selesai load dan parsing tanpa menunggu stylesheets atau css, images, atau subframes selesai diproses.

Sedangkan event load merupakan event yang terjadi ketika halaman web telah selesai loading. Sangat disarankan menggunakan event DOMContentLoaded dibandingkan event load ketika menjalankan javascript.

Hal ini dikarenakan dalam menjalankan javascript tidak diperlukan untuk menunggu resource seperti stylesheets dan images selesai diproses, cukup menunggu Document Object Model (DOM) selesai load dan selesai dilakukan parsing.

window.addEventListener("load", function(event) {
  console.log("All resources finished loading!");
});

document.addEventListener("DOMContentLoaded", function(event) {
  console.log("DOM fully loaded and parsed");
});

// jQuery
$(window).load(function() {
  console.log("All resources finished loading!");
});

$(document).ready(function() {
  console.log("DOM fully loaded and parsed");
});

Referensi