Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Weird pagespeed URL for PNG image?

I uploaded a PNG image with alpha transparency to my server with the filename logo.png, however, when the image is used on a page and I go to see it's file-path, I get:

http://example.com/i/300x300xlogo.png.pagespeed.ic.0A66xVq4G9.png

That file is nowhere to be seen on the server.

I don't know if it affects it, but the actual image size is 400px by 400px, and I have it displayed in the HTML as 300px by 300px. (Don't ask.)

Could it be my web-host doing this? Seems to prefix the file with the resolution to be displayed at: 300x300x and also has that weird suffix: .pagespeed.ic.0A66xVq4G9.png

like image 253
Baumr Avatar asked Oct 28 '12 21:10

Baumr


2 Answers

The URL you're seeing is as intended: mod_pagespeed rewrites the image URL to an optimized name and embeds the size, as well as the fingerprint of the content into the filename.

If you're downscaling the image in HTML from the original size.. you're wasting user's bandwidth, which is especially painful on mobile. Advantage of mod_pagespeed is that it can do this resizing for you on the fly - simply specify the desired dimensions in the HTML and it will do the right thing.

You can read more about the various image optimizations done by mod_pagespeed here: https://developers.google.com/speed/docs/mod_pagespeed/filter-image-optimize

What you're describing as "loading slower" sounds like "image lazyload": https://developers.google.com/speed/docs/mod_pagespeed/filter-lazyload-images

The images are deferred until onload fires, which helps get the page painted faster to the screen. You can also configure mod_pagespeed to do this on-scroll, such that only visible images are loaded. Finally, you can also disable this specific filter, but keep the image optimization done above.

P.S. mod_pagespeed is no longer beta, the team recently shipped 1.0.

like image 93
igrigorik Avatar answered Sep 28 '22 08:09

igrigorik


Solved! Google Pagespeed was enabled by default in the webhosts control panel. Hopefully this will help anyone else.

I noticed that images would actually load slower, they would flash once the document finished loading. (Google Pagespeed is beta though.)

like image 39
Baumr Avatar answered Sep 28 '22 06:09

Baumr