How do I get the actual size in bytes for a number and a string in JavaScript in a browser environment?

Question

I am trying to get the actual size (in bytes) of a number and a string in browsers e.g. chrome.

I learned that in JavaScript numbers are represented in double precision takes up 64 bits and strings are UTF-16 code unit so it takes either 2 bytes or 4 bytes.

I first tried to use new Blob but it encodes string component characters as UTF-8 not UTF-16. And I know there is a Buffer.from API in Node but it is not available in a browser environment.

My question is how I can get the actual size of a number and a string in bytes from a browser, e.g. chrome?

• Jared Smith: "I am trying to get the actual size (in bytes) of a number and a string in browsers e.g. chrome" it is unclear what you mean by this. If you mean the amount of memory allocated in bytes to hold that data, you can't (AFAIK). If you mean the amount of memory that the data itself takes up, this is trivially easy as it has nothing to do with the browser or Javascript or the browser: UTF-16 and integers are what they are. If you mean the byte representation of the data, then this and...
• Jared Smith: ...[cont'd] this should suffice.

Answer 1

You can do that natively with the help of TextEncoder

let str1 = 'Beta'; // 'Beta' text in English
let str2 = '贝塔'; // 'Beta' text in Chinese
const encoder = new TextEncoder();
const len1 = encoder.encode(str1).length;
const len2 = encoder.encode(str2).length;
console.log(len1); // 4
console.log(len2); // 6

• anubhava: I didn't know TextEncoder

Answer 2

First of all it is important to realize that the spec doesn't mandate any representation. Just behavior.

Strings are stored in UTF-16 but fortunately for your purpose each index represents 16 bits.

For example

console.log('😠'.length); // Should log 2 because emoji takes 2 16 bit parts

For numbers it depends. V8 represents small integer numbers as actual 32 bit ints.

• Joji: thanks! I think the spec does mandate the string to be encoded in UTF-16? anyway, does str.length give numbers of code units of the string? About number, if the number is not smi but a heap number or a floating point, is it going to be 32 bits?
• peter duffy: @Joji str.length gives the number of utf 16 code units. If you want the number of unicode characters you can do [...str].length. Numbers in V8 are either SMI or 64 bit floats.
• Joji: does the size of a number differ between 32 builds and 64 builds?

Answer 3

With https://github.com/substack/node-browserify you can work with buffers in the Browser by using: https://github.com/toots/buffer-browserify.

//in your browsify js file:
require('buffer')
Buffer.byteLength(String.fromCharCode(55555), 'utf16')
Buffer.byteLength(String.fromCharCode(55555, 57000), 'utf16')

Answer 4

iconv-lite: Pure JS character encoding conversion

var iconv = require('iconv-lite');
var buf =iconv.encode("Hello World", 'utf16');
console.log(buf);
console.log(buf.length); // returns 24

Answer 5

Here is my answer to your problem :

 function getBytesFromVar(theVar) {
 if(theVar !== null && theVar !== undefined) {
 
 switch (typeof theVar) {
 case 'string' : {
 var encoder = new TextEncoder();
 encoder['encoding'] = "utf-16";
 return encoder['encode'](theVar).length * 2;
 }
 case 'number' : {
 return 8;
 }
 case 'boolean' : {
 return 4;
 }
 case 'object' : {
 if ( theVar instanceof String) {
 var encoder = new TextEncoder();
 encoder['encoding'] = "utf-16";
 return encoder['encode'](theVar.toString()).length * 2;
 } else {
 return 0;
 }
 }
 }
 }
 else {
 return 0;
 }
 }

The getBytesFromVar function take a var and return the number of byte used.

Function use TextEncoder to get the string length and then calculate the bytes.

In case of a string created with:

let str = new String('Alain♥');

function will work with String objects.

ATTENTION: this can't be used to calculate memory footprint in browser as other mechanism of memory management can increase/decrease this values.

Vars can be allocated in different memory segment. For example, String object are created on the heap and string vars are created on string constant pool.

Also vars are manipulated through pointer.

For example, 2 strings vars that contain the same string are created on the string constant pool. First will be allocated, but the second one will be a pointer to the first one. So the size in memory byte will not be simply twice the size of the string.

Good post about that: https://levelup.gitconnected.com/bytefish-vs-new-string-bytefish-what-is-the-difference-a795f6a7a08b

Use case:

 var myString='Alain♥';
 var myNumber = 120; 
 var objString = new String('Alain♥');
 var myFloat = 105.456;
 
 console.log('%o is %o bytes', myString, getBytesFromVar(myString));
 console.log('%o is %o bytes', myNumber, getBytesFromVar(myNumber));
 console.log('%o is %o bytes', objString, getBytesFromVar(objString));
 console.log('%o is %o bytes', myFloat, getBytesFromVar(myFloat));

Answer 6

I have used the npm module object-sizeof for this. You can use it to get the size of integer or string variables in bytes. This is a sample usage,

 var sizeof = require('object-sizeof');
 console.log(sizeof(123)); //prints 8