lazy="false" 모드
신규 파일의 Source 탭을 확인하면 lazy="false"가 선언 되어있다
어떤 기능을 하는지 확인 해본다
전체적인 페이지의 로딩 순서
1) Design 탭에서 배치된 component가 적용된 속성과 함께 생성
2) Script 탭에서 선언된 function 및 이벤트가 생성
3) Script 실행그런데 일부 속성 중에서는 Script탭에서 function으로 등록하여 사용하는 것이 있다
대표적으로 customFormatter 이 있다
이와 같이 구현된 함수는 속성에서 적용하고 있는데,
함수의 생성 시점을 다시 생각해보면, 제대로 적용되지 않음을 알 수 있다
1. component 생성(속성 적용) => 2. script 생성 => 3.script 실행위 순서로 적용이 되면, 생성되지도 않은 script를 속성으로 적용하다 보니,
제대로 실행되지 않는 부분이 발생할 수 밖에 없다
그래서 이와 같은 문제점을 해결하고자 lazy='false' 기능이 적용되었다
해당 속성이 적용되면, script의 생성 시점을 앞당겨 주는 기능을 한다
즉 lazy='false'를 적용하면 'script'의 생성시점을 'component'의 생성시점보다
앞당겨서 component에서 속성으로 적용하는 'script'에 정의된 function을 적용 할 수 있다
*lazy false 적용 전
=> 'component 생성(속성적용 포함)' => 'script 생성' => 'script 실행'
*lazy false 적용 후
=> 'script 생성' => 'component 생성(속성적용 포함)' => 'script 실행'이와 같이 적용시 주의할 사항은 'script'작성시 실행문은 반드시 onpageload 부분에 적용해야 한다는 점이다 그 이유는 onpageload 부분의 실행은 component가 생성된 이후에 실행하도록 적용되지만, 만약 다른 부분에서 실행을 하면, component가 생성되기 이전에 수행할 수도 있어서 오동작을 유발할 수 있기 때문이다
코린이