LazyMotion
For ease of use, the motion
component comes pre-bundled with all of its features for a bundlesize of around 34kb.
With LazyMotion
and the m
component, we can reduce this to 6kb for the initial render and then sync or async load a subset of features.
Read the Reduce bundle size guide for full usage instructions.
Props
features
Define a feature bundle to load sync or async.
Sync loading
Synchronous loading is useful for defining a subset of functionality for a smaller bundlesize.
Async loading
Asynchronous loading can ensure your site is hydrated before loading in some or all animation functionality.
strict
Default: false
If true
, will throw an error if a motion
component renders within a LazyMotion
component (thereby removing the bundlesize benefits of lazy-loading).
A Motion+ membership will give you early access to features & content, access to our private Discord, and more.
It's a one-time fee that grants lifetime access. No subscription necessary!