gitwtfhub

wtf is wobble?

skevy/wobble — explained in plain English

Analysis updated 2026-07-17 · repo last pushed 2023-02-10

861TypeScriptAudience · developerComplexity · 2/5DormantSetup · easy

TL;DR

Wobble is a tiny 1.7KB spring-physics animation library that makes UI elements bounce and settle naturally, using the same math Apple uses to animate iPhone and Mac interfaces.

Mindmap

mindmap
  root((repo))
    What it does
      Simulates spring physics
      Animates a single value
      Natural bounce motion
    Tech stack
      TypeScript
      Spring equations
    Use cases
      Bouncy button animations
      Sliding menus
      Smooth value transitions
    Audience
      Frontend developers
      UI designers

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Why would anyone build with this?

REASON 1

Make a button or modal pop onto screen with a natural bounce instead of an instant jump.

REASON 2

Animate a slider so it snaps to a value with realistic spring physics.

REASON 3

Smoothly animate between changing dashboard data values.

REASON 4

Drive camera or character motion in a game with physics-based easing.

What's in the stack?

TypeScript

How it stacks up

skevy/wobblesilvertakana/worldwideviewportabase/portabase
Stars861874843
LanguageTypeScriptTypeScriptTypeScript
Last pushed2023-02-10
MaintenanceDormant
Setup difficultyeasymoderatemoderate
Complexity2/54/53/5
Audiencedeveloperdeveloperops devops

Figures from each repo's GitHub metadata at analysis time.

How do you spin it up?

Difficulty · easy Time to first run · 5min

Single-purpose library with no framework integration built in, you wire it into your own animation loop.

Wtf does this do

Wobble is a tiny animation library that makes things move and bounce in a natural, realistic way. Instead of objects jumping instantly to a new position, wobble simulates how a real spring would behave, it stretches, overshoots a bit, then settles down with a satisfying bounce. You use it to add physics-based motion to anything in your app: a button expanding when clicked, a slider snapping to a value, a menu sliding in, or any value you want to animate smoothly. The magic happens because wobble uses real physics equations that describe how damped springs actually work. Rather than calculating motion frame-by-frame (the way many animation libraries do), it solves the math problem upfront and can tell you exactly where something should be at any point in time. This approach, borrowed directly from how Apple animates things on iPhone and Mac, is faster, more accurate, and lets you build smooth, interruptible animations. You control four knobs: stiffness (how tight the spring is), damping (how much friction slows it down), mass (how heavy the object is), and initial velocity (whether it starts moving). Tweak these and you get everything from a snappy, springy feel to a slow, heavy bounce. Anyone building interactive web or mobile interfaces could use this. A designer implementing a polished UI in React might use wobble to make a modal pop onto screen with a bounce. A game developer might use it for camera movement or character animations. A dashboard might use it to smoothly animate between data values. The library is only 1.7 KB compressed, so small it won't bloat your bundle, and it handles only one job: animating a single number from point A to point B with spring physics. You plug it into your animation loop, listen for updates, and move your visual elements based on the values it gives you each frame. The README is honest about what this library won't do: there's no built-in integration with React or Vue, no multi-dimensional springs (just single numbers), and no helper for chaining springs together. That's intentional. The author kept the scope minimal so the library stays tiny and focused, letting you build exactly the abstraction you need on top of it rather than forcing their opinions on you.

Yoink these prompts

Prompt 1
Show me how to use Wobble to add a bouncy pop-in animation to a React modal.
Prompt 2
Explain how stiffness, damping, mass, and initial velocity change Wobble's spring feel.
Prompt 3
Help me wire Wobble's output values into my own animation loop for a canvas element.
Prompt 4
Compare Wobble's spring-physics approach to frame-by-frame animation libraries.

Frequently asked questions

wtf is wobble?

Wobble is a tiny 1.7KB spring-physics animation library that makes UI elements bounce and settle naturally, using the same math Apple uses to animate iPhone and Mac interfaces.

What language is wobble written in?

Mainly TypeScript. The stack also includes TypeScript.

Is wobble actively maintained?

Dormant — no commits in 2+ years (last push 2023-02-10).

How hard is wobble to set up?

Setup difficulty is rated easy, with roughly 5min to a first successful run.

Who is wobble for?

Mainly developer.

View the repo → Decode another repo

This repo across BitVibe Labs

Don't trust strangers blindly. Verify against the repo.