JavaScript Engine under the hood: How is Code Translated and Executed? | Core JavaScript

Veröffentlicht am: 13 Mai 2023
auf dem Kanal: Decode Web with Rohan
929
40

Have you ever wondered how JavaScript code gets compiled and executed by your browser? In this video, we'll take a deep dive into the inner workings of the JS Engine. We'll cover the six primary components that make up the JS Engine, including the parser, abstract syntax tree, interpreter, profiler, compiler, and optimised code. You'll learn how the JS Engine converts your code into executable code, and how it executes that code using the call stack and memory heap. By the end of this video, you'll have a clear understanding of how your JavaScript code gets compiled and executed, and what you can do to optimise its performance.

Visualise Abstract Syntax Tree: https://astexplorer.net/

Analysing Core JavaScript Concepts:    • Understanding Execution Context, Call Stac...  

Understanding Execution Context, Call Stack and Hoisting in JavaScript | Core JavaScript:    • Understanding Execution Context, Call Stac...  

Demystifying Scope and Scope Chain in JavaScript: Why it Matters and How it Works | Core JavaScript:    • Demystifying Scope and Scope Chain in Java...  

Content:
00:00 - Intro
00:18 - What is a JS Engine?
00:39 - How does the JS Engine work?
01:00 - Parser
01:41 - Parser - Tokens
02:22 - Abstract Syntax Tree
03:57 - Interpreter
04:28 - Interpreter - Bytecode
05:06 - Profiler
05:16 - Compiler
05:42 - Compiler - Machine Code
06:17 - Optimise Machine Code
06:52 - How does the engine convert code?
07:56 - JS Code Execution
08:04 - Call Stack
08:53 - Memory Heap
09:35 - How code is executed by JS Engine?
09:58 - Summary

Tools being used:
Code editor: VS Code ( https://code.visualstudio.com/ )
Manage version control: GIT ( https://git-scm.com/downloads )
GUI for GIT: Sourcetree ( https://www.sourcetreeapp.com/ )
Design: Pencil Project ( https://pencil.evolus.vn/ )
Repository: GitHub( https://github.com/DecodeWebWithRohan... )
Graphic Design: Canva ( https://www.canva.com/ )
Recording: OBS Studio ( https://obsproject.com )
Video Editor: DaVinci Resolve ( https://www.blackmagicdesign.com/prod... )

Link to the code repositories:
https://github.com/DecodeWebWithRohan...

Please consider supporting the channel:
https://paypal.me/DecodeWebWithRohan

Follow me on twitter or facebook:
  / decodewebwrohan  
  / decodewebwithrohan  


Auf dieser Seite können Sie das Online-Video JavaScript Engine under the hood: How is Code Translated and Executed? | Core JavaScript mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer Decode Web with Rohan 13 Mai 2023 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 929 Mal angesehen und es wurde von 40 den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!