2013-07-02 1 views
0

div의 높이를 변경하려면 간단한 애니메이션을 클릭해야합니다. 나는 보통 jquery 슬라이드 또는 애니메이션을 사용합니다. 이번에는 TweenLite가 어떻게 작동하는지 살펴 보았습니다. 내가 갖고있는 문제는 더 많은 파일 크기를 추가하는 것입니다. Ok TweenLite는 9kb에 불과하지만 CSS 속성을 애니메이트하려면 TweenLite 용 CSSPlugin을로드해야합니다. 이제는이 25kb가 훨씬 더 크고 작은 페이지 프로젝트에 큰 도움이됩니다.TweenLite 대 Jquery 애니메이션

내가 읽은 jquery는 객체가 아니라 CSS 속성이 아니거나 잘못된 것입니다. TweenLite + CSSEngine의 유일한 장점은 CSS에 애니메이션을 적용하면 속도가 빨라진다는 것입니까?

답변

2

jQuery도 CSS를 움직입니다. 만약 당신이하고있는 일이 객체의 높이를 움직이는 것이라면, jQuery를 다른 곳에 사용하면 이미 jQuery가 괜찮을 것입니다. 그러나 더 공격적인 것을하거나 성능 문제가 발생하거나 애니메이션을 더 많이 제어해야하는 경우 TweenLite + CSSPlugin으로 전환하는 것이 좋습니다.

TweenLite가 훨씬 빠른 이유는 내부 인프라와 여러 가지 최적화와 관련이 있기 때문입니다. 서로 다른 속성을 모두 애니메이션으로 적용하지 않기 때문이 아닙니다. 그것은 훨씬 더 효율적입니다.

이유는 CSSPlugin이 그만큼 크기 때문입니다. FAR 이상의 jQuery가 가능합니다. 2D 및 3D 변형, borderRadius, textShadow, 클립, 색상 및 기타 항목이 더 많습니다. 그리고 그것은 수많은 브라우저 버그를 해결합니다. 요약은 http://www.greensock.com/why-gsap/을, jQuery와의 비교는 http://www.greensock.com/jquery/을 참조하십시오.

파일 크기가 가장 큰 관심사 인 경우 TweenLite + CSSPlugin은 jQuery 만 사용하는 것보다 훨씬 적습니다.하지만 jQuery를 다른 곳에서 사용하는 경우에는 GSAP이 파일 크기에 적합한 지 결정해야합니다. 특정 프로젝트. 솔직히, 그것은 정말로 무겁지 않다. 모든 것이 고려되었다. 이미지 크기와 비슷하기 때문에 런타임 성능이 향상되면 그만한 가치가 있습니다. 다시 말하지만, 모두 귀하의 특정 프로젝트에 달려 있습니다. 간단한 높이 트윈에는 GSAP가 필요하지 않습니다.