Basically ArrayBuffer is used to keep binary data. It can be the binary data of an image for example.
In other languages buffers are proved very useful. Yes, of course it is a little more difficult to understand/use than other data types.
ArrayBuffer can be used to get data of jpg image (RGB bytes) and produce a png out of it by adding alpha byte (i.e. RGBA).
Mozilla site has given a small use of ArrayBuffer here
Answer from Imdad on Stack OverflowWorking with complex data structures
By combining a single buffer with multiple views of different types, starting at different offsets into the buffer, you can interact with data objects containing multiple data types. This lets you, for example, interact with complex data structures from WebGL, data files, or C structures you need to use while using js-ctypes.
Consider this C structure:
struct someStruct { unsigned long id; char username[16]; float amountDue; };You can access a buffer containing data in this format like this:
var buffer = new ArrayBuffer(24); // ... read the data into the buffer ... var idView = new Uint32Array(buffer, 0, 1); var usernameView = new Uint8Array(buffer, 4, 16); var amountDueView = new Float32Array(buffer, 20, 1);Then you can access, for example, the amount due with
amountDueView[0].Note: The data structure alignment in a C structure is platform-dependent. Take precautions and considerations for these padding differences.
Basically ArrayBuffer is used to keep binary data. It can be the binary data of an image for example.
In other languages buffers are proved very useful. Yes, of course it is a little more difficult to understand/use than other data types.
ArrayBuffer can be used to get data of jpg image (RGB bytes) and produce a png out of it by adding alpha byte (i.e. RGBA).
Mozilla site has given a small use of ArrayBuffer here
Working with complex data structures
By combining a single buffer with multiple views of different types, starting at different offsets into the buffer, you can interact with data objects containing multiple data types. This lets you, for example, interact with complex data structures from WebGL, data files, or C structures you need to use while using js-ctypes.
Consider this C structure:
struct someStruct { unsigned long id; char username[16]; float amountDue; };You can access a buffer containing data in this format like this:
var buffer = new ArrayBuffer(24); // ... read the data into the buffer ... var idView = new Uint32Array(buffer, 0, 1); var usernameView = new Uint8Array(buffer, 4, 16); var amountDueView = new Float32Array(buffer, 20, 1);Then you can access, for example, the amount due with
amountDueView[0].Note: The data structure alignment in a C structure is platform-dependent. Take precautions and considerations for these padding differences.
An ArrayBuffer is a chunk of binary data in RAM. There are a few ways to "open" an ArrayBuffer for reading and writing:
Typed arrays, such as
Uint16Array, can read and write the buffer by treating it as an array of integers. They don't let you control endianness; it uses the CPU's preferred endianness.Uint8Arrayis useful for controlling individual bytes (copying, slicing, etc).DataViewis not as simple, but it gives you more control. It lets you choose the endianness, integer size, and byte index (e.g. you can access a 32 bit integer at an index that's not divisible by 32 bits). These things can be specified each time you read and write an integer with the sameDataView.
More info: https://javascript.info/arraybuffer-binary-arrays
ELI5: File, Uint8Array, Buffer, Arraybuffer, BytesArray, Blob…
How do I convert an ArrayBuffer to base64url and vice versa?
Question about loading MemoryStream in tab and saving to file
[AskJS] Suddenly blob creation from large typed array is no longer allowed?
I’m always ending up guessing.. I need to somehow understand. I have no idea what I’m doing when working with files. Just trying stuff until it works. Someone plz ELI5..
My current issue is getting a png file from Firebase storage which gives a “file” which I’m trying to add on a pdf, where the library expects a Uint8Array or Arraybuffer. I’ve been doing similar things before. But end up just guessing my way until it works, and this time.. well it doesn’t work. I guessed it all with no success. I don’t know what I’m doing so I guess I need to actually learn ;)