SSGOI LogoSSGOI
← Back to Blog
ssgoi 2.5.2: Mobile Animation Optimization Complete πŸŽ‰

ssgoi 2.5.2: Mobile Animation Optimization Complete πŸŽ‰

β€’Daeseung Moon
performancemobileoptimizationrelease

Hello, I'm the maintainer of ssgoi.

Today we released ssgoi 2.5.2. The core focus of this version is mobile environment optimization.

Why Rebuild?

Previously, we relied on an external library for animation implementation. It was a choice made for rapid development.

But user feedback started coming in:

  • "It feels janky on mobile"
  • "It breaks when I switch apps and come back"
  • "It stutters on Galaxy devices"

The library we were using (an older version) didn't account for variable FPS at all.

"Let's build it ourselves."

How We Built It

Step 1: Study Good Code

We dissected GSAP's (20k stars) Ticker implementation:

  • Delta Time Clamping
  • Lag Smoothing
  • Adaptive Frame Rate

We analyzed Svelte Motion's spring implementation:

  • Semi-Implicit Euler
  • Allen Chou's normalization technique

We also referenced React Native Reanimated's native optimizations.

Step 2: Implement Core Optimizations

Semi-Implicit Euler

// Velocity first, position later (order matters!)
velocity += -2*dt*ΞΆ*Ο‰*velocity + dt*ω²*(target - position);
position += dt*velocity;

Variable FPS Defense Code

// 1. Clamp dt
dt = Math.min(dt, 0.1);

// 2. Handle background return
if (elapsed > 500) {
  startTime += elapsed - 33;
}

RAF Optimization

// Singleton pattern - call RAF only once
ticker.subscribe(animation.update);

Step 3: Real Device Testing

  • iPhone 13, 14 Pro
  • Galaxy S21, S23
  • Low-end Android (Galaxy A12)

Confirmed stable operation on all devices βœ…

It will be automatically applied when you update.

Detailed Technical Documentation

Optimization process and numerical analysis theory: https://velog.io/@k-svelte-master/optimize-anaimtion-performance-in-mobile

Closing Thoughts

Lessons learned from running an open-source library:

  • User feedback is most important
  • You need to read a lot of good code
  • Small optimizations add up to make a big difference

Thanks to your feedback, we've built a better library. Thank you! πŸ™


Github: https://github.com/meursyphus/ssgoi NPM: https://www.npmjs.com/package/ssgoi