DEV Community

BekmuhammadDev
BekmuhammadDev

Posted on

1 1 1 1 1

JS Runtime / Execution context

JavaScript runtime is the environment or engine required to run JavaScript code. These runtime environments parse and execute JavaScript code. JavaScript is the only language that runs in the browser.

Runtime types and operating environment:
1-Google chrome (Browser)

Browsers are the main runtime environment of JavaScript. Each browser has its own JavaScript engine:

  • Google Chrome: V8 engine.
  • Mozilla Firefox: SpiderMonkey engine.
  • Safari: JavaScriptCore (Nitro) engine.
  • Microsoft Edge: Chakra old versions and V8 new versions.

In the browser JavaScript runtime environment, JavaScript code can be used together with HTML and CSS.

2-Node.js

Node.js is a runtime environment for running JavaScript on the server side. This environment is based on the V8 engine and allows JavaScript code to be executed outside the browser.
Nodejs technology runs javascript codes outside the browser.

  • Server scripts: HTTP servers, APIs, etc.
  • Asynchronous performance: The asynchronous nature of Node.js makes it highly efficient and fast.
  • Large ecosystem: There are many modules and libraries for Node.js.

Image description

Execution context
In the JavaScript programming language, the execution context is the environment that contains all the information necessary to execute the code. Each executable code has its own execution context. Execution context contains the following elements:

  • Variable Object All variables, functions and arguments are stored here.
  • Scope Chain
    Scope chain represents the search order of variables and functions. Each execution context has its own scope chain, and this scope chain contains references to the outer parent execution contexts.

  • this Keyword
    The this keyword can refer to different objects depending on the execution context.

Image description

Types of Execution Context

There are 2 main types of execution context in JavaScript:

1-Global Execution Context:

Image description

Image description

2-Function Excution Context:

Image description

Image description

javascript in global execution vs function execution

Image description

Execution context:

Image description

Execution Context

When JavaScript is running in a browser, it cannot be understood directly, so it must be converted into a machine-readable language. When the browser's JavaScript engine encounters JavaScript code, it "translates" the JavaScript code we wrote and creates a special environment that controls the execution. This environment is called Execution context.

**Execution context* can have global scope and function scope. When JavaScript first runs, it creates a global scope.*

Next, the JavaScript **parses* and stores the variable and function declarations in memory.*

Finally, the code will initialize the variables stored in memory.

Execution context is a block of data opened by JavaScript for each block of code, which contains all the information needed for the currently running code. For example, the variables/functions/this keyword

Image description

  • Creation phase - variables declared with var are assigned undefined, variables declared with let are uninitilized and functions are read.
  • Execution phase - variables are assigned values ​​and functions are called.

Sentry blog image

How to reduce TTFB

In the past few years in the web dev world, we’ve seen a significant push towards rendering our websites on the server. Doing so is better for SEO and performs better on low-powered devices, but one thing we had to sacrifice is TTFB.

In this article, we’ll see how we can identify what makes our TTFB high so we can fix it.

Read more

Top comments (1)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

👋 Kindness is contagious

Explore a sea of insights with this enlightening post, highly esteemed within the nurturing DEV Community. Coders of all stripes are invited to participate and contribute to our shared knowledge.

Expressing gratitude with a simple "thank you" can make a big impact. Leave your thanks in the comments!

On DEV, exchanging ideas smooths our way and strengthens our community bonds. Found this useful? A quick note of thanks to the author can mean a lot.

Okay