For循环令人不安 [英] For loops are disturbing rendering

问题描述

我有一些非常简单的3D对象（基本上是 THREE.Sphere ，它是1-30其他 THREE.Sphere的父项） $ c> s，用RGB颜色和没有纹理）以实时的动画显示。

渲染确实很快，但我有一些简单的迭代计算（ for-loops ）会干扰我的显示功能。
渲染本身不是问题，但是下一个帧顶点的计算是造成痛苦的原因。

含义我只是运行该脚本，我可以看到 for-loops 需要花费太多时间来计算，然后才转到渲染部分， 。

我正在考虑以并行计算方式处理这个问题 - 运行一个线程（worker，无论它在 JS中调用），它会计算 for-loop ，但我认为考虑到我在计算机图形学方面缺乏经验，可能会有更图形化的方式这样做。这意味着处理这样一个计算机图形设计的基本问题将会更加优雅/改进性能/自然的方式。 解决方案

我正在使用这个基本思想来做很长时间的计算，而这些计算不会被看门狗定时器捕捉到，并会导致浏览器或渲染速率下降。
基本思想是你使用一个javascript生成器，它允许你在计算过程中屈服，然后继续。然后，我在超时链上运行发生器泵。
此方法的关键是保存函数状态并返回等待将来调用.next（）函数的yield运算符。 （顺便说一下，这个演示代码可能需要重新编排以处理firefox的前向引用）



  //函数链代表慢代码
函数*链（）
 {
 for（i = 0; i <1000000; i ++）//这表示一个很慢的计算
 {
 if（i％ 100 == 0）//在会话中产生
收益; 
} 
 
} 
 console.log（starting chain）; 
 gChain = Chain（）; //启动并获取下一个生成器指针
 timeout = setTimeout（function（）{ChainStart（）;}，1）; 
 //函数ChainStart是一个使用超时链运行生成器的泵，所以其他线程可以运行
函数ChainStart（）{
 if（gChain.next（）。done）{
 clearTimeout（timeout）; 
 console.log（endingchain）; 
} 
 else {
 clearTimeout（timeout）; 
 timeout = setTimeout（function（）{ChainStart（）;}，1）; 
} 
} 
  




I have some pretty simple 3D objects (basically THREE.Sphere which is a parent of 1-30 other THREE.Spheres, with RGB color and no texture) to display in somewhat real time animation.

The rendering is done in no time indeed, but I have some simple iterative calculation (for-loops) that are disturbing my display capabilities. The rendering itself is not the problem, but the computation for the next frame vertices is what causing the pain

Meaning, when I just run the script, I can see that the for-loops are taking too much time to compute, and just then it goes to the rendering section which is done in no time.

I was thinking of dealing with this problem in a parallel computing manner- running a thread (worker, whatever it is called in JS) that would calculate the for-loop, but I thought that considering my lack of experience in computer graphocs, perhaps there is a more "graphic"ed way of doing so. Meaning a more elegant/performance-improved/natural way of dealing with such a fundamental problem of computer graphics design.

解决方案

This is the basic idea I am using to do long slow calculations that don't get caught by the watchdog timers and bog down the browser or the render rate. The basic idea is that you use a javascript generator that allows you to yield in the middle of a computation, and continue later on. Then, I run the generator pump on a timeout chain. The key to this method is the "yield" operator that saves the function state and returns awaiting a future call to the .next() function. (btw this demo code might have to be re arraged to handle firefoxs forward references)

 //function Chain represents the slow code
function *Chain()
{
    for(i=0;i<1000000;i++)  //this represents a long slow calculation
    {
        if(i%100==0)        //on occassion, yield 
            yield;
    }

}
console.log("starting chain");
gChain=Chain(); //startup and get the next generator pointer
timeout = setTimeout(function () { ChainStart(); }, 1);
 //function ChainStart is a pump that runs the generator using a timeout chain so other threads can run
function ChainStart(){                 
        if(gChain.next().done){
            clearTimeout(timeout);
            console.log("endingchain");                 
        }
        else{                       
            clearTimeout(timeout);
            timeout = setTimeout(function () { ChainStart(); }, 1);
        }
}

这篇关于For循环令人不安的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！