Run results for: Test style formats on canvas

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36

Browser: Chrome 120

Operating system: Mac OS X 10.15.7

Device Platform: Desktop

Date tested: 2 years ago

Benchmark engine: Benchmark.js

RGBA

2.3M/s

HEX

2.2M/s

RGB

2.0M/s

HSL

1.8M/s

View exact numbers

Script Preparation code:

const canvas = document.createElement("canvas");
var ctx = canvas.getContext("2d");

Tests:

RGBA
ctx.fillStyle = 'rgba(246,122,81, 1)'; ctx.fillStyle = 'rgba(81,246,94, 1)';
RGB
ctx.fillStyle ='rgb(246,122,81)'; ctx.fillStyle ='rgb(81,246,94)';
HEX
ctx.fillStyle = '#f67a51'; ctx.fillStyle = '#51f65e';
HSL
ctx.fillStyle = 'hsl(15, 90%, 64%)'; ctx.fillStyle = 'hsl(125, 90%, 64%)';