EmberJS – View Tree

The view tree provides the current state of an application which includes currently rendered template, model, controller, and components in a trees format.

You can inspect the template to see how it is rendered by Ember application −

Click on the template name in the view trees and you will see the selected DOM elements under the Elements panel −

 tree

By default, the view tree disregards the components and can be loaded into the view tree by checking the Components checkbox.

 tree

You can see the highlighted template name and its associated objects when you hover the items in the view trees.

 tree

In the above image, we have hovered on an item which is rounded with red color and related template is highlighted with the other objects in your application.

You can see the rendering duration for the given template under the Duration section in the view tree.

Previous Page:-Click Here

Leave a Reply