1. How JavaScript Works ?

Introduction


JavaScript is use to make web pages interactive in the browser. Javascript can change web page structures in reaction to user interaction or internal action. It can even change some browser built-in features. Overall it's gives power to the user on the web page in the brower.


How web browser work with javascript ?


Web browser is among most use software in the computer nowdays. It has 3 main parts :

1 - Network stack : responsable for resolving domain name in IP and fetching the resources from the server.

2 - The rendering engine : responsable for transforming the html and CSS into pixels and showing them on the screen.

3 - JavaScript engine : responsable for executing javascript code in the browser


JavaScript engine


There is several javascript engines depending on the browser :

1 - chromium based web browsers (chrome, microsoft edge, brave, opera, vivaldi) use google v8 engine

2 - Firefox use spidemonkey

3 - Apple safari use JavaScriptCore


JavaScript and DOM


DOM stands for Document Object Model. It's a tree like representation of the web page that allow javascript to interact with the web page. Each html element is a node. The root node of the tree is <html> element.

Javascript can access an element and change it's color, width, even remove it from the tree using the DOM.

We will learn in details how to interact with the DOM later in this course.