JavaScript Runtime Environments
Agenda
- Introduction
- Agenda
- JavaScript Runtime Environments
- Types of JRE
- Summary
Introduction
JavaScript is one of, if not the most, popular programming languages around these days.
However, what is happening underneath the hood is commonly overlooked and can be a valuable set of knowledge for all developers working with JavaScript.
Especially for debugging and use of specific tools.
That is what will be covered today... the workings of under the hood.
Timeline
1995
Brenden Eich developed a new scripting language in 10 days. Called Mocha, then changed to LiveScript, then eventually JavaScript
1997
European Computer Manufacturers Association (ECMA) standard is established to advance the standardisation of JavaScript.
1999
ES3 release and IE5 (internet explorer) is popular
2000-2005
AJAX started to gain popularity
2008
Douglas Crockford released a book that went over JavaScript's good parts and JSON. ES5 is released
2015
ES6/ECMA Script 2015 comes out.
What is JRE
The JavaScript Runtime Environment is a container where JavaScript code is executed. It acts as a bridge between your program and the operating system.
JavaScript is inherently a single-threaded language and due to lots of computers having powerful multi-core systems and JS being so popular. JS needed a way to overcome the limits put on it by being a single-threaded language... runtime environments.
It allows for advanced features to be added in for more functionality, such as: task scheduling, multi-threaded application development, timeouts and intervals.
The JRE Engine
A runtime environment cannot exist without an engine. The JavaScript engine consists of a memory heap and a call stack.
The heap
Is the first container in the environment and it is essentially just storage for unprocessed objects and variables.
The call stack
Every time an execution of a certain context begins its placed on the stack and when the execution is finished that specific context is pulled off the stack.
An execution context (generally) is either a function call or any code that exists outside of a function.
Web / Browser APIs
Web APIs are not part of JS engine, but of the runtime environment.
Sometimes data from the call stack will sit in the Web APIs storage until an action is triggered (click) which will launch the callback queue.
These APIs enable the execution of tasks in the background creating the illusion of a multi-threaded environment.
They allow JS to interact with external sources and perform operations asynchronously.
Queues
Simply determines the order of which tasks are executed by the JavaScript engine. There are 2 types of queues: Callback Queue (Macrotask) and the Microtask Queue.
The Callback Queue hold tasks that were pushed from the Web APIs such as XMLHttpRequest or Events like mouse clicks and keyboard inputs. When the call stack is empty and the microtask queue doesn't have any priority tasks. The event loop moves the first task from the callback queue to the call stack for execution.
The Microtask Queue handles the promise callbacks which are set to run after the current execution and before the next task in the task queue.
The microtask queue is processed before the callback queue.
The Event loop
Is a continuous process that constantly checks the call stack, callback queue and microtask queue.
It takes callback functions from the callback and microtask queues (prioritised) and puts them in the call stack so that they can be executed.
Types of JRE
Browser JRE
Most common place to write JavaScript, they are known as front-end applications.
They can only be executed in the browser and only be used for front-end purposes.
For other purposes you'd need to use an additional language, something like PHP.
Node JRE
Was originally made with the sole purpose of letting developers run JavaScript without a browser.
Gaining traction due to it allowing developers to work full stack rather than just on the front-end.
More and more developers are slowly transitioning to use more node now for the full stack availability.
Summary
- JavaScript is run within a JRE
- A JRE consists of a JS engine, Web APIs, Queues, and an Event Loop
- There are 2 main types of JRE:
- Browser JRE - Front end
- Node JRE - Front end and back end