Variable Refresh Rates

-=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- (c) WidthPadding Industries 1987 0\|619\|0 -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=-
Socoder -> Web Development -> Variable Refresh Rates
Fri, 30 Sep 2022, 06:48
Jayenkai	Framerate Spinal's phone has that newfangled Variable Refreshrate going on, and my code is struggling!!! <html> <script> var tick=[]; var tick2=[]; var FPSTest=0; var LastFrameMills=0; var FPSTest2=0; var LastFrameMills2=0; function Mills() { return performance.now(); } function OldMills() { //return performance.now(); var d = new Date(); return(d.getMilliseconds()+(d.getSeconds()1000)+(d.getMinutes()60000)+(d.getHours()3600000) ); } function init() { canvas = document.getElementById("Timeline"); context = canvas.getContext("2d"); for (m=0;m<100;m++) { tick[m]=0; tick2[m]=0; } FRid=requestAnimationFrame( heartbeat ); } function heartbeat() { console.log("Boop"); FPSTest=Mills()-LastFrameMills; LastFrameMills=Mills(); FPSTest2=OldMills()-LastFrameMills2; LastFrameMills2=OldMills(); context.clearRect(0, 0, canvas.width,canvas.height); // Clears the canvas context.beginPath(); context.fillStyle = "rgba(0,0,0,1)";context.strokeStyle = "rgba(128,40,40,1)"; context.lineWidth = "1";context.lineJoin = "round";context.lineCap = "round"; context.moveTo(0,120); context.lineTo(640,120); context.moveTo(0,120-66.6); context.lineTo(640,120-66.6); context.moveTo(0,120-33.3); context.lineTo(640,120-33.3); context.moveTo(0,120-16.667); context.lineTo(640,120-16.667); context.stroke(); context.closePath(); context.beginPath(); context.fillStyle = "rgba(128,40,40,1)";context.strokeStyle = "rgba(128,40,40,1)"; context.lineWidth = "4";context.lineJoin = "round";context.lineCap = "round"; context.moveTo(0,120); tick[100]=FPSTest; for (m=0;m<100;m++) { tick[m]=tick[m+1]; context.lineTo(m6,120-tick[m]2); } context.stroke(); context.closePath(); context.beginPath(); context.fillStyle = "rgba(40,80,190,1)";context.strokeStyle = "rgba(40,80,190,1)"; context.lineWidth = "4";context.lineJoin = "round";context.lineCap = "round"; context.moveTo(0,120); tick2[100]=FPSTest2; for (m=0;m<100;m++) { tick2[m]=tick2[m+1]; context.lineTo(m6,120-tick2[m]*2); } context.stroke(); context.closePath(); if (FRid) {window.cancelAnimationFrame(FRid);} FRid=requestAnimationFrame( heartbeat ); } </script> <body onload="init()" style="background:#DDDDFF;"> <canvas id="Timeline" width="600px" height="120px"> </body> </html> --v Here's a nice and simple basic test thing. Top line is 30fps, middle is 60, bottom is 120. (or.. roughly.. thereabouts.. bit wiggly!) If everyone would like to take a screenshot of that, on whatever systems they can try it on, and let me know the system/browser combo, it'll help a ton, but especially Spinal!!! If this is fine, then I know it's something else that's causing the issues in my current SpikeDislike test. If it's as erratic as his gameplay tests are showing, then.. Good! I have something to work towards! Code for the script is above, if you want to make any suggestions that might help clamp down the framerate, that'd be great. Ta much! Jay! You can try the FPS Tester online, here. Also, what phone is it, Spinal? I might be able to Google it better! -=-=- ''Load, Next List!''
Fri, 30 Sep 2022, 07:03
spinal	This is on my phone, a google pixel 6 pro, using chrome. And desktop, chrome, windows 10, -=-=- Check out my excellent homepage!
Fri, 30 Sep 2022, 07:05
Jayenkai	Grrr!!! OK, so the framerate's not the issue. Must be something else. Ta muchly! -=-=- ''Load, Next List!''

Framerate