Still feeling sick, so another short entry for today.
What I learnt
Just going through more foundational topics in JavaScript / TypeScript so I can get a better grasp of how exactly the web applications are being loaded / created / rendered, etc. This seems really elementary to some, but it’s good for me to address some gaps in knowledge:
Web apps load HTML first, then CSS, then JS / TS.
The DOM (Document Object Model) is a JS / TS object that allows us to manipulate the entirety of the document (meaning the web page that’s rendered, and all of it’s components).
Theoretically, we could create an entire web application in JS (less the initial HTML file required), but it’d be quite slow to allow all of the JS to load … so;
That’s why we could use something like a virtual DOM (or second order DOM) that creates changes, and then uses a diff method to determine what changed and then only update that.
Server-side rendering is basically a compromise between the speed of rendering HTML elements, and bringing in the styling and reactivity later. It allows for the website to load without a delay, but sometimes “pops” which is called a Flash of Unstyled Content (FOUC)
Streaming SSR is probably a better improvement to this because you could create an illusion of a full web app, without having to load everything at once.
If we were to use server-side logic in a dApp, we could do things like: