i know maybe not possible. have searched web without suceess
i have while loop , want 2 things:
- update textarea formatted information
- update width of div (a progress bar).
the first function has 4-5 additional sub-functions.
basically have 6 elements numerical array. have custom format function create formatted string elements numbers. etc.
if (reg_index/reg_total > last_refresh) { window.settimeout ( function() { document.getelementbyid("progress_line").style.width = "" + 100 * last_refresh + "px"; document.getelementbyid("progress_value").innerhtml = my_format( 100*last_refreh, "###" ) + "%"; }, 5 ); last_refresh+=0.01; }
ok, i'm unable define right timeout interval want.
can point me useful link?
thanks.
the problem you're having here all of functions use last value of last_refresh
. when define function, has enduring reference variables in scope, not copy of values when it's created. more: closures not complicated
you this:
function update() { if (reg_index/reg_total>last_refresh) document.getelementbyid("progress_line").style.width =" "+100*last_refresh+"px"; document.getelementbyid("progress_value").innerhtml=my_format(100*last_refreh,"###")+"%"; last_refresh+=0.01; settimeout(update, 0); // or 5 or whatever } } update();
that uses function bit of work, schedules more of work in moment. closes on reg_index
, reg_total
, , last_refresh
variables.
if know needs run @ least once, can make more efficient:
function update() { document.getelementbyid("progress_line").style.width =" "+100*last_refresh+"px"; document.getelementbyid("progress_value").innerhtml=my_format(100*last_refreh,"###")+"%"; last_refresh+=0.01; if (reg_index/reg_total>last_refresh) settimeout(update, 0); // or 5 or whatever } } update();
to concept of looping settimeout
, compare standard loop (the browser doesn't update until end): live copy | live source
var = ["zero", "one", "two", "three", "four", "five"]; var index; (index = 0; index < a.length; ++index) { display("entry " + index + " " + a[index]); }
...with equivalent using settimeout
, yields browser on every iteration can update (and if interval 0
, runs more slowly — i've used 200
here can see run): live copy | live source
var = ["zero", "one", "two", "three", "four", "five"]; var index; index = 0; update(); function update() { display("entry " + index + " " + a[index]); ++index; if (index < a.length) { settimeout(update, 200); } }
below you've said:
unfortanetly cant apply @ example.... have main loop 2000 reads on local database.... have done works using timeouts code spends lot of time
i deal breaking things in chunks (or see below alternative), example: live copy | live source
var index; var total = 10000; // 10,000 in total index = 0; update(); function update() { var limit = math.min(index + 100, total); // them 100 @ at time while (index < limit) { if (index % 10 == 0) { display("process entry #" + index); } ++index; } if (limit < total) { settimeout(update, 200); } }
choose size of chunks you're updating (yield) enough, not updating (yielding) lose time. above based on number of loops, way let run (say) 1 full second , yield. can lot of work done in second.
the other alternative use web workers, @ least on the browsers support them. my other answer here on stack overflow has discussion , example.
even if use web workers, though, you'll want break work chunks, because if have 2,000 records through, doesn't make sense update progress bar 2,000 times &mdasdh; you'll updates human can't readily perceive. 100 updates more enough, 20 (so, 100 records/chunk) fine.
Comments
Post a Comment