HTML Preparation code:
AخA
 
1
<canvas id="canvas" width="800" height="300"></canvas>
Script Preparation code:
x
 
$canvas = document.getElementById('canvas');
$context = $canvas.getContext('2d');
$context.clearRect(0, 0, 800, 300);
$iterations = 500;
Tests:
  • Not saving and restoring context state

     
    for (let i=0; i<$iterations; ++i) {
      $context.fillStyle = 'rgba(100,150,200,0.9)';
      $context.fillRect(0, 0, 1, 1);
    }
  • Saving and restoring context state

     
    for (let i=0; i<$iterations; ++i) {
      $context.save();
      $context.fillStyle = 'rgba(100,150,200,0.9)';
      $context.fillRect(0, 0, 1, 1);
      $context.restore();
    }
Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

  • Test case name Result
    Not saving and restoring context state
    Saving and restoring context state

    Fastest: N/A

    Slowest: N/A

Latest run results:
Run details: (Test run date: 2 months ago)
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36
Chrome 130 on Mac OS X 10.15.7
View result in a separate tab
Test name Executions per second
Not saving and restoring context state 4360.7 Ops/sec
Saving and restoring context state 2477.9 Ops/sec