Benchmark: Understanding the cost of structuredClone ImageData

Understanding the cost of structuredClone ImageData (version: 1)

Comparing performance of: Full Clone vs Transfer buffer vs Sallow Clone Buffer First vs Plain Object Instead of ImageData class vs Manual clone vs Just copy buffer vs Manual shallow clone into plain object vs structure clone plain object with dedicated buffer copy for transfer vs structure clone plain object with no transfer

Created: one year ago by: Registered User

Jump to the latest result

HTML Preparation code:

<!--your preparation HTML code goes here-->

Script Preparation code:

const width = 1920;
const height = 1080;

let a = new Uint8ClampedArray(4 * width * height);
for (let i = 0; i < a.length; i++) {
    a[i] = 64;
}

const img = new ImageData(a, width, height);

Tests:

Full Clone
const b = structuredClone(img);
Transfer buffer
const c = structuredClone(img, { transfer: [a.buffer]}); a = c.data;
Sallow Clone Buffer First
let newBuf = new Uint8ClampedArray(a.length); newBuf.set(a) let c = structuredClone(new ImageData(newBuf, img.width, img.height), { transfer: [newBuf.buffer]});
Plain Object Instead of ImageData class
const c = structuredClone( { data: a, width, height }, { transfer: [a.buffer] } ); a = c.data;
Manual clone
let newBuf = new Uint8ClampedArray(a.length); newBuf.set(a) const c = new ImageData(newBuf, img.width, img.height)
Just copy buffer
let newBuf = new Uint8ClampedArray(a.length); newBuf.set(a)
Manual shallow clone into plain object
let newBuf = new Uint8ClampedArray(a.length); newBuf.set(a) const c = { data: newBuf, width, height }
structure clone plain object with dedicated buffer copy for transfer
let newBuf = new Uint8ClampedArray(a.length); newBuf.set(a) const c = { data: newBuf, width, height } const d = structuredClone(c, { transfer: [newBuf.buffer]});
structure clone plain object with no transfer
const c = { data: a, width, height } const d = structuredClone(c)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Full Clone
Transfer buffer
Sallow Clone Buffer First
Plain Object Instead of ImageData class
Manual clone
Just copy buffer
Manual shallow clone into plain object
structure clone plain object with dedicated buffer copy for transfer
structure clone plain object with no transfer

Understanding the cost of structuredClone ImageData (version: 1)

Created: one year ago by: Registered User

Jump to the latest result

Full Clone

Transfer buffer

Sallow Clone Buffer First

Plain Object Instead of ImageData class

Manual clone

Just copy buffer

Manual shallow clone into plain object

structure clone plain object with dedicated buffer copy for transfer

structure clone plain object with no transfer

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results