popmotionのバージョン一覧
Popmotionの後継
Motion
Framer Motion と Motion Oneを統合。Framer Motionが独立したプロジェクトになった。メインスポンサーはFramerとTailwind。作者はMatt Perry氏。
npm install motion
の場合、mini(motion/mini)がhybrid(motion)がimportで選べる。
Framer Motion
2024/11/12にmotionへ変更 Framer | Framer Motion
ノーコードweb制作ツール「Framer」内のアニメーションライブラリ。React用になっている。
Motion One
軽量なアニメーションライブラリ。jsのanimation関数を使用することによりパフォーマンスを高めている。inviewやscrollのユーティリティー関数もある。タイムラインに対応。
Popmotion
Popmotion
animate(), inertia()とユーティリティー関数の薄いライブラリ。おそらくReactやVueなどのライブラリで使えるようにdomを変更ぜずに数値のみを取得するライブラリなっている。x,yなどを自動に計算してくれず、それぞれ自分で計算する必要がある。Stylefireは読み込まれていない。
Popmotion Pure
v8(2020-09-03)で終了 Doc CDN
(CDNは”popmotion.js”か”popmotion.global.min.js”のいずれかを使う。”popmotion.min.js”は通常のpopmotion?)
Stylefireを使い、domに紐づいたアニメーションも行える。ある程度自動で計算してくれる関数が多数用意されているので、組み合わせて細かく調整できるが、独自の関数が多く理解が難しい。
Pose
2020年終了 Doc
React, Vueなど用にコンポーネント化されたライブラリ。終了後にReact用はFramar Motionになった。
Popmotionで使われているライブラリ
●Popcorn Doc CDN
アニメーションの進行状況(プログレス)を生成するための小さな関数群を提供するライブラリです。例えば、イージング関数やインターポレーションを簡単に扱うためのツールが含まれています。
●Stylefire Doc CDN
DOMエレメントのスタイルや属性を効率的に変更するためのライブラリです。特に、CSSプロパティやSVG属性に対してアニメーションを適用する際に利用されます。
●Framesync Doc CDN
リクエストアニメーションフレーム(requestAnimationFrame
)を使用して、アニメーションや物理演算を効率よく同期させるための低レベルライブラリです。これにより、複数のアニメーションや物理演算を同時に実行する際のパフォーマンスが向上します。