[00:00:27] So let's actually even draw that for a second. Another sort of schematic diagram here of the web browser. I think it'd be useful to keep in this corner here for a bit. That's very strange shape, keep in the corner here. Okay, so the only file type we can open directly in the web browser, actually, when you open a www.wikipedia.org, whatever page, it's loading what file type Alexa, what's the only file that you can actually open directly in the web browser?
[00:00:58] HTML. HTML, exactly. So it's literally, and we're doing this mostly on our local computers, that means on our computer itself, but it's literally taking in, for example, like app.html, loading it in. And then that is being parsed, that means line by line it's being interpreted, read figured out what it says by the HTML parser, there it is.
[00:02:24] It's gonna have a thread of execution that can thread through and execute code line by line and run code. What a dream, it's beautiful. Let's do it. But note, other than that, Java is a pretty basic language. I think it's very nice language, there's a couple of very cool things.
[00:03:36] That is it, it's gonna become profoundly powerful though, if we can save data, change it, and then use it maybe in the DOM, in a C++ list. Which we know as soon as anything's added here, will be displayed as pixels on a webpage, beautiful. Note actually technically what's happening there is the render engine is shooting out an image of the page to the graphics card, the graphics hardware 60 times a second.
[00:04:10] Kind of cool, right, 60 times a second. That's actually the output of the web browser. It's like throwing funneling out an image, 60 times a second to graphics card. Okay, great. So we know then, for our purposes, we'll just keep it as like a nice web page, there it is.
[00:04:28] And that's our output, we are going to have our DOM in purple from now on. And a big change, there it is, it's our C++ list of elements. There it is, list of elements, beautiful. The first thing we're adding here, Phil, is what element from our HTML which is not C++.
[00:04:53] That's our HTML code. I'm probably gonna just, yeah, we are gonna run our HTML code first. What's the first thing it adds to our C++ list of nodes, Phil? A script element or a script node? Script, exactly. Script, linking to which file? App.js. And Phil said it better than me there, exactly.
[00:05:11] A script node, perfect. Now, that won't show anything on the page. But we know that anything that's added to the DOM will be added to the page if it's a visual element. And this is all handled by the core of the web files of or web code of the browser.
[00:06:17] And it's initially running all the code, which is the global almost single the overall file of code is a function called global that is now running. As soon as we start running a function, it will be added to that stack of functions being run, that list of functions being run so that we can keep track of where we are.
[00:06:55] And be able to change it, I'm very excited that we're storing some data, that might be able to be changed. John, go ahead. First just interface with the pause, and it's setting it to the undeclared, That sounds very fancy already. [LAUGH] Yes, so we are going to in line 1 store, and keep it simple for us John, So it is setting it to the Hi then.
[00:07:19] Yes, Hi, and then it'll hard for me to write hand emoji, so I'm not gonna do that for long. So what are we gonna do, Alexa, right after that? Then we're gonna reassign post to the string Hi. Beautiful, reassign, much easier for me to write there it is, perfect.
[00:09:13] That's actually a whole wealth of functions in here. Does anybody know any other ones? Yes, Phil, please Error Error, good cool. I definitely know all of these. [LAUGH] So I'm not gonna spell them just in case, okay, maybe it's error that some of the error possibly, yes. Yeah, exactly.
[00:12:15] So the way we capture that always is within an object. In this case, our object stored in the label document is gonna have a hidden property linking to this position in C++, where we have our list of all the elements on the page. Beautiful, and it's going to be full to the brim, or as we say in England, just so you can spread a new word, because it isn't normal phrase, but it's gonna be chock a block with, [LAUGH] I don't wanna be a clean show your parody.