36

私が行っているいくつかのプロジェクトでは、60fps はまったく必要ないと考えていました。そのフレームレートでスムーズに動作させることができれば、30 fps で動作するオブジェクトやものをもっと増やすことができると考えました。three.js 内で requestAnimationFrame shim を編集すれば、そのように 30 に制限できると考えました。しかし、提供されている three.js 自体を使用してこれを行うためのより良い方法があるかどうか疑問に思っていました。また、これにより、私が考えているようなパフォーマンスの向上が得られるでしょうか。30fps では 60 の 2 倍のオブジェクトをレンダリングできますか? 30 と 60 で実行することの違いはわかっていますが、スムーズに一定の 30 fps で実行することはできますか?

私は通常、WebGLRenderer を使用し、必要に応じて Canvas にフォールバックします。例外として、具体的に 1 つをターゲットにしているプロジェクト (通常は webgl シェーダー プロジェクト) を除きます。

4

5 に答える 5

81

このようなものはどうですか:

function animate() {

    setTimeout( function() {

        requestAnimationFrame( animate );

    }, 1000 / 30 );

    renderer.render();

}
于 2012-07-02T14:15:17.650 に答える
6

CPU と GPU が実行する必要のある作業量はワークロードによって異なり、スムーズ フレームレートの上限が設定されます。

  • GPU はほぼ直線的に動作し、常に同じ数のポリゴンをスクリーンにプッシュできます。

  • ただし、オブジェクトの数を 2 倍にした場合、CPU はこれらすべてのオブジェクトをアニメートするためにより多くの作業を行う必要があります (マトリックス変換など)。それは、あなたの世界モデルと Javascript が行うその他の作業に依存します。また、可視オブジェクトの数などの条件も重要です。

すべてのポリゴンが常に画面上にある単純なモデルの場合、「フレームレートを半分にして、オブジェクトを 2 倍にする」というルールにほぼ従う必要があります。シーンのような 3D シューティングゲームの場合、これは間違いなく当てはまりません。

于 2012-07-02T08:52:40.410 に答える