mrkeyoor.com_
Sun 06 Sept 16:34 UTC
Webevaluationupdated 06 Sept 2026

motion review

Motion is an MIT-licensed animation library for JavaScript, React, and Vue. It gives interface developers one set of tools for springs, gestures, layout changes, scroll effects, timelines, and browser-native animations instead of hand-building each effect.

Verdict

Our Motion run installed 1,646 packages, built in 62 seconds, and passed all 30 Jest tests, making the source a credible base for a production animation system. Pick it for React-heavy interfaces where layout, presence, gestures, and scroll effects would otherwise become separate homegrown utilities. Use CSS for a handful of simple transitions, and regression-test fast state changes and strict TypeScript installs before committing a design system to it.

We ran it

Lab card: what happened when we ran motionScreenshot of motion (motion.dev)
Install✓ · 159s1646 packages · 1065 MB
Build✓ · 62s
Tests✓ · 86s30 passed · 0 failed of 30 (jest)
Repo3201 files~110,615 lines of source · 289.6 MB · 1 CI workflows · tests dir

Answers from our run

Does motion build from source?

Dependencies installed in 159 seconds (1646 packages), and the build succeeded in 62 seconds. We cloned commit e871ba7 into a clean Debian container with 3 CPUs and no project-specific setup.

Do motion's tests pass?

Yes: 30 of 30 passed when we ran the project's own test command (jest). Some failures need services or credentials a bare container does not have.

Who should not use motion?

Sites that only need a few opacity or transform transitions: CSS avoids a library and is easier for a future maintainer to inspect.

What are the alternatives to motion?

GSAP, react-spring, Anime.js. Our Motion run installed 1,646 packages, built in 62 seconds, and passed all 30 Jest tests, making the source a credible base for a production animation system.

Setup4/5Every step passed, though the workspace used 1,065 MB
Docs5/5React, JavaScript, Vue, examples, and migration are clearly routed
Community5/533,507 stars with code and issue activity in September 2026
Maturity4/5All 30 tests passed; current presence and scroll bugs need care

Who it’s for

React teams that need coordinated enter, exit, layout, drag, hover, and scroll animation.
JavaScript developers who want a small runtime import for direct DOM animation and a larger API when a project grows.
Vue teams comfortable installing the separate motion-v package.
Design-system maintainers who need reusable animation primitives with TypeScript definitions and reduced-motion controls.

Who it’s NOT for

Sites that only need a few opacity or transform transitions: CSS avoids a library and is easier for a future maintainer to inspect.
React screens whose keyed content changes near an exit boundary without application-level tests: open issue 3803 reports AnimatePresence in wait mode becoming permanently stuck.
Strict-linker TypeScript projects that cannot tolerate a peer-type workaround: issue 3801 reports missing @types/react declarations under Bun isolated installs, pnpm, and Yarn PnP.
Teams expecting every advertised API and teaching resource under the MIT license: Cursor, Ticker, the transition editor, AI skills, and member material are sold through Motion+.
Occasional contributors who want a small checkout: our monorepo install pulled 1,646 packages and occupied 1,065 MB.

Setup reality

Our Yarn install succeeded in 159 seconds, adding 1,646 packages and using 1,065 MB. The build passed in 62 seconds, then all 30 Jest tests passed in 86 seconds. The 289.6 MB checkout contained 3,201 files and roughly 110,615 lines of source.

Using the published library needs no account or secret: install motion for React or JavaScript, or motion-v for Vue. Contributing is heavier because the Yarn 3.6.4 workspace contains multiple packages and development apps. Motion+ is optional and paid.

The runtime targets browser animation, so SSR boundaries, browser differences, React timing, and accessibility still need product-level tests. The repository has one CI workflow and a tests directory; no Dockerfile is expected for a client library.

Motion covers React, JavaScript, and Vue with related APIs

The React package provides components and hooks for declarative animation, while the JavaScript entry point can animate DOM elements directly. Vue uses the separate motion-v package. Across those routes, Motion covers keyframes, springs, gestures, layout transitions, scroll-linked effects, and timelines. The README also explains the naming change: Framer Motion is now Motion, and React users should import from motion/react.

The published API may feel compact, but the contributor repository is substantial. commit e871ba7 contained 3,201 files, roughly 110,615 lines of source, and 289.6 MB before dependencies. It is a Yarn workspace with the public packages, development applications, tests, build tooling, and size checks in one tree. Application developers install one package; maintainers entering the source have a monorepo.

The MIT core handles gestures, layout, scroll, and springs

Motion's strongest case is coordination. AnimatePresence keeps an exiting React child mounted long enough to animate out. Layout animation can move an element between measured positions, while gesture props connect hover, press, and drag state to visual changes. Motion values let several effects share changing state without forcing every frame through a React render. The JavaScript API can use native browser animation where the requested effect permits it.

That range has a local cost. Our clean install fetched 1,646 packages in 159 seconds and ended at 1,065 MB on disk. Most product users will see a much smaller dependency path than the full workspace, and the package manifests mark their output as free of side effects for bundlers. Still, anyone planning regular upstream work or a long-lived fork should budget for the full toolchain rather than judging effort from npm install motion alone.

What happened when we ran it

Our sandbox installed the Yarn workspace in 159 seconds, built it successfully in 62 seconds, and completed the available tests in 86 seconds. Jest reported 30 passed and 0 failed out of 30. The run used an unprivileged Node 22 Debian container with 3 CPUs, 8 GB of RAM, and no secrets. Those are clean results for the checked commit, with no failed step to explain away.

The repository scan found one CI workflow, no Dockerfile, a tests directory, and monorepo workspaces. A Docker image would add little for a browser library. More importantly, the 30 passing Jest tests do not measure animation smoothness, bundle size inside a particular application, browser power use, or visual behavior under real interaction. Our 86-second test result proves the supplied command passed in the stated environment and nothing broader.

Current issues expose timing and package-manager edge cases

Open issue 3803 describes an AnimatePresence wait-mode failure when child keys change close to exit completion. In the reporter's reproduction, the latest child can stop rendering and remain stale after updates finish. Issue 3791 concerns Safari elastic overscroll being reported with the wrong direction. These are narrow cases, yet both can affect visible application state. Presence, scroll, and layout behavior deserve browser tests built around the actual interface.

TypeScript users with strict dependency layouts have a separate concern. Issue 3801 reports that Motion's declaration files import React types without declaring @types/react as an optional peer. The reporter reproduced the problem with pnpm, Yarn PnP, and Bun's isolated linker. Our 30-test Jest run passed under the repository's own Yarn setup, so it does not contradict that consumer-install report. Test the package through the same linker and TypeScript settings used in production.

Motion+ keeps specific tools outside the MIT package

The core repository and packages use the MIT license. The README separately sells Motion+ as a one-time membership with lifetime updates. It lists premium Cursor and Ticker APIs, a transition editor, AI skills, member examples and tutorials, and a private Discord. That split is clear enough, but teams should check whether a prototype copied from the site depends on member code before promising that the whole interaction can ship from the free package.

Nothing in our 289.6 MB checkout or 1,065 MB installed workspace required Motion+ credentials. The open package already covers the common work: component animation, gestures, springs, layout, presence, and scroll. Motion+ makes sense when its specific APIs or teaching material save more time than the membership costs. It is not a required license upgrade for ordinary use of the repository.

September activity supports adoption despite open browser bugs

GitHub recorded 33,507 stars, 108 open issues and pull requests, and a last push on September 2, 2026. New issue activity landed that same day, so the queue and source both show current use. The latest-release API has no GitHub release record. The repository changelog instead dates 13.1.1 to August 18 and labels 13.2.0 as unreleased, which makes the changelog and package publishing flow more useful than GitHub Releases for version tracking.

Motion is the sensible default when a React product needs more than CSS transitions and the team wants one vocabulary for interaction and layout. Our 62-second build and 30-of-30 Jest result lower the risk of evaluating its source. The open timing, scroll, and strict-linker reports are reasons to add focused regressions, not reasons to dismiss the library. If animation remains decorative and simple, CSS leaves less code for the next engineer to learn.

Alternatives

ProjectWhat it isPick it when
GSAPA mature JavaScript animation system built around timelines, sequencing, and plugins.pick this instead when complex timeline control matters more than React-specific layout and presence components.
react-springA React animation library centered on spring physics and composable hooks.pick this instead when a spring-first mental model fits the interface and Motion's broader gesture API is unnecessary.
Anime.jsA framework-independent engine for DOM, SVG, object, and timeline animation.pick this instead when the project is framework-neutral and explicit timelines are the main requirement.

What people are saying

  1. [velocity-scout] motiondivision/motion
  2. [techcrunch-ai] Google’s Android update tackles motion sickness, accessibility, and more
  3. [hackernews] Why open source rocks – a new SM750 (Silicon Motion GPU) HDMI Driver
  4. [theverge] Here’s what data Comcast says its motion-detecting routers collect
  5. [theverge] I ruined my cats’ toilet time with a motion-activated neon litter box sign
  6. [mastodon-trends] Comcast adds motion sensing to millions of its newer routers, with a privacy catch | TechCrunch

Sources

  1. Motion README
  2. Motion repository
  3. Motion changelog
  4. AnimatePresence wait-mode bug report
  5. Strict-linker React types bug report
  6. Safari overscroll bug report

More web reviews

uni-app · saleor · uppy · Libraries.dev · FckSignups · mantine · the whole board →