트윈 엔진의 종류

 트윈 엔진의 종류는 꽤 많이 있지만.. 그 중에서도 가장 많이 사용한다는 google Tweener, gTween, TweenLite(Max) 이 3가지에 대해 알아보겠습니다.

Google Tweener

  • Google code의 오픈소스 프로젝트에서 발전 되어 많은 사용자들이 사용하는 엔진 중에 하나입니다.
    보통 'tweener' 라고 불리며 많은 사람들이 사용하기 시작하였고,
    여러 오픈 엔진들이 발전하게 된 밑거름이 된 프로젝트입니다.

gTween

  • 다음으로는 Flash를 업으로 하고 있는 사람이면 대부분 알고 있는 Grant Skinner란 개발자가 만든 gTweeen 입니다.
    TweenLite와 비교해 속도면에선 아직 부족하지만, 셋 중 가장 최근에 만들어졌다는 것과 꾸준한 업데이트로 인한 성능 향상으로 많은 사용자들이 사용하고 있습니다.

TweenLite / TweenMax

  • Jack Doyle이라는 사람이 만든 TweenLite, TweenMax는 현재 서치(자체) 결과 가장 많은 사람들이 사용하고 있는 엔진으로 보입니다.
    무엇보다도 최고의 퍼포먼스를 내는 것에 많은 사용자들이 Google Tweener에서 TweenLite로 갈아 탔다는 말들이 있습니다.;
    (참고로 TweenLite는 기본적인 트윈 종류만 가지고 있는 가벼운 라이브러리이며, TweenMax는 TweenLite를 확장한 보다 다양한 트윈을 제공하고 있습니다.)

 

트윈 엔진들의 성능 비교


단지 최고의 퍼포먼스를 낸다고 그것도 웹소문으로 TweenLite를 사용해야 한다는 것에는 아직 부족한 감이 있습니다. 
그래서 위 엔진들을 비교한 웹페이지의 도움을 받아 보겠습니다. 


  • Speed Test - Tweening Engine Comparison Tool
    • 아마 많은 사람들이 위의 퍼포먼스 테스트를 하고 난 뒤 TweenLite(Max)로 갈아탔을 거라 생각됩니다.
      테스트를 해보면 정말 속도면에선 빠르다는 것을 알 수 있습니다. 거기다 Flash 기본 트윈은 절망인 것도 알게 됩니다.
      하지만 이 테스트는 TweenLite를 만든 곳에서 한 것이므로 100% 신뢰는 어렵다고 생각하였습니다.

 

트윈 엔진들의 사용법

  • Google Tweener

view plaincopy to clipboardprint?
  1. Tweener.addTween(myMovie, {_x:10, _y:10, time:1, transition:"linear"});  

자세히 보기
API Document

  • gTween

이벤트 방식

view plaincopy to clipboardprint?
  1. var myTween:GTween = new GTween(mySprite, 2, {x:200});  
  2. myTween.addEventListener(Event.COMPLETE, handleTweenComplete);  
  3. // hold a reference in myTween, so we can modify it later  
view plaincopy to clipboardprint?
  1. var myTween:GTween = new GTween(mySprite, 2, {x:200});  
  2. // run once, and then free tween for garbage collection new GTween(mySprite1, 2, {x:400});  

자세히 보기
API Document

  • TweenLite

view plaincopy to clipboardprint?
  1. import gs.*;  
  2. TweenLite.to(mc, 1, {x:200}); //automatically garbage collects  
view plaincopy to clipboardprint?
  1. var myTween:TweenLite = TweenLite.to(mc, 1, {x:200});  
  2. //stores a reference to the TweenLite instance,   
  3. //but you're responsibleformaking sure it becomes eligibleforgarbage collection when you're finished with it  
  4. //(you can simply set your variable tonull, orifit is still in progress, call TweenLite.removeTween(myTween) first)  
view plaincopy to clipboardprint?
  1. var myTween:TweenLite = new TweenLite(mc, 1, {x:200});  
  2. //identical to the previous line - it just looks more object-oriented.  

콜백 방식

view plaincopy to clipboardprint?
  1. import gs.*;  
  2. import gs.easing.*;  
  3. TweenLite.to(clip_mc, 5, {alpha:0.5, x:120, ease:Back.easeOut, delay:2, onComplete:onFinishTween, onCompleteParams:5, clip_mc});  
  4. function onFinishTween(parameter1:Number, parameter2:MovieClip):void {  
  5.       trace("The tween has finished! parameters: " + parameter1 + "\, and " + parameter2);  
  6. }  
  • TweenMax

이벤트 방식

view plaincopy to clipboardprint?
  1. import gs.TweenMax;  
  2. import gs.events.TweenEvent;  
  3. var myTween:TweenMax = TweenMax.to(my_mc, 2, {x:300});  
  4. myTween.addEventListener(TweenEvent.COMPLETE, myFunction);  

자세히 보기

보시면 아시겠지만, 사용법은 거의 비슷하게 보입니다. 
하지만, gTween은 AS3.0의 이벤트 방식을 따랐고, TweenLite는 콜백 방식을 사용하였습니다. 
gTween이 좀 더 개발자 지향적이라고 할 수 있습니다.(skinner가 한 말..) 
이런 이유에서 인지 TweenMax에서도 이벤트 방식이 업데이트가 되었습니다. 
확장성을 고려한다면 gTween과 TweenMax를 빠른 퍼포먼스는 TweenLite가 아닌가 하는 생각이 듭니다. 

 

트윈 엔진들의 업데이트

  • Google Tweener
    Stable version 1.31.74 (2008/10/24)
  • gTween
    Beta 4 Release (2008/12/15)
  • TweenLite
    Version 9.3, Updated (2008/12/17)
  • TweenMax
    Version: 3.6, Updated (2008/12/17)

각 엔진들의 업데이트 내역을 보면, 
Google Tweener만 약간 처질 뿐 나머지는 다 업데이트 활동이 활발하다고 볼 수 있겠습니다. 

 

트윈 엔진들의 성능 비교 테스트

위에 나와있는 성능 비교의 자료는 형평성에(?) 어긋나는 것 같아서 자체적으로 간단히 만들어 보았습니다. 
위의 성능 비교 자료들은 구 버전들을 비교한 것이므로, 각각 최신 버전을 사용하여 제작하였습니다. 


테스트 결과 4가지 엔진은 거의 비슷한 FPS와 메모리 사용량을 나타내었습니다. 
용량이 아주 큰 트위닝을 사용하는 작업(3D 등)이 아닌 이상.. 성능상으로 차이를 내야하는 건 무리라는 생각이 들었습니다.

성능과 사용 편의성을 잘 따져.. 선택하는 것은 각자의 몫인 것 같습니다.
 
이 게시물을..