Possible to check 'available memory' within a browser?

Question

I'm just making up a scenario, but let's say I have a 500MB file that I want to provide an html table for the client to view the data. Let's say there are two scenarios:

• They are viewing it via a Desktop where they have 1.2GB available memory. They can download the whole file.
• Later, they try and view this same table on their phone. We detect that they only have 27MB available memory, and so give them a warning that says "We have detected that your device does not have enough memory to view the entire table. Would you like to download a sample instead?"

Ignoring things like pagination or virtual tables, I'm just concerned about "if the full dataset can fit in the user's available memory". Is this possible to detect in a browser (even with a user's confirmation). If so, how could this be done?

Update

This answer has been answered about 6 years ago, and the question points to an answer from 10 years ago. I'm wondering what the current state is, as browsers have changed quite a bit since then and there's also webassembly and such.

Answer 1

Use performance.memory.usedJSHeapSize. Though it non-standard and in development, it will be enough for testing the memory used. You can try it out on edge/chrome/opera, but unfortunately not on firefox or safari (as of writing).

Attributes (performance.memory)

jsHeapSizeLimit: The maximum size of the heap, in bytes, that is available to the context.

totalJSHeapSize: The total allocated heap size, in bytes.

usedJSHeapSize: The currently active segment of JS heap, in bytes.

Read more about performance.memory: https://developer.mozilla.org/en-US/docs/Web/API/Performance/memory.

CanIUse.com: https://caniuse.com/mdn-api_performance_memory

CanIUse.com 2020/01/22