Nodachisoft Nodachi Sword Icon
  
@Amaji✎ Update October-4-2020

Check the memory limit that the browser can handle

The maximum amount of memory that can be handled by a browser is different.

When developing a browser application, Web applications that work with JavaScript (free games of your own creation) and I was wondering how much memory is available for SPA etc., so I summarized what I checked.

Summary of environment and contents to check.

  • Check for strict memory usage limits.
  • Confirmed Operating Systems are Win10 and Android 9.
  • Browsers: IE11, Edge, Chrome, Firefox (desktop and smartphone)

In Canvas, which is often used in browser games to take advantage of the graphic performance, there seems to be a specific memory limit available, so you need to be careful. I'd like to verify that separately.

How to check.

The actual way to check is to create a 0.5 M (500,000) string and pack it as an associative array in a global variable with a unique key to see how far you can pack it in.

A string made up of a sequence of 0.5 M (500,000) digits would require 1 Mbyte of space inside the browser in Unicode UTF-16.

How many strings of 1MBtyte can be stored in the memory limit?

Please note that this is just a guideline.

Detailed specs of the device I measured.

The specs of the devices I measured are as follows.

Desktop Version

  • OS : Windows 10 Home
  • Physical memory: 8 GB
  • Virtual Memory : 20 GB

smaller version

  • OS : Android 9
  • Model : Sony Xperia XZ2 H8296 Build/52.0.A.11.32
  • Physical memory : 4 GB

Code and screen for measurement.

code for measurement

Here is the source code that I made by measurement. Save the following as html, open it in your browser, and press the "Start calc" button. The measurement can be started.

 
CheckMemoryLimitHTML.html
<html lang="ja"><head><title>Calc Memory Limit</title>
<script type="text/javascript">
var count = 0;		// How many 1MByte strings do we have in our possession?
var globalVar = [];	// The destination for storing the 1MByte string
function getRandomInt(min,max) {return Math.floor(Math.random() * Math.floor(max-min)+min);}
function id(name) { return document.getElementById(name); }
function calc() {
	try {
		let genBuffer = "";
		for ( i = 0 ; i < ( 1024 * 1024) / 16  ; i++ ) {
			genBuffer += getRandomInt(12345678, 99999999).toString();
		}
		globalVar[count] = genBuffer;	// Store a 1MByte string
		count++;						// count up
		id("addmemorysize").innerHTML = genBuffer.length * 2;
		id("memorysize").innerHTML = (genBuffer.length * count * 2);
		setTimeout(calc, 10);			// Recall in 1msec
	} catch ( e ) {	 // Out-Of-Memory Check to see if the exception can be caught
		console.error("name=" + e.name + ", message=" + e.message );
	}
}
</script>
</head>
<body><h1>Calc Memory Limit:</h1><div>
	<input type="button" value="Start Calc" onclick="calc()"><br />
	Buffer Unit Length: <span id="addmemorysize">0</span>Bytes / 10msec<br />
 	Used Buffer Length: <span id="memorysize">0</span>Bytes
</div></body></html>

If you want to run it in your own environment, copy the above and save it locally as an html file and load it in your browser.

attention

You can also use it in the same way as a regular browser. I think that there is not so much that an evil influence involving the OS is running, but be careful just in case.

Google Chrome (desktop 64bit version)

The latest version of Google Chrome (desktop 64-bit version), ver 80.0, can handle up to 4GB of memory per tab as of April 2020.

original story

See the V8 engine specification and the Chromium forum. I've included a link in the reference section at the bottom of the page.

If you actually run the JavaScript for memory measurement, you'll notice that after allocating roughly 2.1 GB of heap space on the JavaScript VM that you can see on the development console, Chrome says Paused before potential out-of-memory crash and the exception The log was output to the console and stopped when it detected a step before the forced termination.

![Stop Chrome before memory crash] (. /chromebeforeoutofmemory_crash.png)

At this time, when I checked the memory usage with the Windows task list command, I found that it was also using about 2.2 GB as a Chrome process in the target browser tabs, which is roughly equivalent to the JavaScript VM.

tasklist

The memory capacity of my PC was still sufficient, but when I was processing images in a crunchy way, I had to use the You may need to be careful.

Internet Explorer 11 (desktop 32bit version)

After allocating about 1.6 GB of memory, the browser crashed and restarted, and Out of Memory exception detection doesn't seem to be possible. Internet Explorer 11 stopped before memory crash

As of April 2020, Internet Explorer 11 is too old to use but is still being used in systems and web services in public offices in specific country like Japan, accounting for about 5-10% of all Internet access in Japan. (*Survey by StatCounter and others] (https://gs.statcounter.com/browser-market-share/all/japan/#monthly-202001-202007))

The reality is that IE11 is rarely used and web services are created based on Edge and Chrome.

How long will web apps support IE11?

Until Microsoft completely drops support for IE11, it will continue to be used as a web service and usage browser until 2025-2027 or so, for reasons such as accessibility and maintenance on older devices.

Edge (64bit version of the EdgeHTML desktop)

The Edge browser is getting a major update on January 15, 2020, changing the browser's engine from Microsoft's own EdgeHTML to Chromium, an open source browser published by Google.

It was updated to a Chromium-using version from April 2020 via the Windows Update in Japan. So for future web apps that we publish on the Internet, we don't need to worry about the results of the Edge browser using this old EdgeHTML engine so much, it's just a reference for the excessive period.

As a result, the browser crashed and restarted after about 3.8 GB. The image was captured before the crash. Edge stopped before memory crash

Note that the Edge browser, which uses the EdgeHTML engine, looks like the image name of the process used for browser rendering is "MicrosoftEdgeCP.exe", but from Chromium it's a different process name, so be careful when monitoring tasks.

Edge (Chromium Desktop 64bit version)

The Edge Chromimum version crashed when it was able to allocate up to 0.8 GB of buffer space. It seems that the process is able to allocate up to 2.23 GB, which is numerically the same as the Chrome version. In the Chromium version, the image name of the process is changed to "msedge.exe".

Safari.

I don't have MacOS or iPhone on my device, and Apple has only released Safari for Windows up to version 5.17 in 2012, so I don't want to measure it. I'd like to update the information when I have a chance to measure it on Mac OS.

I will update the information when I have a chance to measure it on Mac OS.

The last Safari for Windows

Firefox (desktop 64bit version)

I checked with the latest version 75.0 (64 bit) on April 15, 2020. On the screen, after allocating a buffer of about 1.4 GB, the browser crashed and became unresponsive.

In fact, when I checked the amount of memory used by the Firefox process, it crashed using up to about 4.3 GB.

Presumably, the reason is that the source strings created in the course of the string merging process are pooled like a StringBuffer and continue to be used, and are not subject to being released from memory space.

It may be simply because Firefox's garbage collection has not been activated to free the unwanted memory.

string pool

I think the problem is that internally pooled strings continue to be possessed because of the increase or decrease in the size of the buffer allocations when the string join part is tweaked.

process at the time of the Firefox memory crash

Chrome for Android

It crashed with a buffer area of about 400MB. In fact, I was able to allocate about 1.1 GByte as a Chrome app process in Android, and the You won't be able to grab it with a try-catch, but you'll see a crash screen like this

process at the time of Chrome's memory crash

Firefox (for Android)

The results were exactly the same as the desktop version. Please refer to the desktop version.

Conclusion.

I think the string concatenation and pooling process varies from browser to browser, so there is a difference between the apparent size of the allocated memory and the actual available memory area.

The difference between "size allocated by the buffer" and "memory allocated by the process" is so large that the result is a bit subtle, but modern browsers seem to be able to allocate memory in GBs without problems.

You need to be careful about memory leak, but you don't need to allocate memory by paying attention to the upper limit every time you allocate memory, and make frequently to be able to release it.

browser string length of allocated buffer memory allocated by process
Google Chrome Ver 81.0
Desktop 64bit version
0.8 GB 2.3 GB
Internet Explorer 11
Desktop 32bit version
0.45 GB 1.6 GB
Old Edge Ver 44.0
EdgeHTML Desktop 64bit version
2.8 GB 3.6 GB
Edge Ver 81.0
Chromium Desktop 64bit version
0.8 GB 2.3 GB
Firefox Ver 75.0
Desktop 64bit version
1.4 GB 4.3 GB
Google Chrome Ver 81.0
Android version
0.4 GB 1.1 GB
Firefox Ver 68.7
Android version
1.4 GB 3.5 GB

Reference.

Update history

  • October-04-2020 Article published.
 
 
Message sent

Thank you for your message.

Something error has occured!

Sorry. The Error has occurred.We apologize for the inconvenience.Please try again in a few minutes or contact us via DM below.

Twitter:@NodachiSoft_eng
Name:
 
Replay To:
 
Message:
 
Back
Check the content!

Send the following information to us. If you are happy with your submission, please click "Send". If you want to modify it, please click "Back".

Name:
 
Reply To:
 
Message:
 
Enter a confirmation key to make sure that you are not operating from a Robot.
Confirmation Key is 95
Back
 / 
Go to Confirmation
Entry fields
Go to Confirmation

There are 1 articles that may be relevant!

A game developer's and a player's perspective

#Browser Game Development✎ 2020-10-04
the necessary player and developer perspectives when developing a web game that runs on HTML5
Table Of Contents
Check the memory limit that the browser can handle
Check the memory limit that the browser can handle
Summary of environment and contents to check.
Summary of environment and contents to check.
How to check.
How to check.
Detailed specs of the device I measured.
Detailed specs of the device I measured.
Code and screen for measurement.
Code and screen for measurement.
Google Chrome (desktop 64bit version)
Google Chrome (desktop 64bit version)
Internet Explorer 11 (desktop 32bit version)
Internet Explorer 11 (desktop 32bit version)
Edge (64bit version of the EdgeHTML desktop)
Edge (64bit version of the EdgeHTML desktop)
Edge (Chromium Desktop 64bit version)
Edge (Chromium Desktop 64bit version)
Safari.
Safari.
Firefox (desktop 64bit version)
Firefox (desktop 64bit version)
Chrome for Android
Chrome for Android
Firefox (for Android)
Firefox (for Android)
Conclusion.
Conclusion.
Reference.
Reference.
Update history
Update history
Nodachisoft © 2021