Open akinsella opened 2 months ago
As a side question: Is it required to return byteArrays (Array of Uint8Array) for any reason ?
The code below gives more performance, but it changes a bit the way it works as it returns only one byteArray in the returned array. The code below gives an additional 10% gain, but the memory used is still the same. Not 100% sure this simplified code does not introduce any new problem, though.
function b64toByteArrays(b64Data) {
const base64Marker = /^data:image\/(png|jpeg|jpg|webp);base64,/;
const base64 = b64Data.replace(base64Marker, "");
// Decode base64 string to binary string
const binaryString = atob(base64);
// Convert binary string to Uint8Array
const len = binaryString.length;
const bytes = new Uint8Array(len);
for (let i = 0; i < len; i++) {
bytes[i] = binaryString.charCodeAt(i);
}
return [bytes];
}
Hello,
I'd like to contribute some code improvement related to performance.
The function
b64toByteArrays
is critical for performance of the component as it makes heavy computation iterating on byteCharacters and so on.I wanted to improve this function as applied to many image it has a huge impact. I made some tests with a slightly different code that give great results:
Original code:
Propose code:
Here are the results of some naive benchmark, but hopefully, the improvement is significant even without advanced benchmark setup:
The benchmark was made on
Node.js v22.1.0
on MacOS.Here is the code used for the benchmark for the original code: (The same can be done for the new code)
I removed
contentType
parameter as well as it seems it is not used.Disclaimer: I have not made extensive checks across browsers to check performance and correctness except on Chrome, but basically there is no new API usage, just a slight change of the code for the sake of the performance.
I see the codebase of the library is not updated for quite some time now, hopefully this change may be applied anyway as the library is still widely used :)