[chromium-dev] Getting started and a bit lost.

Steve Kobes

2018-11-09 14:38:53 UTC

You might enjoy Life of a Pixel <http://bit.ly/lifeofapixel>, which
describes the complete flow of the rendering pipeline with pointers to the
code.

To learn the answer to your question, "how an element is created", we can
print a stack trace in the constructor of the Element
<https://cs.chromium.org/chromium/src/third_party/blink/renderer/core/dom/element.h>
class.

Element::Element(const QualifiedName& tag_name,
Document* document,
ConstructionType type)
: ContainerNode(document, type), tag_name_(tag_name) {
* base::debug::StackTrace().Print();*
}

If we build Chrome with this change and visit about:blank we can see output
like this <https://pastebin.com/raw/8GZm7Hg7>. Reading from the bottom
up, several things can be discerned:

- the renderer process is running a message loop
- a task was posted to the message queue which accepts a mojo
<https://chromium.googlesource.com/chromium/src/+/master/mojo/README.md>
IPC
- this IPC handler commits a navigation inside the RenderFrame
- navigation invokes the loader
- loader invokes the parser (to parse the content as it loads)
- parser uses an HTMLTreeBuilder
<https://cs.chromium.org/chromium/src/third_party/blink/renderer/core/html/parser/html_tree_builder.h>
to build the DOM
- the element is created through an HTMLElementFactory
<https://cs.chromium.org/chromium/src/out/Debug/gen/third_party/blink/renderer/core/html_element_factory.h>
(note the file's location in out/Debug/gen and header comments which tell
us this class is auto-generated from a template and some JSON files that
describe the types of elements)
- the <body> element is an HTMLBodyElement
<https://cs.chromium.org/chromium/src/third_party/blink/renderer/core/html/html_body_element.h>,
which subclasses Element

The flow will vary for other types of elements or other ways of creating
them, but perhaps this helps you get started.

Steve

Post by Emett Speer
Hello,
I'm exploring the code base at the moment but getting a bit stuck,
currently I'm looking for something that will explain the flow for things
like how an element is created.
I have found lots of talks and documentation as to a high level overview
but I'm more looking for how it flows through the code. Would anyone know
of some documentation I'm overlooking for that?
Thank you,
Emett
--
--
http://groups.google.com/a/chromium.org/group/chromium-dev
---
You received this message because you are subscribed to the Google Groups
"Chromium-dev" group.
To view this discussion on the web visit https://groups.google.com/a/
chromium.org/d/msgid/chromium-dev/fcfa52d0-fe48-4c93-a80c-
475aef17a74c%40chromium.org
<https://groups.google.com/a/chromium.org/d/msgid/chromium-dev/fcfa52d0-fe48-4c93-a80c-475aef17a74c%40chromium.org?utm_medium=email&utm_source=footer>
.

--
--
Chromium Developers mailing list: chromium-***@chromium.org
View archives, change email options, or unsubscribe:
http://groups.google.com/a/chromium.org/group/chromium-dev
---
You received this message because you are subscribed to the Google Groups "Chromium-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to chromium-dev+***@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/chromium-dev/CAAjAU%3DYONJF19ruik4BQQ8ngB2QTwQh2-T%2BV0%2BDbcJoZiFoKBw%40mail.gmail.com.