投稿者: Idle Interface
-
減速ルーレットで学ぶ時間ベースアニメーション設計
← Prev Next → JavaScriptで「自然に止まる」アニメーションを作る これまで学んできたこと： 今回はそれらをすべて使って、 減速しながら止まるルーレットを作ります。 ここからが「設…
-
cancelAnimationFrameの正しい使い方と設計パターン
← Prev Next → 1. まずは結論 requestAnimationFrame は「動かす」ための関数でした。では 止めるときは？ 👉 それが cancelAn…
-
フレームレートとは？60fpsの仕組みとパフォーマンス最適化
← Prev Next → アニメーションが「なめらか」に見えるとき、裏ではある数字が動いています。 それが フレームレート（fps） です。 今回は、 を、できるだけやさしく整理…
-
easingとは？アニメーションの減速・加速を作る方法【cubic-bezierも解説】
← Prev Next → アニメーションが「どこか硬い」と感じたことはありませんか？ それは 速度が一定だから かもしれません。 そこで登場するのが easing（イー…
-
deltaTimeとは？requestAnimationFrameで正確なアニメーションを作る方法
← Prev Next → JavaScriptでアニメーションを作っていると、こんな現象に出会います。 原因はほぼ同じです。 フレーム数に依存して動かしていること。 それを解決するのが d…
-
requestAnimationFrameの使い方を初心者向けに解説【setIntervalとの違いも比較】
← Prev Next → 1. requestAnimationFrameとは？ JavaScriptで「なめらかなアニメーション」を作るときに使うのがrequestAnimationFrame（r…