Geek Answers Handbook

Printing a web page rendering tree

I read that a "rendering tree" is created by a browser that combines HTML and CSS into one tree. (Source: https://developers.google.com/web/fundamentals/performance/critical-rendering-path/render-tree-construction ). Is there a way to actually print the render tree for a given webpage?

+4
source share
1 answer

I'm looking for the same opportunity as you! The closest I found is the DumpRenderTree tool that comes with the source of the Webkit engine.

DumpRenderTree I haven't used it yet since I was unable to compile webkit. But I saw examples of its output:

Content-Type: text/plain
layer at (0,0) size 808x820
   RenderView at (0,0) size 800x600
   layer at (0,0) size 800x820
      RenderBlock {HTML} at (0,0) size 800x820
        RenderBody {BODY} at (8,8) size 784x804
         RenderHTMLCanvas {CANVAS} at (0,0) size 800x800 [bgcolor=#808080]
          RenderText {#text} at (0,0) size 0x0
    #EOF
#EOF

, ,

, .

0

More articles:


All Articles