Is the COST of JavaScript’s GC REALLY that high?

How much overhead is there really for garbage collection, is it as high as so many people say it is?

Follow me on:

Garbage Collection is often cited as a major source of performance problems in JavaScript. In this vdeo, we explore garbage collection a bit, and try to understand when and how the overhead is high and when it isn't.

Links:

[GreenFox]

Minor Note: WASD is not the "Doom Keys". Doom used arrow keys. WASD was created by the winner of a Quake tournament, who rebound his controls to WASD+Mouse. It very quickly became the industry standard.

[preston]

Every code review that someone criticizes me making too many intermediate local variables/objects for performance, I link them a Generational GC paper. Now I'm just going to link them this video. Nice work!

[Superfly]

I wrote that blog post you talk about at 3:30! Really nice summary and exploration of GC in this video.
About "manual" GC, there's an optimisation called pre-tenuring, which attempts to figure out which allocation sites create long-lived objects and allocate them directly into old-space.

Malloc implementations still have to do book-keeping to manage lists of free chunks and reduce fragmentation, so while there isn't "GC", there is still memory management overhead (though not nearly as much).

Something interesting to keep in mind with measurement is that reducing GC time can cause trade-offs in non-GC time, e.g. allocation can end up slower or faster depending on fragmentation, memory access can be faster/slower due to cache locality.

Check out the background threads in that chrome tracing view and you'll see a lot more GC happening in the background too!

Cheers

[Sssanbo]

On larger single page experiences, i ve always run into memory issues and its not fun to try and track down, I find, atleast for me that treating it like a C++ program is the best way . I try and force deallocation, delete, set to null . THis has never hurt me and what surprises me is just how much better performance I get.

[louca]

Learn so much from each video. I work with Node so it’s cool seeing these deep dives into core parts of the engine.

One thing that would be cool would be to try and unravel the actual execution of async code. Things like how functions are wrapped with promises, how the execution bounces back between frames upon hitting an await, asynchronous context (AsyncLocalStorage) etc.

[dteisen]

@SimonDev, just a quick note: whenever you create a new object and put random stuff in it, it does matter if you do the same random stuff or new ones, and it makes a difference if you use a single object and keep changed that instance.

An other long forgotten javascript feature that you might want to test is the prototype chain.

I think there is a Netflix medium blog post about it, as they reduced gc calls and memory consumption with not changing the actual object but markint it as a prototype for a new one.

Hope you make a new video about those :)

[volbla]

I ported some svgs to the desmos graphing calculator to play in sequence as an animation. I noticed some significant hiccups in firefox that were absent in chrome, and this seems to be caused by major gc pauses.

This was of course a very inefficient way to go about it. Using a general purpose graphing tool only to draw and fill hundreds of bezier curves, which the browser could just as well do directly with the svg files. This wasn't designed for performance, but it was kind of interesting to see a subtle difference between browsers.

[Retrofire-]

i was literally *just* going through a tutorial on js GC when you uploaded this - fantastic timing for a fantastic explanation!

[ariasalehi]

Fantastic video. In my performance tests I came across minor and major GCs. But I didn't know really what those things meant.
Thanks for sharing.

[Kaeresh]

Learning how to properly optimise for v8 (or specific browsers) is definitely something I am _very_ interested in and you seem to have a whole lot more knowledge than you've let on from the video's I've seen of you.
Going over some of your own projects and learning what to look for, especially for game-like programs that have a constant frame-update or loop/cycle, is something I would personally love to see you do.
Also if you have the time I'm really curious how you would handle a queue/worker like architecture in javascript. It is something I've been tinkering with myself to write POCs for the current project my team is working on.

[bryku]

In the past I had a top down rpg style game. This was before requestAnimationFrame was in javascript, so I used a setInterval.

The game was having some studders, but I found out that if I just move them off screen instead of deleting them from the entities array it got rid of those stutters. At the time, it sort of puzzled me, because I thought less memory = faster, but as I thought about it, I sort of assumed that the performance saved was because I didn't need recreate all of those objects.

I believe your deep dive into GC sort of answered this long forgotten question of mine. Sort of funny how I found solutions around this without really knowing what was happening though. But, this is javascript we are talking about. There can be some really weird behavior sometimes and the only way to know is to test it out... and that is assuming it doesn't change in the next version of v8.

[AYoutubeHandleThatIsNotTaken]

Came from the primeagen, saw my ad, did my part. Great vid👍

[avivkandabi]

Hey Simon, I saw that you are working on a Math course, looking forward to it !
Do you think you'll ever make a course for algorithms and data structures? I never found a good online course and your way of explaining things is perfect.

[meetfilipe_]

Just to say that your style of explaining things rocks. Thank you for sharing

[jackwright]

Really great video! Thanks! Learned a lot about GC

[anon_y_mousse]

I'd like to see a comparison with regards to memory usage of both Chrome and Firefox in general as well as with rendering something. A simple clone of Asteroids would be a good start and it's easy enough to write and there are pre-written versions in JavaScript everywhere that you could just copy if you were feeling lazy.

[daedalus]

JS2023 is apparently adding some memory management features, would love a follow up on Explicit Resource Management if and when it comes out.
Feels like a giant footgun for JS but might be interesting!

[codahighland]

Somehow I managed to forget I watched this video even after watching it again. I came here to comment and discovered a comment by myself!

[lordxan]

Nice video I hope to see a memory comparison in the future

[zeekcom]

You have a buttery smooth voice like bob from bob's burgers, love the vid man