DEV Community

WTF is the DOM?

Ian Jones on February 18, 2020

If you would prefer to watch this post, you can do so with this community resource lesson on egghead.io. DOM stands for Document Object Model. It'...
Collapse
 
bogdanned profile image
Bogdan Nedelcu

Great quick piece.

It would be great if you could have detailed a bit more about what specific kind of tree the DOM is. How is it transversed and how that affect the painting of a page, resources fetching and so on.

Collapse
 
theianjones profile image
Ian Jones

That is definitely getting into browser internals that I have only a little familiarity with. I would love to see a post on that though!

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀

Did you know that #document is a node as well. I guess that makes sense given that document.body and document.head are not roots, this isn't a multiroot tree.

I think after many years I still have fundamental gaps in my knowledge and so it's good to read little posts like this.

Collapse
 
theianjones profile image
Ian Jones

What are some other gaps that you have discovered lately?

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀

Great question!

  • That not all requests are async
  • Object.assign actually assigns not copies
  • semicolons should be used.
  • loops and blocks can be labelled

I have written a lot of posts lately about wierd bits I thought I knew.

Collapse
 
omarsteam profile image
omar-steam

Good first piece my guy. The only critique I have is show the document.body.firstElementChild on a browser via a screenshot or something if you got what I'm saying. I'm definitely giving you a follow though for the effort you put it into this article. Shout out to you.

Collapse
 
ffirsching profile image
Felix Firsching

Great article, maybe elaborate a bit on why .firstElementChild works in this case, because if one has no knowledge what so ever on document it may not be obvious. Otherwise, keep it up!

Collapse
 
theianjones profile image
Ian Jones

Thanks for the feedback! I appreciate it