### Benchmarking RGBA extraction from integer

I bought a case I ought to convert integer RGBA worth to RGBA object. I in contrast the pace of two methods. I bought attention-grabbing outcomes. So I report right here!

An array of integers (e.g. 0xFF0000FF) is given and I must extract RGBA parameters individually.

Converts the colour array to Uint8Array in bulk and will get by indexes.

``````const array = new Uint8Array(new Uint32Array(colours).buffer)
const len = colours.size
const outcomes = []
for (let i = 0; i < len; i++) {
const a = array[4 * i]
const b = array[4 * i + 1]
const g = array[4 * i + 2]
const r = array[4 * i + 3]
outcomes.push({
r, g, b, a
})
}
return outcomes
``````

Merely makes use of a loop and apply bitmask and bit shifting.

``````const len = colours.size
const outcomes = []
for (let i = 0; i < len; i++) {
const c = colours[i]
const r = (c & 0xFF000000) >> 24
const g = (c & 0x00FF0000) >> 16
const b = (c & 0x0000FF00) >> 8
const a = c & 0x000000FF
outcomes.push({
r, g, b, a
})
}
``````

I ready 4 varieties of knowledge.

• HD: 1280 x 720
• Full HD: 1920 x 1080
• 4K: 3840 x 2160
• 8K: 7680 x 4320

I measured in 2 platforms Node.js and Chrome browser. I ran the identical course of ten occasions. The end result quantity is in milli seconds. In Node.js, the bitmask technique all the time wins. Nevertheless, in browser, UnitArray technique all the time wins!😂

Node.js (14.16.0 on Home windows 10)

HD 1501 556
full HD 3367 1379
4K 13706 4668
8K 71298 20553

Chrome browser (94.0.4606.81)