JavaScript freezing/crashing in Chrome

Question

This is the fiddle: http://jsfiddle.net/36mdt/

After about 10-20 seconds, the display starts to freeze randomly and shortly after crashes. I cannot reproduce this in Firefox.

Profiling reveals nothing unusual.

http://jsfiddle.net/3pbdQ/ shows there is definitely a memory leak. Even a 1 FPS, the memory usage climes 5 megabytes a frame.

On a side note, this example really shows how Math.random() is really not so random.

Solution 1

I've done only 2 performance improvements and it doesn't crash after 5 mins (also seems to be not leaking memory). Checkout http://jsfiddle.net/3pbdQ/3/

1. Don't calculate the size inside each iteration
2. Use timeouts instead of freezing interval.
3. Use bitwise operator for flooring a number

Profiling reveals nothing unusual.

Chrome Profiler doesn't work with WebWorkers, AFAIK. As per conversation with Paul Irish:

"Check about:inspect for shared workers, also you can do console.profile() within the worker code (I THINK) and capture those bits. The "cleans up" is the garbage collector: if after the cleanup there is still a growing line of excess memory, then thats a leak."

And

On a side note, this example really shows how Math.random() is really not so random.

It is well known there are no perfect random algorithms, but anyway the bunch of grouped colors you see is because you're not setting canvas.height and canvas.width, and it differs from CSS values.

EDIT: Still leaking memory, I don't know why, about after 10 secs it 'cleans up'. Exceeds my knowledge, but works smoothly at 60 FPS (var TIME = 16)

Solution 2

Depending on the system and browser version you use some steps may vary although I tried my best to provide common steps that are compatible with most systems.

Disable Sandbox: 1. Right click Google Chrome desktop icon. 2. Select Properties. 3. Click Shortcut > Target. 4. Add "--no-sandbox" 5. Click Apply | OK. 6. Download and install ZombieSoftFix. 7. Check and resolve conflicts detected.

Disable Plug-Ins: 1. Type "about:plugins" in Address Bar. 2. Press ENTER. 3. Disable all plug-ins displayed in the list page.

Clear Temporary Files: 1. Click Wrench. 2. Select More Tools | Clear browsing data. 3. Check-up all boxes, click "Clear browsing data" button to confirm the process.

Thanks & Regards.

Comments

[trumank]

It still has a memory leak if you let it sit for half an hour.

[Tom Roggero]

@MathWizz yup, I realized that as per my last edit, but exceeds my knowledge about how to "clean it" correctly, besides the garbage collector.

[trumank]

Accepting because it helps the memory leak at lot, even though it does not fix it.

[trumank]

Interesting... It has been fixed recently though: code.google.com/p/chromium/issues/detail?id=132769#c7 :D