How to find image file size in chrome inspect element

user_7339624 0
Viewed 7426

By using Google Chrome's inspect element, I can see image dimensions easily. like it is explained in Google's website.

But I want to know the image file size too (size, like 50kb). I know that I can first download and then look at the image file size on my computer, but I don't think it is the best way.

I want to know if I can find out about image file size in Chrome's inspect elements.

google-chrome
1 Answers

You can either find the file in sources or network tab.

For example, I inspect your avatar and see this url:

https://lh6.googleusercontent.com/-6jIAe62Q10s/AAAAAAAAAAI/AAAAAAAAABw/kRBVixTmLmk/photo.jpg?sz=128

I can look it up in the sources tab by finding the appropriate domain. The file size is listed at the bottom, under the preview.

Developer tools, Sources tab, Image file selected in the left pane according to the url. The size is displayed at the bottom of the middle section.

The sizes are also displayed in the network tab but it has to be open before the image loads, otherwise it doesn't capture. Here it is filtered to show only images:

Developer tools, Network tab, filtered to show images, the size for all files is visible in the Size column.

user_21829000
Related