I've been reading through the V8 dev blogs trying to get a sense of what's going on, and this video really tied the concepts together in a succinct way. Excellent use of graphics as well, really helpful.
The animation was not only cool but also incredibly helpful in visualizing the complexities of the engine. It's rare to find content that's both beginner-friendly and easy to follow, but this video nailed it. Thankyou so much!
Maybe the people behind the v8 engine deserve a Nobel price of some kind. Code optimization at that low level is really complex and the v8 engine seems to be highly optimized.
Lydia~ thank you so much for your wonderful presentation!! You are so much better than Udemy instructor who explains about JS engine. Now finally I can understand how JS works perfectly !!! Thank you so much again !!
Excellent illustration! These are key fundamental concepts all JS devs should understand, so as to optimize as much as possible. It takes some of the guesswork out of how you should solve a particular problem, also...seeing as JS is flexible enough to do everything at least 10 different ways. Well done!
Deep! And fun 🔥! Turbofan :) After watching this video I remembered that I have learned about this V8 optimization previously, but I forgot about this completely when writing actual code! Nice reminded that calls to function with different arguments or different shape of object are blocking V8 turbofan optimization.
bloody hell. the ease of that to her is just... For extra beginners will like a complete summarised road map at the beginning before going into each section and function, if that makes any sense, glad to help. you did that, but it was too short, too quick.
the animation and explanations were helpful....but the cool thing was she was laughing after some seconds and that made ma laugh too......i watched it twice once just to laugh and another time for learning the concept
Well - the part that really broke my brain was that gear animation on 4:42 ))) There is definitely something wrong there!)) Aside from that - a great video, thanks a lot!)
Where does the global execution context and call stack sit in this whole process? I am not talking about event loop. I just want to know the v8 part of browser which executes the code. Global execution context and call stack is part of v8. I find resources in Google explaining v8 architecture and event loop separately. In event loop they show that global execution context and call stack is part of v8. And when I go to learn v8 internal process to execute code. I find these type of explaining but no mention of global execution context and call stack. I want to know the relation among v8 engine architecture , global execution context and call stack. How they work together??? Besides that I found variables and references are stored in stack and object and function description are stored in heap. Some articles says both are stored in memory heap. These are confusing. What exactly is stack and heap? I Googled it. It says heap is not part of heap data structure. And stack is a data structure. I want to know the relation among stack, heap and hardware RAM. Is stack and heap is a physical part of ram? = If I consider ram is just a collection of billions of memory block. Some are used as a process called stack and some are used as a process called heap. If this is truth then the same memory block can be used as a stack and heap in two different process or case !!!? All these are so confusing.Is there anyone who knows about it?? I am tired of researching in Google.
Hi, Thanks for the great presentation. I was wondering though if we can assume type scripts code is by definition faster than regular javascript since we have more control on shape's number ?
To my knowledge, call stack works pretty similar to any other call stack. Memory heap is similar. Event loop is something that really depends on if you're using Chrome or Node.
I would love to know more about what happens in the browser when it sees JavaScript. When inspecting the performance profiler you can see "compiling" and "evaluating" as two separate tasks - what are they? Does Chrome cache compiled JavaScript between refreshes or only the asset? When it comes to caching, how does Chrome determine between disk and memory cache?
So with just in time compilation what is the purpose of compiling to a byte code before compiling to machine code? If optimization means compiling straight to machine code why not do that all the time?
I know how, the predefined browser API methods are defined as objects in c++ and they connected to c++ functions in js engine specific way, when they're called their corresponding c++ functions are called. When you console.log(setInterval) it prints [native code] because there's a mechanism that JS engine developers implemented to connect the invoking of js functions to call real machine code functions.
There's a mechanism for invoking operation system functions in Java language too, through mechanism called JNI. You can also embed Python in your "c" programs.
This is called binding. V8 is written in C++, it has ways to bind C++ functions to JS objects. When this JS function is called it results in a underlying call to C++ code. V8 dispatches the call since it's also running on C++. The same call can be done to different languages, but both languages must agree on a calling convention/interface. Search Foreign Function Interface.
Why are people here reducing the instructor's skill and presentation effoet only to her looks? Lol its a good vdo too surface level but nice infographics
this presentation is useless and painful for me because I cant concentrate on code my brain stuck, the reason is the the angel with charming eyes and voice on left side of the screen. I think this should be a real problem for dev guys who work with such a good programmer and beautiful hot woman.
As someone once said, if you don't know how to explains to others, your knowledge isn't useful. There're so many steps you're missing. Please learn to explain better.
The video is obviously an introduction to core principles of the V8 interpreter but assumes the watcher has basic knowledge about interpreters. As so implementation details are ignored since it wasnt the goal.
![PURPEECH - นี่ฉันเองคนที่... (It's me) [Official MV]](http://i.ytimg.com/vi/NuhHd0hOOg8/mqdefault.jpg)
I just love these moments of learning when I feel so stupid and my mind feels like oh, we've some work to do.
These infographics are really great. Excited to keep studying this. Gonna use this as a resource frequently. Very well-done.
I've been reading through the V8 dev blogs trying to get a sense of what's going on, and this video really tied the concepts together in a succinct way. Excellent use of graphics as well, really helpful.
The animation was not only cool but also incredibly helpful in visualizing the complexities of the engine. It's rare to find content that's both beginner-friendly and easy to follow, but this video nailed it. Thankyou so much!
Maybe the people behind the v8 engine deserve a Nobel price of some kind.
Code optimization at that low level is really complex and the v8 engine seems to be highly optimized.
The ACM A.M. Turing Award? Yeah! Give them. 🏆🎉
wow... over 20 years of writing JS and I'm still learning new things. definitely going to keep this in mind when designing my functions.
Lydia~ thank you so much for your wonderful presentation!! You are so much better than Udemy instructor who explains about JS engine. Now finally I can understand how JS works perfectly !!! Thank you so much again !!
Thanks for the talk and explaining in details. Always liked the visual articles. Kudos
Great way of explaining the internals. Thanks!
Excellent illustration! These are key fundamental concepts all JS devs should understand, so as to optimize as much as possible. It takes some of the guesswork out of how you should solve a particular problem, also...seeing as JS is flexible enough to do everything at least 10 different ways. Well done!
Deep! And fun 🔥! Turbofan :)
After watching this video I remembered that I have learned about this V8 optimization previously, but I forgot about this completely when writing actual code!
Nice reminded that calls to function with different arguments or different shape of object are blocking V8 turbofan optimization.
This is exactly the video and explanation I've always wanted to see. Thank you.
best info-graphics and explanation I have seen on this very important topic. Thank you
bloody hell. the ease of that to her is just... For extra beginners will like a complete summarised road map at the beginning before going into each section and function, if that makes any sense, glad to help. you did that, but it was too short, too quick.
the animation and explanations were helpful....but the cool thing was she was laughing after some seconds and that made ma laugh too......i watched it twice once just to laugh and another time for learning the concept
Well - the part that really broke my brain was that gear animation on 4:42 ))) There is definitely something wrong there!))
Aside from that - a great video, thanks a lot!)
Bytecode: easy peasy
Gears broking physics laws: what tha hell!!!
It's a fascinating and informative presentation. Can i ask how did you make slides. I mean, did you use some program or actually, is it a website =)
i think this was still on Apple Keynote
Superb!
This is such a great video!!!
Thanks for the video....
perfect. a sua didatica e perfeita, junto dos graficos
The best explanation i have ever seen!!!
high level of explanation
7:18 it surely is
Your content is just amazing 🤩🤩
When you say "we"... I presume you mean "computers"! 😂 Seriously though, very comprehensive video... thank you 😵💫
This is awesome
Where does the global execution context and call stack sit in this whole process?
I am not talking about event loop.
I just want to know the v8 part of browser which executes the code.
Global execution context and call stack is part of v8.
I find resources in Google explaining v8 architecture and event loop separately.
In event loop they show that global execution context and call stack is part of v8. And when I go to learn v8 internal process to execute code. I find these type of explaining but no mention of global execution context and call stack.
I want to know the relation among v8 engine architecture , global execution context and call stack.
How they work together???
Besides that I found variables and references are stored in stack and object and function description are stored in heap.
Some articles says both are stored in memory heap.
These are confusing.
What exactly is stack and heap?
I Googled it.
It says heap is not part of heap data structure.
And stack is a data structure.
I want to know the relation among stack, heap and hardware RAM.
Is stack and heap is a physical part of ram?
= If I consider ram is just a collection of billions of memory block. Some are used as a process called stack and some are used as a process called heap.
If this is truth then the same memory block can be used as a stack and heap in two different process or case !!!?
All these are so confusing.Is there anyone who knows about it?? I am tired of researching in Google.
Impressive..👏
this is pretty cool. I wish it was a little bit slower though
lots to take in
Ya I barely understood it.
Put it at x0.75 speed
very helpful explanation!
This was really helpful
nice visuals and explanations
most amazing video ever
Thanks for the explaintion.
Hi,
Thanks for the great presentation.
I was wondering though if we can assume type scripts code is by definition faster than regular javascript since we have more control on shape's number ?
I’d love to know to know more please recommend a good book to get started
beautiful talk.
This is amazing! Does anyone knows where to find all the others ressources she is talking about?
Hey, did you manage to find them?
There is no mention for call stack, memory heap or event loop in this video. What's their role in this whole process?
To my knowledge, call stack works pretty similar to any other call stack. Memory heap is similar. Event loop is something that really depends on if you're using Chrome or Node.
it's very good.
Lovely presentation!! if you do not have courses on Udemy ... you should ...
Nailed it!
I would love to know more about what happens in the browser when it sees JavaScript. When inspecting the performance profiler you can see "compiling" and "evaluating" as two separate tasks - what are they? Does Chrome cache compiled JavaScript between refreshes or only the asset? When it comes to caching, how does Chrome determine between disk and memory cache?
Thank you!
Awesome talk
Very helpful! Where does Chromium load scripts before byte stream decoding?
So with just in time compilation what is the purpose of compiling to a byte code before compiling to machine code? If optimization means compiling straight to machine code why not do that all the time?
"bytecode takes a lot less memory than machine code."
Stackoverflow a/69155309 (because yt hates urls)
Awesome, thx.
just love
Amazing
Somebody please tell me what tool she used in the video to illustrate code executions. 😢🙏
Leaving this here to hopefully get a notification when you get an answer :v
Nice, I like it.
A very charming tutor explaining things excellently
how do you make the diagram ?
Dam, it is so cool, but in the same time too fast, like I have to rewind multiple times to process the new information
What do I have learn to understand this?
Do you understand now
does typescript help with optimizing?
00:58 😂 😂😂😂😂😂😂😂😂😂😂😂😂
Can anyone help me understand where are the registers located? on the pc? is my understanding correct?
registers are located in a machine/pc/computer
So fast for me btw. Will have to watch multiple times to understand.
principle of program language, such a nightmare
I wish I could have the same topics in the kitchen with my wife while drinking coffee 😮
why is she in the bathroom for this?
She was taking a dump
@@pannihto7588 This. The V8 engine eats up a lot of RAM. All that RAM has to be unloaded somewhere.
Just take a tub of popcorn and put V8 source code on auto scroll.
Great video though.
My 3rd time watching this
Isnt she streaming from bathroom lol
i still didnt understood how JS (one programming language) is able to call c++(another programming language). can you throw some light on it?
I know how, the predefined browser API methods are defined as objects in c++ and they connected to c++ functions in js engine specific way, when they're called their corresponding c++ functions are called. When you console.log(setInterval)
it prints [native code] because there's a mechanism that JS engine developers implemented to connect the invoking of js functions to call real machine code functions.
There's a mechanism for invoking operation system functions in Java language too, through mechanism called JNI. You can also embed Python in your "c" programs.
Any links you have to understand this in deep?
This is called binding. V8 is written in C++, it has ways to bind C++ functions to JS objects. When this JS function is called it results in a underlying call to C++ code. V8 dispatches the call since it's also running on C++.
The same call can be done to different languages, but both languages must agree on a calling convention/interface. Search Foreign Function Interface.
Hard for me to understand
good work but i think its overkill
She loves talk in jargon unfortunately, but it's reminds us we are not learn it better before
Seems like you're joking/kidding. I wish you could explain assuming all the viewer as beginners. Anyway, great info.👍
Why are people here reducing the instructor's skill and presentation effoet only to her looks? Lol its a good vdo too surface level but nice infographics
I would learn way more if there was only a voice teaching how this stuff works
my head hurts
bonk
A❤
Excellent content. Though I don't know why it's a bit hard to focus
i love you
So, v8 creates Virtual cpu with virtual memory?
No entendí una goma.
So that's why modern browsers can't run on 4GB of RAM when a 3d game like WoW could run on 500MB...
She's such a cutie.
This is clearer at 0.75 speed.
I can't help watching the speecher
Can anyone tell me what I was supposed to learn here, I was starting at the cute smart girl on the left
Lmao
SIMP
Stop being creepy dude....just stfu and learn.
Lame comment. Couldn’t even read it cuz I was distracted by the picture of an idiot on the left.
😂😂😂😂 same
you know "spaces over tabs" when you see her
i love this video , girl are so cute
I can't focus on the right.
What kinda gibberish was that?
Whats so funny i really dont get it shes literally holding herself from bursting into tears throughout the entire video?
this presentation is useless and painful for me because I cant concentrate on code my brain stuck, the reason is the the angel with charming eyes and voice on left side of the screen. I think this should be a real problem for dev guys who work with such a good programmer and beautiful hot woman.
As someone once said, if you don't know how to explains to others, your knowledge isn't useful. There're so many steps you're missing. Please learn to explain better.
The video is obviously an introduction to core principles of the V8 interpreter but assumes the watcher has basic knowledge about interpreters. As so implementation details are ignored since it wasnt the goal.