Thierry Schellenbach씨가 자신의 Prototype 응용프로그램에서 console.profile() / console.profileEnd()를 실행해본 후에 Prototype 응용프로그램에서의 JavaScript 성능 향상팁에 대한 글을 작성했습니다.

요점은 단순합니다:
  • $$와 이벤트 바인딩에 주의할 것
  • 다른 Prototype 메소드에 주의할 것(innerHTML과 element.update() 간데는 40배나 차이가 난다는 보고가 있습니다)
  • document.createElement 대신 innerHTML 을 이용해서 작성할 것
  • for in 루프 대신 for 루프를 사용할 것
  • 문자열 합치기에 += 대신 Array.join 을 사용할 것[각주:1]
  • 변수와 함수를 캐시할 것
  • eval의 사용을 제한할 것
  • Try Catch 구문의 사용을 제한할 것
  • DOM을 다룰 때는 엘리먼트 밖에서 DOM을 변경하고 다시 집어넣을 것(DOM 안에서 변화시키면 브라우저가 그 때마다 화면을 다시 그리려고 시도해서 느려질 수 있습니다)
시간 같은 요소가 더 추가되어 성능 측정이 되면 좋을 것 같습니다. 반론을 기다린다고 하는군요 ;)

from Some more JavaScript performance tips on Ajaxian
  1. 사실 이 부분은 IE에만 해당하는 것 같습니다. IE가 스트링 버퍼를 제대로 다루지 못해서 += 를 계속할 때와 Array.join 을 사용할 때의 속도차이가 많이 나는 것입니다. 다른 브라우저에서는 반복되는 += 를 알아서 잘 최적화 해주기 때문에 크게 속도차가 나지 않습니다 [본문으로]
Posted by 행복한고니 트랙백 0 : 댓글 0