FEDev Story

페이지 라이프사이클은 크게 3가지로 분류된다. 로드 시점과 관련된 이벤트로써, 발생하는 시점은 다음과 같다. DOMContentLoaded - HTML 이 모두 로드되고, DOM 트리가 완성되었지만, 외부 리소스(img etc) 가 아직 로드되어지지 않았을 때 load - 브라우저에 모든 리소스(img, style, script, etc) 가 로드되었을 때 beforeunload / unload - 페이지를 떠날 때 위 내용만으로도 DOMContentLoaded 가 load 보다 빨리 발생한다는 것을 알 수 있다. (unload 에 대한 것들은 사용빈도가 낮기 때문에 생략하겠다.) 각 이벤트에 대한 유용한 경우는 다음과 같다. DOMContentLoaded - DOM 이 준비 상태이기 때문에, DOM 노..

1. $(document).ready()- 외부 리소스. 이미지와는 상관 없이 브라우저가 DOM (document object model) 트리를 생성한 직후 실행- window.load() 보다 더 빠르게 실행되고 중복 사용하여 실행해도 선언한 순서대로 실행됨 2. $(window).load()- DOM의 standard 이벤트- html의 로딩이 끝난 후에 시작- 화면에 필요한 모든 요소(css, js, image, iframe etc..)들이 웹 브라우저 메모리에 모두 올려진 다음에 실행됨- 화면이 모두 그려진 다음의 메세징이나 이미지가 관련 요소가 모두 올려진 다음의 애니메이션에 적합함- 전체 페이지의 모든 외부 리소스와 이미지가 브러우저에 불려운 이후 작동하게 되어 이미지가 안뜨너가 딜레이가 생..