JQuery or javascript to find memory usage of page

views:

301

answers:

+1 Q:

JQuery or javascript to find memory usage of page

Is there a way to find out how much memory is being used by a web page, or by my jquery application?

Here's my situation:

I'm building a data heavy webapp using a jquery frontend and a restful backend that serves data in JSON. The page is loaded once, and then everything happens via ajax.

The UI provides users with a way to create multiple tabs within the UI, and each tab can contain lots and lots of data. I'm considering limiting the number of tabs they can create, but was thinking it would be nice to only limit them once memory usage has gone above a certain threshold.

EDIT: Based on the answers, I'd like to make some clarfications:

I'm looking for a runtime solution (not just developer tools), so that my application can determine actions based on memory usage in a user's browser.
Counting DOM elements or document size might be a good estimation, but it could be quite inaccurate since it wouldn't include event binding, data(), plugins, and other in-memory data structures.

+2 A:

I don't know of any way that you could actually find out how much memory is being used by the browser, but you might be able to use a heuristic based on the number of elements on the page. Uinsg jQuery, you could do $('*').length and it will give you the count of the number of DOM elements. Honestly, though, it's probably easier just to do some usability testing and come up with a fixed number of tabs to support.

tvanfosson 2010-03-27 17:36:17

@tvanfosson: not a bad idea, but this isn't going to give me information about non-DOM memory, such as .data() and in memory data structures. But it could give a good estimation of the overall weight which I could use.

Tauren 2010-03-28 18:07:28

+1 A:

If you want to just see for testing there is a way in Chrome via the developer page to track memory use, but not sure how to do it in javascript directly.

Zachary K 2010-03-27 17:37:04

@Zachary: Thanks. I'll certainly be using dev tools, but was hoping to find a runtime analytics solution.

Tauren 2010-03-28 18:18:29

If you find one let me know, I would love to have one handy

Zachary K 2010-03-29 08:33:14

What you might want to do is have the server keep track of their bandwidth for that session (how many bytes of data have been sent to them). When they go over the limit, instead of sending data via ajax, the server should send an error code which javascript will use to tell the user they've used too much data.

Cam 2010-03-27 17:38:51

@incrediman: that's kind of a cool idea too, but I don't think it would work without building in a lot of tracking features -- just a byte count wouldn't work. The problem is that the data in a tab is a list that the user will filter and sort in many different ways. Each time they make changes, new data will be retrieved from the server and replace the current dom elements. Plus, what's do say they don't hit "reload", and start with a fresh page? I'd have to track 304s and such then as well, but I intend to just serve static html, all data comes from a REST service.

Tauren 2010-03-28 18:15:38

You can get the document.documentElement.innerHTML and check its length. It would give you the number of bytes used by your web page.

This may not work in all browsers. So you can enclose all your body elements in a giant div and call innerhtml on that div. Something like <body><div id="giantDiv">...</div></body>

Midhat 2010-03-27 17:39:24

The length of the generated `innerHTML` string is unlikely to be *usefully* corrolated with the memory the browser uses (e.g., in its internal object model) to render that HTML.

T.J. Crowder 2010-03-27 17:49:19

and why is that? My rationale is that if some text is loaded in the browser, it has to be stored in the memory. SO it does give some measure of the memory used by the browser to render the page.

Midhat 2010-03-27 17:52:34

Think about it this way. If you say "I'd like to give you 10 million dollars", that's 8 words. On the other hand, if you said "I'd like to sneeze on your napkin", that's 7. Is the first only 8/7 more valuable than the second?

intuited 2010-03-27 18:00:38

as far as memory is concerned, both contain 30ish characters, Are we talking about the storage or the semantics of the data here

Midhat 2010-03-27 20:42:48

@Midhat: This is similar to @tvanfosson suggestion of getting the count of DOM elements. Your's is probably a bit more accurate because different dom elements can contain different amounts of text. But it still doesn't get any information about data(), click handers, in memory data structures and objects, and so forth. My app uses lots of these features.

Tauren 2010-03-28 18:21:56

Use the Chrome Heap Snapshot tool

There's also a Firebug tool called MemoryBug but seems it's not very mature yet.

Pablo Fernandez 2010-03-27 18:00:53

@Pablo: Thanks. I'll certainly be using dev tools, but was hoping to find something that I could use during runtime to find the memory usage in each user's browser.

Tauren 2010-03-28 18:19:29

ansaurus

tags:

views:

answers:

JQuery or javascript to find memory usage of page

related questions