따뜻한 대한민국 겨울만들기

Best Tween Engine ? (AS3)

Posted 2009. 1. 23. 13:57


 

트윈 엔진의 종류

 트윈 엔진의 종류는 꽤 많이 있지만.. 그 중에서도 가장 많이 사용한다는 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

Tweener.addTween(myMovie, {_x:10, _y:10, time:1, transition:"linear"});

자세히 보기
API Document

  • gTween

이벤트 방식

var myTween:GTween = new GTween(mySprite, 2, {x:200});

myTween.addEventListener(Event.COMPLETE, handleTweenComplete);

// hold a reference in myTween, so we can modify it later

var myTween:GTween = new GTween(mySprite, 2, {x:200});

// run once, and then free tween for garbage collection new GTween(mySprite1, 2, {x:400});

자세히 보기
API Document

  • TweenLite

import gs.*;

TweenLite.to(mc, 1, {x:200}); //automatically garbage collects

var myTween:TweenLite = TweenLite.to(mc, 1, {x:200});

//stores a reference to the TweenLite instance,

//but you're responsibleformaking sure it becomes eligibleforgarbage collection when you're finished with it

//(you can simply set your variable tonull, orifit is still in progress, call TweenLite.removeTween(myTween) first)

var myTween:TweenLite = new TweenLite(mc, 1, {x:200});

//identical to the previous line - it just looks more object-oriented.

콜백 방식

import gs.*;

import gs.easing.*;

TweenLite.to(clip_mc, 5, {alpha:0.5, x:120, ease:Back.easeOut, delay:2, onComplete:onFinishTween, onCompleteParams:5, clip_mc});

function onFinishTween(parameter1:Number, parameter2:MovieClip):void {

trace("The tween has finished! parameters: " + parameter1 + "\, and " + parameter2);

}

  • TweenMax

이벤트 방식

import gs.TweenMax;

import gs.events.TweenEvent;

var myTween:TweenMax = TweenMax.to(my_mc, 2, {x:300});

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 등)이 아닌 이상.. 성능상으로 차이를 내야하는 건 무리라는 생각이 들었습니다.

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

  1. BlogIcon 검쉰

    | 2009.01.28 11:20 신고 | PERMALINK | EDIT | REPLY |

    좋은 정보 감사합니다 ;)

  2. BlogIcon 꽃녀

    | 2009.01.29 10:20 신고 | PERMALINK | EDIT |

    검쉰님 오랜만입니다. ^^
    요즘 많이 바쁘신거 같던데.. 좀 나아 지셨나요? ㅋ
    방문 감사하구요..조금 더 분발해서 블로그 열심히 해야 겠네여 ㅠㅠ
    그럼 복 많이 받으시구 올해는 더 열심히 합시다..ㅋㅋ

  3. BlogIcon 동강

    | 2009.02.01 21:50 | PERMALINK | EDIT | REPLY |

    ㅋ 오랜만에 올라온 포스팅이네요.
    그날 못 다한 이야기를 계속 해야 되는데, 아쉽네요.ㅎ
    빨리 양재로 돌아 오세요~!

  4. BlogIcon 꽃녀

    | 2009.02.02 01:37 | PERMALINK | EDIT |

    아 하하..
    그날 재밌었는데..^^
    그치만 앞으로 자주 기회가 생길것 같아요.
    동강님도 열심히 하세용!!

  5. 임유석

    | 2010.08.30 16:32 | PERMALINK | EDIT | REPLY |

    이랑이구나! 잘지내지? ㅋㅋ 요즘은 이 블로그 안해서 이글을 볼지 모르겠네 ㅎㅎ
    암튼, 난 아직 미국이고 요즘 학원에서 프로그램 가르치는 알바하고있는데 갑자기 액션스크립트 3.0 을 가르쳐 달라고 해서
    플래쉬의 플자도 모르는 내가 하루 배워서 하루 가르치고 있거덩 ㅎㅎ
    낼이 마지막 수업인데 tweenLite 를 써야할거 같아서 자료 찾다보니까
    네 블로그가 나오네 ㅎㅎ 신기하다
    암튼 이쪽에서 너의 위치가 상당한거 같네
    이야~~ 멋지다 역시 박이랑 항상 ^^
    한국에 내년에는 갈거 같아 그때 함 보자구
    건강해

  6. BlogIcon 꽃녀

    | 2010.09.30 02:36 신고 | PERMALINK | EDIT |

    유석아! 정말 반갑당 ㅋㅋ as3도 하고 이것저것 다한다 너.. 만능이야 ㅋㅋ 한국오면 꼭 보자^^ 난 아주 잘지낸다! 네이트온 가끔 있는거 같던데 우리 말 한번 하자 ㅋㅋ 그럼 !!! 너도 건강 챙기고!!!

Write your message and submit
« PREV : 1 : 2 : 3 : 4 : 5 : 6 : 7 : ··· : 13 : NEXT »