animate

proc({ timer, clock, delta, time, frameCount }) - 各フレームごとに実行される関数 (デフォルト : () => { })。

timer (THREE.Timer) : フレーム間の時間を管理するオブジェクト。
clock (THREE.Timer) : フレーム間の時間を管理するオブジェクト。timerと同じものです(three.jsの変更に伴う後方互換性のために用意しています)。
delta (Number) : 前回のフレームからの経過時間（秒単位）。
time (Number) : アニメーション開始からの経過時間（秒単位）。
frameCount (Number) : アニメーション開始からのフレーム数。

renderFlag - レンダリングするかどうか (デフォルト : true)。

アニメーションループを開始します。
指定した関数を各フレームごとに実行し、レンダリングを行います。

コードの例

特にアニメーションするものがない場合、animate() のみでレンダリングを行います。
通常、animate() は3D描画の最後で呼び出します。

animate();

proc 関数の引数に経過時間を受け取り、アニメーションを行うことができます。

delta は前回のフレームからの経過時間を秒単位で表したもので、とても小さな値 (60fpsの場合、約 0.017) であることに注意してください。

animate(({ delta, time }) => {
  // なんらかの処理
})

postprocessing の利用時など、独自のレンダリング処理を行う場合は、renderFlag を false に設定します。
この場合、レンダリングは明示的に行う必要があります。

renderer および scene は init() の戻り値から取得できます。
以下のコードにおける animate は、上記のアニメーションしない例と同じ処理になります。

const { renderer, scene, camera, create, animate } = init();

...

animate(() => {
  renderer.render(scene, camera)
}, false)