Performance of JavaScript Garbage Collection | Prime Reacts

Recorded live on twitch, GET IN
/ theprimeagen
Original: • Is the COST of JavaScr...
Author: / @simondev758
MY MAIN YT CHANNEL: Has well edited engineering videos
/ theprimeagen
Discord
/ discord
Have something for me to read or react to?: / theprimeagenreact

[@simondev758]

Happy you enjoyed it!

[@BvngeeCord]

Legend

[@xdata3267]

Following. Cheers!

[@jozsefsebestyen8228]

Two things: - classes are syntactic sugar for prototypic inheritance - JS needs a proper pipe operator

[@nomoredarts8918]

And pattern matching

[@corey4448]

@@nomoredarts8918pattern matching like in elixir would be great, but probably slower with javascript

[@csanadtemesvari9251]

Te vagy egy proper pipe operator 😏

[@angelustrindade132]

My guy wants js to be like bash or c++

[@SnackLive]

@@corey4448 i dont think you can have pattern matching at that level since for elixir is a very explicit design choice that everything was build upon

[@Sebanisu]

Doom used the arrow keys. Doom and Wolf3d were controlled with the keyboard only. You used arrows with your right hand to move around. And spacebar to open doors and like control to fire. Something like that it's been about 30 years since I played that way. WASD became more popular when games used the mouse to look and fire. Quake used it but it wasn't the first. Early games in 3D had all kinds of control schemes. Under a Killing Moon would break your brain as you try to move around the world.

[@MosiurRahman-dl5ts]

Simon is a genius.

[@angelustrindade132]

tru!

[@Mozartenhimer]

But Tom is more of a genius.

[@leonvolq6179]

Tom is more genious!

[@Hector-bj3ls]

Speaking of morbid naming in programming. At one company I worked for we had a method on our objects that allowed them to dispose of themselves. It was named "commit_suicide". It just scheduled the deletion though, so we had another one named "commit_suicide_immediately". Someone had left a comment above the method that read: "life is just too much ;_;"

[@JoelJosephReji]

for screen tearing, use the glx backend and set the vsync as true. You are welcome, ThePrimeagen.

[@andrebruns4872]

Ohhh, you can fix that stuff with screen tearing? Am running a Intel NUC 6th gen with Manjaro i3 for my television and now I have to live with double screentearing. Ty the Primeaguen

[@64_Tesseract]

x11 go [smoothly] brrr

[@Omikronik]

Quaternion was described by william rowan hamilton an Irishman. I live in Ireland and my Game Engines lecturer would not let us forget this fact lol

[@draakisback]

Elixir also has a generational gc, though it only has two buckets and because of the nature of the system (being heavily concurrent), the major gc only needs to run very seldomly. You have your schedulers running on each core of your CPU each with their own process queue. Each process is allocated a limit of function calls and it has to do it's working and after it runs out the next process in the queue launches. Each process also has its own completely isolated stack and heap. The minor GC runs and picks out objects that nothing refers to anymore. It's specifically looks for so-called root objects, objects that refer to data in the processes memory then it picks out the data they refer to and places them into a new memory area, after which it deletes the rest. Then the GC goes over the first batch of moved objects in the new one memory area and only moves the data they refer to. The stack of the process is moved to the new memory area after which the garbage collection cycle finishes. Data that survives this procedure is marked so that the next GC cycle will transfer it to the old heap area. It's worth noting that the stack (execution instructions) and the heap (the data) live in the process memory and they are located at the edges of the available memory segment and grow towards one another. If at some point there is no free space left, one of the schedulers will step in and interrupt the execution of code to apply the minor garbage collector. If the data that survives is too large for the process to hold, the new area is increased in size. A major GC procedure only occurs every 65,000 standard cycles. Basically during major collection, objects that are still being used are moved to a new area while irrelevant data is removed entirely. At one point erlang had a bug that could crash the process if it was executing for too long due to the GC getting too expensive/the process making too many nif (native interface functions) calls. To solve these issues, a second scheduler type was added; the so-called dirty scheduler. Like other schedulers, each CPU core has its own dirty scheduler but these schedulers all work within a single-shared queue. Processes that are expected to run for a long time, past a timeout, are put into that queue. If the system determines that there isn't enough memory for the process to run and the next GC call might potentially take too long, it'll run in the dirty job queue later. This is where the third GC called the delay GC comes in. It marks the current heap as abandoned and allocates a new area with enough free memory needed for the process plus a bit more. If there still isn't enough memory, another area is allocated and linked to the previous one; these are heap fragments. It repeats this procedure until the process is satisfied. It's actually interesting how it calculates how much memory is needed, it uses the Fibonacci sequence. The important thing here, is that objects can be checked without suspending the entire system due to the VM having so many isolated processes. In the past when I worked with elixir/erlang, I always use processes as a means of manually allocating and deallocating memory. Basically, you can make it so that what would normally be a long-running process is effectively a chain of short running processes that continually die and pass on their state. In this way you kind of get more control over the GC then with most other languages since killing a process and moving the state allocates a new memory block just as the major gc does. You can also set the gcs to sweep over processes at different time frames. So if you have a process that never needs GC or one that needs it more, you can specify the frequency. As with most features in js, you have problems with the gcs because you only have the one thread to work with. No matter how well the language is optimized via it's jit and engine, it's never going to overcome that hurtle. They really should just redesign the language to allow it to be multi-threaded and more effecient. It's such a trash fire. I wish Google had strong armed dart into their browser; though not dart 1.0, if we had dart 3.0 and they had replaced JS with it... Chef's kiss.

[@Hector-bj3ls]

I also made a thing to count major and minor GC instances. The company wouldn't let me fail people's PRs because of it though.

[@Omnifarious0]

I learned about quaternions when I did some Second Life programming many years ago. And then I encountered them again tangentially when I studied group theory many years later in an attempt to understand cryptography better.

[@damiananslik6214]

Regarding the Hamilton story, the bridge is called Broom Bridge, and it's in Dublin, Ireland. There's a plaque that commemorates the event on the bridge.

[@qm3ster]

Thank you so much! Classes absolutely have their use in JS performance in CURRENT_YEAR.

[@kirillvoloshin2065]

I finally understood the message after seeing significant speed inscrease due to use of the object pool at work

[@k98killer]

Would love to see an analysis of Python's garbage collection as well, if that is even possible. Iirc, the GC in Python runs at the end of every scope execution and removes anything that was referenced only in that scope (really, it uses reference counts and frees memory of anything that reaches a ref count of 0, but that typically happens at the end of a scope) -- I might be wrong or out of date with this.

[@isodoubIet]

Yes Python is reference-counted (which IMO is stretching the term "garbage-collection" a bit, since it's not really what anybody has in mind when they hear the term). But: python scoping rules are all wonky (if you define a variable in a block, for instance, it's accessible in the rest of the function because guido hates you), and it has a tracing gc that runs periodically to collect cycles and the like.

[@casperes0912]

@@isodoubIet Python has a combination of RC and GC. RC when easily possible, GC when proper RC would require mode code annotations, like reference cycles

[@isodoubIet]

@@casperes0912 Thats what I said

[@LiveErrors]

according to the creator of C# and TS, automatic memory management is a field we could do to improve in

[@cotneit]

I wonder how many people got up close and personal with GC solely because of Minecraft's stop-the-world GC spikes lol

[@R4ngeR4pidz]

"the euthanizer" that caught me off guard

[@7heMech]

Tom is a genius. Tom can fix the GC issues, we should all use JDSL.

[@leonardodavinci2856]

OOP

[@SimonBuchanNz]

Btw, prime, where did you get the idea that classes are cheaper than objects? It's probably a lot better now than when they came out, but classes still have far more work that the runtime has to do than plain object bags, so for a long time they ran noticably slower: slower enough that the typescript team moved from new Foo to the pattern where createFoo() returns a local function bag because it measured noticably faster, and it's still really nice to use: function createFoo() { let a, b, c; return { doFoo }; function doFoo() { ... } } You can put a reset in there that just reassigns everything exactly the same as a class (why do you think you have to delete!?); you get real privates and they aren't slower like they have been for class privates(?!), in fact they're faster than fields because it doesn't have to put a deopt check in for them being deleted or something stupid, and there's no prototype chain lookup for calling the method. In short, they're faster, safer, better looking and easy to swap out in a test. Classes are better at... inheritance. Yay.

[@ThePrimeTimeagen]

i would argue the same thing, but inverted a measurement is needed!

[@DragonRaider5]

Yeah, I also wondered about the delete part. I think the reason why he considered classes as faster is that they aid V8 with its internal class representation and JIT - however I'm not sure if this actually is true.

[@ThePrimeTimeagen]

not only that, but that pattern that you just put up is a grotesque version of recreating classes while trying to avoid it

[@ThePrimeTimeagen]

For Dragon the delete is that an object pool has no shape. therefore you have to have an object pool per type (which is the same for classes, but they are named)

[@SimonBuchanNz]

@@ThePrimeTimeagen v8 only cares about the property assignments. The fact that it's a constructor or an object literal makes no difference. There's at least two other really nice advantages of returning a local object bag, both that you have Plain Old Functions: * Your "constructor" is just a function, so you have have multiple and they can call each other and it's all very simple and obvious * Your "methods" are just functions, so there's no problem with an unbound this so you can pull them out of the bag, load them to other functions directly, etc. Basically they make JavaScript suck just a little bit less.

[@isodoubIet]

"If you're on the server under load, each gc call will slow down your response time" Yeah, but nobody would be stupid enough to run javascript on the server, right?

[@ThePrimeTimeagen]

gotem

[@gilgamesh981]

Nooo i already watched it

[@bobDotJS]

I know, I watched you watching it.

[@roccociccone597]

You should use hyprland as your WM + compositor

[@user-wl5lj3pt9x]

Cool video!!!

[@DragonRaider5]

Now I wonder if constant arrays at module scope actually improve performance because you don't need to (de-)allocate them again and again, or if they decrease performance because they increase major GC runtime .C

[@ZSpecZA]

That sounds like object pooling - if that's what you meant, then it's a yes & no answer. "yes" because it does end up with the user having an increased perceived performance, but "no" because it just moves the performance problem somewhere else, it doesn't get rid of it. Think along the lines of a game - pooling objects in arrays will take the churn of the object object creation problem and move it from main game loop time to game initialize time.

[@DragonRaider5]

@@ZSpecZA Thanks for the explanation! However I was meaning something like, let's say, an array of allowed values for some argument (for doing validation). const allowedValues = [ 1, 3, 7, 8 ] export const valueAllowed = (val) => allowedValues.includes(val) Here the array is only created when the module is first read (and executed) -> only allocated once. However this also means that the allowedValues array will stay in memory for the rest of the application lifetime, meaning that the GC will keep on checking if it can be removed... Is it worth it to instead move the array inside the function (sure you could also use switch or something, it's just for the sake of argumentation) export const valueAllowed = (val) => [ 1, 3, 7, 8 ].includes(val) For this small example it's surely more efficient to have it on the module scope (if it 's used frequently), but how about bigger structures which add more major GC overhead? I guess there is some breakpoint ratio?

[@SimonBuchanNz]

​@@DragonRaider5in that example I'd guess whatever GC overhead would be swamped by the execution time. You might have noticed the GC pressure was only *starting* at the millions of objects.

[@DragonRaider5]

@@SimonBuchanNz Yeah the example data is a little too small, you're right :D I guess at any reasonable size execution time will make up for it, only "large" in-memory cashes might make a real difference for the GC. But then again, when you use a cash for it the GC overhead is probably still lower than the execution time advantage. Would be interesting how this scales, could help with determining optimal LRU cache size.

[@SimonBuchanNz]

@@DragonRaider5 keep in mind that literals are also executed: that example is essentially: let x = new Array(4); x[0] = 1; x[1] = 3; x[2] = 7; x[3] = 8; x.includes(val); So any local big object is also going to take longer to create each call!

[@noherczeg]

The fact that it's 2023 and we still need to deal with screen tearing is beyond funny.

[@softpixel]

wayland exists

[@VitisCZ]

​@@softpixeli thought Prime switched to hyprland? Did he roll back to i3?

[@VitisCZ]

I haven't encountered any screentearing on both intel and amd drivers out of the box since years ago.... Nvidia on the other hand ....

[@meanmole3212]

...and JavaScript

[@isodoubIet]

"why aren't people using linux on the desktop", he asks, completely unironically

[@sysarcher]

Sway is Wayland. Just came across this video. I had Ubuntu screen tearing the hell out and switching to Wayland helped! Okay unpause video...

[@grim.reaper]

Simon’s voice is just so soothing 🤯

[@JustSomeAussie1]

he sounds sick/half asleep

[@longlostwraith5106]

In case this is helpful, "compton" has fixed the screen-tearing entirely on my PC.

[@VonKuro]

Major GC : plug out

[@damienlmoore]

"lean on classes [for memory mgt]" amen brother!

[@felipedidio4698]

You can fix the screen tare issue by running "sudo rm -rf /" (rm = render manager; -rf is the refresh tag; / fixes it to the root of the rendering process, that's why it need root)

[@knfczae]

wow thanks i hope that will fix my screen teari

[@KRIGBERT]

That is not cool

[@seasong7655]

One cool thing in python is you can actually disable the garbage collection and delete everything yourself like in C

[@williamskrimpy3276]

@9:07 >> "The Abortionist" and "Coronary Heart Disease" (respectively).

[@williamskrimpy3276]

"Un-fenced Swimming Pool" and "Impatient Son-in-law".

[@williamskrimpy3276]

"Summer Days Rolled Up Car Windows" and "ALZHEIMER'S".

[@williamskrimpy3276]

"Aussie Dingo" and "The Stairs".

[@williamskrimpy3276]

"The McCanns" and "Overly Strained Bowel Movement".

[@DreanPetruza]

Lol, it's the first time I see a native english speaker acknowledge they say "datar", I wasn't sure if it was just me hearing it wrong.

[@ya64]

I wish I was smart enough to understand this stuff. I get its importance but it's way over my head.

[@encoderencoder1031]

love to see how C garbage collector work 😂😂😂

[@huge_letters]

Regarding object pooling - wouldn't that move this memory in majorgc territory which I take it is generally slower?

[@RyanIsHoping]

Well I think the idea is that you aren't freeing things and, more importantly, you aren't allocating things. Pooling turns your workload into just some basic array operations pretty much

[@huge_letters]

@@RyanIsHoping I see, thank you

[@IvanRandomDude]

JDSL has no GC. JDSL is work of a genius.

[@protocj3735]

There is no garbage in JDSL

[@iQuickGaming]

@@protocj3735 there is no garbage in JDSL because JDSL is the garbage itself

[@nisonatic]

@@iQuickGaming Tom has achieved enlightenment.

[@protocj3735]

@@nisonatic the garbage is stored in subverse in case you'd throw something away by accident. It's genius!

[@harmonicseries6582]

I did DOTS it worked womders

[@LtdJorge]

Didn’t say “the name, is the Primeagen”. 😔

[@AzureFlash]

Data? I hardly know 'er!

[@thomasscharler6745]

It's should not be called garbage collection, it's a memory chip stress test.

[@FalcoGer]

I use a bare new for simple to handle stuff. Anything else is a shared pointer or unique pointer. Why anyone would use malloc() or free() is beyond me.

[@muatring]

This is the second time I heard prime mention a reset method in a class. Can anyone explain to me how that works exactly?

[@kippers12isOG]

Why allocate a new object, when you can reuse an old object's memory? The idea is that instead of making something new which will have to be gc'd later, keep a reference to it, then "reset" it to be as if it were new. You can use an object pool for this, to keep a set of them ready to reuse.

[@innocentsmith6091]

Remember when all FPS games were called Doom clones?

[@angelustrindade132]

Simon using nvim, when?

[@jaysistar2711]

GC is bad in Javascript, Java, C#, and Go. I have worked on games in each, and I ended up fighting with each of them.

[@jaysistar2711]

Adding 'r's comes from the british attempting to do french linking.

[@darcy6698]

its just intrusive (linking) r, a lingustic feature of rp, aue, etc, to avoid haitus

[@CemMehmetOnal]

May be You dont know but there are some noobs trying to understand what is going on, managed to catch a few things in the video, But Can you give more specific example and differences between for the sake of teaching something for mentally in slow performance people.......

[@Mrstealurgrill]

the best part of this video is at kzbin.info/www/bejne/nojTnWOrjdKMfbs

[@complexity5545]

Where's the RAM usage in the benchmark? RAM usage is priority, and time is second. I see,.... that's part 2.

[@Universe593]

You add an "r" when the two words in sequence end and begin in a vowel. You'd add it when saying ie. "data (r) and" but not common for your "data (r) longer". It's an epenthetic letter and it's there to decrease the pause time between such words, effectively increasing speed without sacrificing speech clarity. Though it a funny reference given the vid

[@gianlaager1662]

I only program pure C with structs and functions because it‘s terrible but the best way. Why wont people just use the tools that are available for this exact purpose in other languages?

[@gappergob6169]

Time.

[@kevinb1594]

Aren't javascript classes just syntactic sugar that get converted to functions anyway?

[@kurt7020]

Aren't functions just sugar that gets converted into machine instructions? Aren't machine instructions just sugar that gets converted into internal cpu backend instructions? Aren't backend cpu instructions just sugar that shuffles around electrons? ... Yes. And they're useful.

[@kevinb1594]

@@kurt7020 I ask because Prime points out that using classes preserve some sort of state which makes them better than functions but if they get converted to functions at compile time, how can this be the case?

[@kurt7020]

@@kevinb1594 TLDR; it really depends. You pretty much have to test it with the data you expect, to really know. Performance tuning is hard and there's a *lot* of code between you and the metal. In some languages even things as subtle as the order of fields in a struct can matter. It's hard.

[@paxdriver]

Majorgc = "geriatricide" lol

[@dealloc]

Classes in JS are a fatamorgana. At the end of the day they're still objects, and they both inherit from [[Prototype]]. The argument of using methods vs functions is somewhat moot because other languages uses this pattern as well. I personally have no issue with using functions and object literals as LSP provides enough context for me to import the right things with signature and everything. If we're talking about bundling (i.e. shipping JS to users through browsers), classes are probably the worst offender here, since when you import a class, you will get not just the door but also the entire house with it (public, private and static properties and methods) and the entire neighborhood (prototype chain) if it extends from other classes as well. And there's no way to opt-out of this as a consumer, even if I only need a tiny slice of the functionality it provides. Using individual objects and functions allows for tree shaking and therefore also easier code splitting to deliver smaller modules to the end-user. One could argue that when you use a class, you mean it and need it. But I find that often use of classes does encapsulation where it didn't need to and could have been individual exports. So while they may provide a better developer experience, I don't think there's more benefit to them other than that.

[@k98killer]

Fwiw, I think you have the face for being a radio rockstar.

[@martinzihlmann822]

what if you have two classes A and B and a method that has both as arguments? where do you put it? is it easier to find this way? sorry to break it to you but OO is just bonkers.

[@Arillaxe]

What's the name?

[@bobbyv3]

"Still on i3." What?

[@Imaltont]

17:35 I know a great little language that could fix this. What is it called? The Crowd says Rockstar The Name said The Crowd Shout The Name

[@flalspspsl6858]

i know a word that's the opposite

[@PaulSebastianM]

Linux never heard of VSYNC? 20 years later since I've stopped using Linux on my desktop, it's still got the same old issues.

[@yjlom]

depends on wm i3 is really bad for it, many are better

[@SimonBuchanNz]

You can use workers to sandbox crap code somewhat. It's not fun.

[@mannycalavera121]

1nd

[@brunosl80]

Do u guys really understand this? I mean ...

[@ThePrimeTimeagen]

its pretty simple how long do you hold onto an object for? this will determine how long and how to optimize javascript gc

[@TehPwnerer]

Your little rant at the end there isn't even a complaint learn your environment

[@ThePrimeTimeagen]

agreed. learn your env

[@leemack4562]

no, its not 1993

[@kenmken]

Linux plebs will ridicule windows devs while their screen pixels rift apart like pangea

[@d-foxweb-design2170]

For the screen tearing: AMD: /etc/X11/xorg.conf.d/20-amdgpu.conf Section "OutputClass" Identifier "AMD" MatchDriver "amdgpu" Option "TearFree" "true" EndSection NVIDIA: /etc/X11/xorg.conf.d/20-nvidia.conf Section "Device" Identifier "NVIDIA Card" Driver "nvidia" VendorName "NVIDIA Corporation" BoardName "GeForce GTX 1050 Ti" EndSection Section "Screen" Identifier "Screen0" Device "Device0" Monitor "Monitor0" Option "ForceFullCompositionPipeline" "on" Option "AllowIndirectGLXProtocol" "off" Option "TripleBuffer" "on" EndSection

[@x1expert1x]

jesus christ javascripts GC seems so rinky-dink redneck-engineered. Just assign some arbitrary number of passes until a memory is perceived as "old" at which point you give it a new allocator? So what if some unicorn program has 90% of its memory lifetime existing on the edge of the minor and major gc? Some poor sap out there is wondering why his 100% correct program running like cow-dung