How do JavaScript Engine and Runtime work together?

Given the detailed information about the different steps that are being executed in the Engine and the Runtime, we can easily suppose how they both work together.

The first thing that needs to happen before code execution is for JavaScript to understand the code. This means analyzing the code against the grammar of JavaScript language and determining the format of a sentence.

After understanding the code, JavaScript needs to do some other tasks to execute the code like resolving functions, values of parameters, managing returns, ordering function calls, collecting garbage memories, and preparing machine instructions. All of this is job of the Engine.

After the Engine has finished its job, the Runtime comes to play. As explained above, it checks the callback queue, and the event loop grabs whatever is inside it to schedule it for execution.

We can see how the different parts of the JS Engine and Runtime work together in the following diagram.