Canvas Shadow vs Noshadow

Benchmark created by Andrei on

Preparation HTML

<canvas id="canvas"></canvas>

Setup

var canvas = document.getElementById('canvas'),
    c = canvas.getContext('2d');

Test runner

Ready to run.

Testing in
TestOps/sec
Text with no shadow
c.fillStyle = "black"; 
c.fillRect(0,0,canvas.width,canvas.height); 
 
c.font = 'bold 80pt Arial'; 
c.fillStyle = "#55cc55"; 
c.fillText("ALIEN",30,200);
ready
Text with shadow
c.fillStyle = "black"; 
c.fillRect(0,0,canvas.width,canvas.height); 
 
c.shadowColor = "white"; 
c.shadowOffsetX = 0; 
c.shadowOffsetY = 0; 
c.shadowBlur = 30; 
 
c.font = 'bold 80pt Arial'; 
c.fillStyle = "#55cc55"; 
c.fillText("ALIEN",30,200);
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.

  • Revision 1: published by Andrei on