m
m mirrors the motion API but ships without built-in animation features. Wrap
your tree with <LazyMotion features={domAnimation} /> or domMax so
features are loaded through a provider instead of bundled with every motion.X import.
import { LazyMotion, m, domAnimation } from 'motion-solidjs'
function App() {
return (
<LazyMotion features={domAnimation}>
<m.div animate={{ opacity: 1 }} initial={{ opacity: 0 }} />
</LazyMotion>
)
}
Why m instead of motion?
Importing motion brings the full domMax feature set. m stays featureless until a
LazyMotion provider loads capabilities above it, which makes route-level feature splitting
possible.
| Component | Bundles features? | Use when |
|---|---|---|
motion | Yes (domMax) | One-page apps, prototyping |
m | No | You want fine-grained bundle control |