What is JavaScript?

JavaScript (js) is a programming language that allows you to add interactive elements to web pages. These elements can include animations, pop-up windows, search bars, chat widgets, audio and video, real-time stock or crypto prices, and more. It is used in the front-end of many popular websites and can make them more engaging to users by allowing them to interact with the content without having to refresh the page.

Initially created to “make web pages come alive”, js scripts can be written right in the HTML code of a webpage and run automatically as the page loads. JavaScript is an interpreted language which means it is translated into machine code in-process, rather than at the time of compilation like some other languages. This makes it quick to execute, but also means that if you have too much js on a page, it may impact performance.

When a webpage loads, the JS is compiled, parsed, and executed by the JavaScript engine which is a special part of the browser. The engine turns the code snippets into a structure called an Abstract Syntax Tree or AST. The AST is then translated into machine code, and the engine executes the machine code. It is this translation process that takes some time. To improve speed, a technique known as Just-in-Time compilation was added to the JavaScript engine. This turns the code into a binary file that can be read directly by the processor, and so reduces the need for interpretation.

However, Just-in-Time compilers do not perform all of the same functions that a standard interpreter would, and so they cannot be as effective at reducing memory usage. This is one of the reasons why a well-designed website should use both js and HTML to create an efficient layout.

Variables in javascript are a great way for developers to capture data in one place and use it somewhere else on the webpage. For example, if you want to greet visitors by their first name, you could set a variable named firstName in the form and print it out on another part of the page.

To be able to do this, the javascript can travel through the HTML element family tree or DOM to access, modify or even add new elements. It can only do this if it has already been interpreted by the browser and inserted into the engine call stack, which is why the best practice for writing javascript is to put it at the end of the page.

This is to ensure that any functions you write do not need to be compiled, parsed and interpreted again each time they are called. This is a very important aspect of performance optimization. To do this, a special technique called inlining is employed. This inserts the function call into the original code, so the compiler only needs to translate a few lines of code rather than the entire function, saving on time and space in memory.