What is the term for this called?

I'm sure it has something to do with how the website is programmed, and what language, but I would like to know the exact reason too.
 
Do you mean that you don't see the same code through view-source: as you see through "Inspect element" after the website has rendered completely in your browser?

This happens on majority of the websites to some extent. Its's just that landing page of YouTube is so dependent on data that will be fetched further into the execution that what you get on your initial request does not look like the finally rendered webpage at all. It's not as much a technology as it is a way of delegating workload and it's referred to as client-side rendering. The idea is as follows:

1. Client sends a request to server asking for a web page.
2. Server replies with basic HTML layout (this is what you see through view-source: ) which will contain instructions on what sources to fetch next and how to execute those.
3. Client reads the response and complies with instructions, requesting additional files, data and executing code as required.
4. As a result, the client will have fetched all data and built final front-end according to that data.

This is done in JavaScript and, as mentioned before, is a common practice.
 
this is called minify html
you can minify css and js too
it helps tiny bit in speed. also makes it hard for people like you to look at it on purpose.
lots of free online tools to minify code exist.
and there are ones to un-minify code.
 
Back
Top