• JavaScript

What is a Runtime?

From the class:  The JavaScript Runtime

In a programming environment, the runtime is the code that runs our code, typically in a lower level language like c++ or c. I'd like to give you some intuition about what the runtime is and why it's important that we study it at all. Let me start off by showing you an example of some of the things that the runtime has to do.

In this example, I have an application JavaScript file. It's called app.js. And it just has a single function in it named say hello. Now so far, this JavaScript file is just a text file. It's just a text file that contains JavaScript code. Now, let's say you've been tasked with writing some other code that's going to execute and run this program.

That's the mindset you want to have when you think about what the runtime has to do. So for example, when we load up this program into memory, we need to read the fact that this function has been created and now put that in memory so that we can call it later.

Next, down in the console, let's say I type say hello. Now, I'm going to call this function, which will drop me into the debugger. Now, a bunch of things just happened here. First, the runtime has to go and find this function somewhere in memory. And then, it has to do some set up.

For example, if I passed in any arguments, it needs to make those arguments available to the code inside the function. The runtime can take these arguments, along with the address or the name of the function, and push them onto a data structure called a call stack which helps it manage the process of calling and returning from functions. We'll talk more about a call stack a bit later.

Inside the function, if we step through it, eventually the function will return. When it does, the runtime needs to manage making the return value available to the caller of the function. I've added some code to app.js try out another aspect of the runtime called the event loop.

If I call this function, it executes some code right away and then puts an additional function on something called a task queue about two seconds later. You may have heard about the event loop, and the runtime provides all the machinery required to make it work. Our application code has been written in JavaScript, so that includes the file that we had at app.js and also the code we typed directly into the console.

And that was running inside of the Chrome browser. We were actually using the Chrome debugger. But it's all part of the Chrome browser project, and that's implemented in c++. It's another project you can go and take a look at the source code yourself. Chrome uses another project called V8 which is also written in c++.

And this is the software project that compiles our JavaScript and then runs it. So it contains the runtime components that we've been talking about. So far, we've been working only in the browser or on the client, but we can also write JavaScript code anywhere else like on the server. So in some cases, we might have our application written in JavaScript, running on something like node js.

Node js is a project which is written in c++ just like the browser. And it, in turn, also uses the V8 JavaScript engine to compile and run our JavaScript. But node js adds a bunch of libraries, particularly for doing input and output asynchronously.

You might be using a higher level framework like a meteor js. In that case, we still write our app in JavaScript, but the libraries that we use will be implemented as part of the meteor framework which is also mostly written in JavaScript. And then, meteor intern will run on node js which is written in c++.

And again node js will ultimately use V8 to compile and run our JavaScript. Since we've been talking a lot about V8, let's head over and take a look at the project. Just like any other project, like node or meteor, we have source code for V8 which you can download since it's open source.

So here's what the V8 project looks like. Most of it is located in the source folder. If we open up one of the files in the project, you'll see c++ code, that's responsible for running our JavaScript. Now, as you can see, V8 is a massive project.

And so in this class, our goal is not to learn all about the V8 engine. Instead, it's to learn about the elements of the runtime that will affect our application skills the most. The two key benefits that we get by studying the runtime is, first, we'll be a lot more confident about writing code because you'll know the order in which it executes and what's happening under the hood.

The second is to become better at debugging our apps. So what's actually happening when we see a stack trace. And how can we get to the root of problems a lot more quickly? This is also a prerequisite class for understanding how other frameworks are implemented, frameworks like a meteor js.

So I highly recommend this class, and I hope you enjoy it. I think it should be pretty practical relative to your applications at your building.