겸손한 Script를 통한 게으른 로딩 기능
[IT] Ajaxian 2008/05/14 00:37 |David Kees씨가 Prototype을 이용한 JavaScript 파일 로딩에 대한 글을 썼습니다. 이는 DOM 엘리먼트가 사용가능한 이벤트 스크립트를 이용해 로딩 기능 기술을 구현한 것입니다.
그는 아쉬운 점을 해소하기 위해 그 기술을 사용했습니다:
이 사이트의 달력은 블로그에 관련된 정보를 보여주는 페이지에서만 나타납니다. 달력은 페이지를 모두 리로드하지 않고도 달만 바꿀 수 있도록 JavaScript로 개선되었습니다. 저는 이러한 개선기능들이 달력이 있는 어디서든 사용가능하게 하기 위해 두 가지 옵션을 생각해냈습니다:
- JavaScript를 필요로 하는 모든 페이지에 JavaScript 파일을 포함하는 코드를 직접 적는다. 좋은 방법이고, 예전부터 잘 되던 방식이지만, 사람들이 때때로 JavaScript가 필요한 새 페이지에 파일을 포함하는 것을 생각 못하거나 깜빡해버리는 경향이 있다.
- JavaScript가 필요해질 때 자동으로 파일을 포함할 수 있는 방법을 찾는다. JavaScript가 필요한 새 페이지를 추가할 때 파일을 포함하는 걸 기억해낼 필요가 없지만, 페이지가 로드되었을 때 JavaScript를 조금 더 오래 실행해야 한다.
다음은 구현 예제 코드입니다:
[code:js]
document.observe("dom:loaded", function() {
var calendar = $("calendar");
if(calendar) {
var script = new Element("script", { type: "text/javascript", src: "/path/to/calendar.js" });
document.observe("calendar:loaded", function() { new Calendar(calendar); });
$$("head")[0].insert(script);
}
});
document.observe("dom:loaded", function() {
var calendar = $("calendar");
if(calendar) {
var script = new Element("script", { type: "text/javascript", src: "/path/to/calendar.js" });
document.observe("calendar:loaded", function() { new Calendar(calendar); });
$$("head")[0].insert(script);
}
});
from Lazily load functionality via Unobtrusive Scripts on Ajaxian
'[IT] Ajaxian' 카테고리의 다른 글
| mountpoint://를 통한 File API (0) | 2008/05/15 |
|---|---|
| 구글의 Location API (0) | 2008/05/15 |
| Wii Darts: Wii 컨트롤러를 이용한 Ajax 응용프로그램 (1) | 2008/05/15 |
| Ajax 개척자 주간 : jQuery의 John Resig (0) | 2008/05/14 |
| 겸손한 Script를 통한 게으른 로딩 기능 (1) | 2008/05/14 |
| line-height : 고통? (1) | 2008/05/13 |
| jQuery와 함께하는 겸손한 JavaScript (0) | 2008/05/12 |
| Opera Dragonfly : 새로운 디버깅 툴 (0) | 2008/05/12 |
| Ajax 개척자 주간 : GWT의 Bruce Johnson (0) | 2008/05/10 |
