流体シミュレーションを実行するのにJavaScriptが十分速くないのですか？

Question

私は現在、P5jsで小さな流体シミュレーションを実装しようとしています。ランダムな色で20Kの正方形をレンダリングしようとしました。私は2.xxxのフレームレートを得ました。

var sim; 
var xdim = 200; var xLength; 
var ydim = 100; var yLength; 

function setup() { 
    createCanvas(800,400); 
    sim = new Sim(xdim, ydim); 
} 

function draw() { 
    xLength = width/xdim; 
    yLength = height/ydim; 
    for (var i = 0; i < xdim; ++i) for (var j = 0; j < ydim; ++j) { 
    fill(100); 
    rect(i*xLength, j*yLength, xLength, yLength); 
    } 
    console.log(frameRate()); 
} 

どのような問題がありますか？図書館は十分ではありませんか？または、コンピュータの設定が不良ですか？または、javascriptはこの種の実装には適していませんか？

Answer 1

コードのデバッグにはMCVEが必要です。具体的には、Simクラスを提供していないため、コードを実行することはできません。

しかし、あなたは一歩踏み込んでこれに尋ねる必要があります。どのようなパフォーマンスが期待されますか？

また、パフォーマンスヒットを見る前に表示できる正方形の数を知りたいかもしれません。

そこからは、最適化を探しているゲームです。パフォーマンスのヒットがどこにあるかを正確に理解するためには、プロファイリングを行う必要があります。おそらく、より少ない四角形を表示したり、フレームレートを低くしたり、プレレンダリングを行うことがあります。繰り返しますが、あなたがすることは、あなたの期待と目標が何であるかによって決まります。

私はあなたのループのうちconsole.log()に電話する必要があると言います。デバッグにのみ使用してください。パフォーマンスを向上させずに、すべての単一フレームを呼び出すことができます。