CODEWITHSUNDEEP
firefox3dweb-inspectorfirefox-developer-tools
SO-user
SO-user

Reputation: 1456

What are the use cases for 3D view in Firefox Developer Tools

I recently noticed the 3D mode in Firefox developer tools, in that you can see your page in a 3D view. We can rotate and re-orient the 3D view by dragging it. Could anyone give me the primary use cases where I would use 3D View?

Sample 3D view:enter image description here

Upvotes: 2

Views: 800

Answers (2)

Mike Ratcliffe
Mike Ratcliffe

Reputation: 1035

There are a few uses I can think of:

  • View the structure of a page... whenever I create a page I make a point of going into the 3D view and looking for "skyscrapers" as mentioned in comment 1. I usually recode them myself to avoid unnecessary iframes etc.
  • Find containers e.g. table cells that have been resized by their content.
  • Find any elements that are thousands of pixels outside a page e.g. to work out how a web page worked or why the page always has a scrollbar.
  • Teaching people how HTML works.
  • Spotting XSS vulnerabilities, see https://gist.github.com/tacomanator/3127271

But if you can think of a way we could make it more useful then please let us know on https://ffdevtools.uservoice.com

Upvotes: 3

therealjeffg
therealjeffg

Reputation: 5830

This tool has an interesting history to it - it was originally created as an add-on by Victor Porof in 2011 as a Google Summer of Code project. It was later added to Firefox's built-in developer tools, but it is not enabled by default.

The main use case is that it allows you to visualize the structure of your markup more easily, for example identifying nested DOM structures such as the social network-related buttons on some sites:

Upvotes: 2

Related Questions