output all images of the page and give some stats

console_images.js

//
//  images summary
//  output all images in the page
//  quick check on mobile version the images ratios
//  (only for images that are included into the dom)
//
(function($,window,document){
	var r = {
		onepix : [],
		dropped: [],
		oversized: [],
		lowdef: [],
		backgrounds: [],
		regular: []
	};
	
	// stores the images data depending on their case
	var store = function(im) {
		if(im.original.width < 2) r.onepix.push(im); // images that are used for tracking
		else if(im.resized.width < 2) r.dropped.push(im); // there was an image, there is not anymore (width pushed to 0)
		else if(im.source.match(/\.svg$/i)) r.regular.push(im); // vectorial
		else if(im.original.width / im.resized.width > 3) r.oversized.push(im); // more than @3x
		else if(im.original.width / im.resized.width < 1.2) r.lowdef.push(im); // i can see the pixels
		else r.regular.push(im);
	};
	var size = function(source) {
		var im = new Image();
		im.src = source;
		return {width:im.width,height:im.height};
	}
	
	$("img",document).each(function(i){
		var rw = $(this).width(),
			src = $(this).attr('src');
		var ow = size(src).width;
		var im = {original:{width:ow},resized:{width:rw},source:src,type:'image',offset:$(this).offset()};
		store(im);
	});

	var backgrounds = [];
	// store background files
	// return: true  (i stored it)
	//         false (i don't need it)
	var backStore = function(source) {
		// backClean could return false
		if(typeof source !== "string") return false;

		source = source.substring(4,source.length -1);
		if(backgrounds.indexOf(source) === -1) {
			backgrounds.push(source);
			return true;
		}
		else return false;
	};
	// cleans css to file name
	// @param: "url(/some/path/file.png)"
	// @return: "/some/path/file.png"
	var backClean = function(messy) {
		if(typeof messy !== "string") return false;
		if(messy.substring(0,4) != "url(") return false; // linear-gardient
		if(messy == "url()" || messy == "") return false; // empty
		return messy.substring(4, messy.length -1);
	};

	$("*", document).each(function() {
		if ($(this).css('background-image')){
			var src = $(this).css('background-image');
			if(src == "none") return;
			// if I already have this file, let me discard it.
			src = backClean(src);
			if(!src) return false;
			if(!backStore(src)) return false;

			var ow = size(src).width;
			var rw = $(this).css('background-size');

			if(rw == "auto") rw = $(this).width();
			if(rw == "cover") rw = $(document).width();
			// todo: here should be some substrings to calculate %ages
			rw = parseInt(rw);
			if(isNaN(rw)) return; // rare property

			var im = {original:{width:ow},resized:{width:rw},source:src,type:'background',offset:$(this).offset()};
			store(im);
		}
	});


	return r;
})(jQuery,window,document);