toDataUrl format

Benchmark created on


Preparation HTML

<html>
  <style>
    canvas { border: 1px solid black;  }
  </style>
  <body>
    <canvas width="300" height="300" id="canvas"></canvas>
  </body>
</html>

Setup

const canvas = document.getElementById("canvas")
    const ctx = canvas.getContext("2d")
    ctx.fillStyle = "red"
    ctx.rect(10, 10, 280, 280)
    ctx.fill()

Test runner

Ready to run.

Testing in
TestOps/sec
png
const p = canvas.toDataURL("image/png")

ready
jpeg
const j = canvas.toDataURL("image/jpeg")
ready
webp
const w = canvas.toDataURL("image/webp")
ready

Revisions

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