Mathieu Henri by Mathieu Henri in Blog

Post tags: dragonfly resource-inspector

This post is licensed under a Creative Commons Attribution 3.0 Unported license.

Resource Inspector Reloaded

Today a new Resource Inspector landed in Opera Dragonfly. Built on top of the latest work on the Network panel, it makes it easier and more intuitive to access the resources and documents of your page or application.

<h2>New look & feel.</h2> Exit the flat table and tabbed interface. Say "Hello!" to the structured tree of the tabs and grouping of the markup, stylesheets, scripts, images, fonts, other resources and documents on one side, and a detailed resource view on the other.



<h3>Navigation, search and filter.</h3> The elements of the tree can be expanded or collapsed with a single click. Additionally, this will cascade down the child elements when holding the Shift key.

Each tab, document and group features a bubble with the number of resources it holds. Cross-origin and protocols are also listed to help you spot resources loaded from a CDN, external iframes and other data: URI resources.

The URL filter lets you prune the tree. That way it's easy to find the images sent in webp, all the jQuery plugins, the images and scripts hosted on the same domain, etc. Of course it is also possible to perform a search in the text resources. As usual the F3 and Shift+F3 keyboard shortcuts navigate through the results of the search and filter.



<h3>Resource details.</h3> Pressing the and cursor keys in the tree will navigate through the expanded resources. The selected resource is displayed on the right-hand side and comes with a short description giving further information – including, where appropriate, the encoding, MIME type, guessed type, size, and resolution – as well as a link to open the resource in a new tab.

The major types of resources are recognized and displayed – for instance it is now possible to preview Web fonts, edit the sample string and quickly see how it compares in the various web fonts of the page. Plugin-based content, on the other hand, is problematic to embed in a tool as powerful as Opera Dragonfly, hence you will only get a link to open that content in a new tab.



We hope you enjoy our new Resource Inspector. As ever, we welcome any feedback and further suggestions.