스마트TV 앱을 개발 할 때에도 javascript 기반의 앱의 경우는 jQuery 등의 프레임워크를 이용하여 개발을 하게 됩니다.
크로스 브라우징 보다는 개발 편의를 위해서 주로 사용하는데요.
아마도 Selector가 jQuery에서 가장 많이 사용되지 않을까 생각됩니다.
해서 이에 대한 스마트TV에서의 성능 비교를 위해 몇가지 찾아보고 실제 테스트를 해보았는데요.
$elem.find('selector') vs $('selector', $elem) vs $('selector', $elem[0])
alert() : $("selector", $this[0]) : 1795 ms (looping 500 times)
alert() : $("selector", $this) : 1707 ms (looping 500 times)
alert() : $this.find() : 1686 ms (looping 500 times)
alert() : $this.find() : 1659 ms (looping 500 times)
alert() : $("selector", $this) : 2500 ms (looping 500 times)
alert() : $("selector", $this[0]) : 1803 ms (looping 500 times)
alert() : $("selector", $this) : 1757 ms (looping 500 times)
alert() : $this.find() : 1700 ms (looping 500 times)
alert() : $("selector", $this[0]) : 1762 ms (looping 500 times)
참고했던 자료와 jQuery의 버전 차이도 있고, TV라는 특성의 차이도 있어 결과에 대한 차이는 조금 있는 듯 보이나
결국 승자는 $elem.find('selector')입니다.
개인적으로 사용하는 라이브러리를 바꿔야겠네요.;;;
물론 저렇게 500번이나 DOM을 찾도록 개발은 하지 말아야겠지요.
아무리 빨라도 1.5초나 걸리는데 -_-ㅋ
ps. 5000번 수행했더니 TV가 재부팅이...
참고
http://www.erichynds.com/jquery/jquery-and-performance-what-is-this/
http://www.stoimen.com/blog/2010/06/19/speed-up-the-jquery-code-selectors-cache/