read()와 load()의 차이점을 알기 위해선 Browser Process를 이해해야 정확하게 언제 호출되는지 알 수 있기 때문에 먼저 Browser Process에 대해 설명하겠습니다.
Browser Processing - WebKit
- 가장 먼저
HTML파일을 서버로 부터 네트워크 통신으로 전달 받는다.
HTML을 Parser를 통해DOM Tree를 생성한다.DOM Tree에는 간략한 정보만 담겨있다.
- 그 다음 외부 CSS파일과 함께 포함된 스타일 요소도 파싱한다.
CSS Parser를 통해Style Rules를 만든다.
- 그 다음으로
DOM과Style Rules를 결합한Render Tree를 만든다.
ready와 load의 차이점
ready는DOM이 완성된 이후에 호출되는 callback 함수이다.
$(document).ready(function(){
alert('READY');
});
load는img와 같은 다른 요소가 모두 load된 이후에 호출되는 callback 함수이다.
$(window).load(function(){
alert('LOAD');
});