From e194a7cfc879d984c95e40065ec6d479cc36e149 Mon Sep 17 00:00:00 2001 From: sumn2u Date: Sun, 13 Oct 2024 11:24:11 -0500 Subject: [PATCH 1/2] restructure javascript behind the scenes chapter --- en/SUMMARY.md | 2 +- en/behind-scenes/README.md | 51 +++++++++++--------------------------- 2 files changed, 15 insertions(+), 38 deletions(-) diff --git a/en/SUMMARY.md b/en/SUMMARY.md index ab6b8abf..711dc44b 100644 --- a/en/SUMMARY.md +++ b/en/SUMMARY.md @@ -147,7 +147,7 @@ - [Time Complexity](complexity/time-complexity.md) - [JavaScript Behind the Scenes](behind-scenes/README.md) - [Call Stack](behind-scenes/call-stack.md) - - [Engine](behind-scenes/engine.md) + - [JavaScript Engine](behind-scenes/engine.md) - [Event Loop](behind-scenes/event-loop.md) - [Execution Context](behind-scenes/execution-context.md) - [Memory Heap](behind-scenes/memory-heap.md) diff --git a/en/behind-scenes/README.md b/en/behind-scenes/README.md index 19a08a4d..9a034e8a 100644 --- a/en/behind-scenes/README.md +++ b/en/behind-scenes/README.md @@ -1,47 +1,24 @@ --- layout: editorial -chapter: 27 -pageNumber: 256 -description: JavaScript behind the scenes. +chapter: 28 +pageNumber: 260 +description: JavaScript is a versatile language used in both browsers and servers. This guide explains key concepts like the JavaScript engine, execution context, call stack, memory heap, runtime environment, and event loop to help you write more efficient code. --- -## JavaScript Behind the Scenes +# Chapter 28 -JavaScript is a versatile language that runs in various environments, including browsers and servers. Understanding how -JavaScript works behind the scenes can help you write more efficient and effective code. This guide covers key concepts -such as the JavaScript engine, execution context, call stack, memory heap, runtime environment, and event loop. +# JavaScript Behind the Scenes -### JavaScript Engine +JavaScript is a versatile language that powers both browsers and servers. To write efficient code, it helps to understand how JavaScript works behind the scenes. At its core is the JavaScript engine, a program responsible for executing your code. Popular engines like V8 (used in Chrome and Node.js), SpiderMonkey (in Firefox), and JavaScriptCore (in Safari) break down your code and run it. Alongside this, the execution context defines the environment in which your code is evaluated. Whether it's global, function, or eval, each context goes through a setup phase (creating variables, functions, and this) before executing the code line by line. -A JavaScript engine is a program or interpreter that executes JavaScript code. Popular engines like V8 (used in Google -Chrome and Node.js), SpiderMonkey (used in Firefox), and JavaScriptCore (used in Safari) parse the code into an Abstract -Syntax Tree (AST), compile it into bytecode or machine code, and then execute it. +Key components like the call stack and memory heap further support JavaScript's execution. The call stack manages function calls in a Last-In, First-Out order, while the memory heap stores objects, with JavaScript automatically freeing up memory through garbage collection. The runtime environment—whether in the browser or Node.js—provides additional resources, such as the DOM or Node.js-specific modules. Finally, the event loop plays a crucial role in enabling asynchronous programming by offloading tasks and processing callbacks, ensuring JavaScript remains non-blocking and efficient. -### Execution Context -An execution context is an environment where JavaScript code is evaluated and executed. There are three types: global, -function, and eval. Each context has a creation phase, where variables, functions, and the `this` keyword are created, -and an execution phase, where the code is executed line by line. +In this chapter we are going to talk about following topics. -### Call Stack - -The call stack is a data structure that keeps track of function calls in a Last-In, First-Out (LIFO) manner. It helps -the JavaScript engine manage the execution of multiple functions by pushing and popping function calls as they are -invoked and completed. - -### Memory Heap - -The memory heap is a region in memory where objects are stored. JavaScript uses garbage collection to manage memory, -automatically freeing up memory that is no longer in use, thus preventing memory leaks and optimizing performance. - -### Runtime Environment - -The runtime environment provides the necessary resources for JavaScript to execute. In a browser, this includes the -Document Object Model (DOM), Web APIs, and the JavaScript engine. In Node.js, it includes the file system, HTTP module, -and other Node.js-specific APIs. - -### Event Loop - -The event loop allows JavaScript to perform non-blocking operations by offloading tasks to the system kernel whenever -possible. It continuously checks the call stack and processes the callback queue, enabling asynchronous programming and -efficient execution of code. \ No newline at end of file +* [Call Stack](./call-stack.md) +* [Event Loop](./runtime-environment.md) +* [Execution Context](./execution-context.md) +* [JavaScript Engine](./engine.md) +* [Memory Heap](./memory-heap.md) +* [Runtime Environment](./runtime-environment.md) \ No newline at end of file From e62ecb80424604d73cda763ec268ea01dde77a44 Mon Sep 17 00:00:00 2001 From: sumn2u Date: Sun, 13 Oct 2024 11:30:59 -0500 Subject: [PATCH 2/2] restructure behind scenes chapter --- en/behind-scenes/call-stack.md | 2 +- en/behind-scenes/engine.md | 2 +- en/behind-scenes/event-loop.md | 2 +- en/behind-scenes/execution-context.md | 2 +- en/behind-scenes/memory-heap.md | 2 +- en/behind-scenes/runtime-environment.md | 2 +- 6 files changed, 6 insertions(+), 6 deletions(-) diff --git a/en/behind-scenes/call-stack.md b/en/behind-scenes/call-stack.md index 39a392cd..f386d99c 100644 --- a/en/behind-scenes/call-stack.md +++ b/en/behind-scenes/call-stack.md @@ -5,7 +5,7 @@ description: Understanding Call Stacks in JavaScript --- -## Understanding Call Stacks in JavaScript +## Call Stacks in JavaScript In JavaScript, a Call Stack is a data structure that uses the Last-In, First-Out (LIFO) principle to temporarily store and manage function invocation (call). diff --git a/en/behind-scenes/engine.md b/en/behind-scenes/engine.md index ff9457cd..f5d33864 100644 --- a/en/behind-scenes/engine.md +++ b/en/behind-scenes/engine.md @@ -4,7 +4,7 @@ pageNumber: 258 description: Understanding JavaScript Engines and how they execute JavaScript code. --- -## Understanding JavaScript Engines +## JavaScript Engines A JavaScript engine is a program or an interpreter that executes JavaScript code. The most well-known JavaScript engines are V8 (used in Google Chrome and Node.js), SpiderMonkey (used in Firefox), and JavaScriptCore (used in Safari). diff --git a/en/behind-scenes/event-loop.md b/en/behind-scenes/event-loop.md index 2b200d5a..b1e18966 100644 --- a/en/behind-scenes/event-loop.md +++ b/en/behind-scenes/event-loop.md @@ -4,7 +4,7 @@ pageNumber: 259 description: Understanding the Event Loop in JavaScript. --- -## Understanding the Event Loop in JavaScript +## Event Loop in JavaScript The event loop is a fundamental concept in JavaScript that allows for asynchronous programming. It is responsible for executing code, collecting and processing events, and executing queued sub-tasks. diff --git a/en/behind-scenes/execution-context.md b/en/behind-scenes/execution-context.md index 7523dd2b..c40110cc 100644 --- a/en/behind-scenes/execution-context.md +++ b/en/behind-scenes/execution-context.md @@ -4,7 +4,7 @@ pageNumber: 260 description: Understanding Execution Context in JavaScript. --- -## Understanding Execution Context in JavaScript +## Execution Context in JavaScript In JavaScript, an execution context is an environment where the code is evaluated and executed. It is a fundamental concept that helps manage the scope and behavior of variables and functions. diff --git a/en/behind-scenes/memory-heap.md b/en/behind-scenes/memory-heap.md index b08924de..1033eb0e 100644 --- a/en/behind-scenes/memory-heap.md +++ b/en/behind-scenes/memory-heap.md @@ -4,7 +4,7 @@ pageNumber: 261 description: Understanding Memory Heap in JavaScript. --- -## Understanding Memory Heap in JavaScript +## Memory Heap in JavaScript In JavaScript, memory management is crucial for ensuring efficient and smooth performance of applications. The memory heap is a region in memory where objects, strings, and closures are stored. It is managed by the JavaScript engine's garbage collector. diff --git a/en/behind-scenes/runtime-environment.md b/en/behind-scenes/runtime-environment.md index eea4ee44..45eed9ee 100644 --- a/en/behind-scenes/runtime-environment.md +++ b/en/behind-scenes/runtime-environment.md @@ -4,7 +4,7 @@ pageNumber: 262 description: Understanding Runtime Environment in JavaScript. --- -## Understanding Runtime Environment in JavaScript +## Runtime Environment in JavaScript The runtime environment in JavaScript is the context in which your code is executed. It includes the JavaScript engine, the call stack, the memory heap, and the APIs provided by the environment (such as the browser or Node.js).