javascript - DOM takes too long to react -
i'm trying "get" image file every 100ms changing source of dom object. can see call indeed returning correct image every 100ms, actual image display updates once second. here's javascript code work:
<img id="videodisplay" style="width:800; height:600"/> <script type="text/javascript"> function videodatapoll(filename) { settimeout(function() { document.getelementbyid("videodisplay").src = filename + "?random="+(new date()).gettime(); videodatapoll(filename); }, 100); } </script>
update: changed function use preloading follows:
<canvas id="videodisplay" style="width:800; height:600"/> <script type="text/javascript"> var x=0, y=0; var canvas, context, img; function videodatapoll() { var filename = getfilename(); canvas = document.getelementbyid("videodisplay"); context = canvas.getcontext("2d"); img = new image(); img.onload = function() { context.drawimage(img, x, y); settimeout("videodatapoll()", 100); } img.src = filename + "?random=" + (new date()).gettime(); } <script>
still updates @ same speed (which every 5 seconds, not 1s stated originally). every 50 requests (10/sec 5 seconds) element gets updated once.
another important note: second solution works on localhost, run issue when i'm running same webpage off of remote host.
i suggest use onload handler image instead of fixed timeout:
function videodatapoll(filename) { document.getelementbyid("videodisplay").src = filename + "?random="+(new date()).gettime(); } document.getelementbyid("videodisplay").onload = videodatapoll; videodatapoll(filename);
in case need filename inside function rather passing param.
Comments
Post a Comment