Background images not beeing compressed?

41 views
Skip to first unread message

John-Olav Hoddevik

unread,
May 26, 2016, 9:53:34 AM5/26/16
to mod-pagespeed-discuss
I have a lot of images set as background images in divs, like this:
<div class="listeImage" style="background-image:url(image.jpg);background-size:contain;background-position:50% 84%"></div>

My main goal for installing mod_pagespeed is to have these images compressed. But it doesn't seems to be happening. I've tried adding: 
ModPagespeedEnableFilters rewrite_style_attributes_with_url

To the config file, but nothing happens. Is there anything else I could try?

Jan-Willem Maessen

unread,
May 26, 2016, 10:33:58 AM5/26/16
to mod-pagesp...@googlegroups.com
I've reproduced this on modpagespeed.com's example page(!) and filed https://github.com/pagespeed/mod_pagespeed/issues/1319.

-Jan

--
You received this message because you are subscribed to the Google Groups "mod-pagespeed-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mod-pagespeed-di...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/mod-pagespeed-discuss/a9e7809e-c3d9-4f09-9201-1de5863e783e%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

John-Olav Hoddevik

unread,
May 26, 2016, 1:32:29 PM5/26/16
to mod-pagespeed-discuss
Wow, thanks! I hope it will be resolved 😀

Joshua Marantz

unread,
May 26, 2016, 1:38:59 PM5/26/16
to mod-pagespeed-discuss
Hey John -- it looks to me like the module is working, but the example is wrong.  Can you add
  ModPagespeedEnableFilters rewrite_css,rewrite_images,rewrite_style_attributes_with_url
to your config, and let me know if you are getting what you are looking for?

curl http://www.modpagespeed.com/rewrite_style_attributes.html?PageSpeedFilters=rewrite_css,rewrite_images,rewrite_style_attributes_with_url | grep background-image

  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current

                                 Dload  Upload   Total   Spent    Left  Speed

100   501  100   501    0     0   2370      0 --:--:-- --:--:-- --:--:--  2363

    <div style="background-image:url(images/xBikeCrashIcn.png.pagespeed.ic.-f3rxqdUg6.jpg);height:100px"/>


-Josh


On Thu, May 26, 2016 at 1:32 PM, John-Olav Hoddevik <jhod...@gmail.com> wrote:
Wow, thanks! I hope it will be resolved 😀
--
You received this message because you are subscribed to the Google Groups "mod-pagespeed-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mod-pagespeed-di...@googlegroups.com.

Jan-Willem Maessen

unread,
May 26, 2016, 2:27:12 PM5/26/16
to mod-pagesp...@googlegroups.com
Indeed.  I'm in the process of revising the docs to make this requirement a bit more clear.

John-Olav Hoddevik

unread,
May 26, 2016, 3:04:41 PM5/26/16
to mod-pagespeed-discuss
Ok, I've added this:
ModPagespeedEnableFilters rewrite_css,rewrite_images,rewrite_style_attributes_with_url,fallback_rewrite_css_urls

But rewrite_css and rewrite_images is already be part of the default filters I guess?

Well I still can't get it working on my side. Can it be because I'm using background-size and background-position in the CSS?

John-Olav 

John-Olav Hoddevik

unread,
May 26, 2016, 3:16:13 PM5/26/16
to mod-pagespeed-discuss
I can also mention that regular img-tags don't seem to get a new src, but this is added: "pagespeed.CriticalImages.checkImageForCriticality(this);" and data-pagespeed-url-hash="1293376419"
Message has been deleted

John-Olav Hoddevik

unread,
May 27, 2016, 4:06:15 AM5/27/16
to mod-pagespeed-discuss
Yes!

I've added the ModPagespeedLoadFromFile and mapped my images folder to an https url, and suddenly images are starting to get rewritten!


torsdag 26. mai 2016 19.38.59 UTC+2 skrev jmarantz følgende:
Hey John -- it looks to me like the module is working, but the example is wrong.  Can you add
  ModPagespeedEnableFilters rewrite_css,rewrite_images,rewrite_style_attributes_with_url
to your config, and let me know if you are getting what you are looking for?

curl http://www.modpagespeed.com/rewrite_style_attributes.html?PageSpeedFilters=rewrite_css,rewrite_images,rewrite_style_attributes_with_url | grep background-image

  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current

                                 Dload  Upload   Total   Spent    Left  Speed

100   501  100   501    0     0   2370      0 --:--:-- --:--:-- --:--:--  2363

    <div style="background-image:url(images/xBikeCrashIcn.png.pagespeed.ic.-f3rxqdUg6.jpg);height:100px"/>


-Josh

On Thu, May 26, 2016 at 1:32 PM, John-Olav Hoddevik <jhod...@gmail.com> wrote:
Wow, thanks! I hope it will be resolved 😀

--
You received this message because you are subscribed to the Google Groups "mod-pagespeed-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mod-pagespeed-discuss+unsub...@googlegroups.com.

Otto van der Schaaf

unread,
May 27, 2016, 6:57:20 AM5/27/16
to mod-pagespeed-discuss

On Fri, May 27, 2016 at 10:06 AM, John-Olav Hoddevik <jhod...@gmail.com> wrote:
I've added the ModPagespeedLoadFromFile and mapped my images folder to an https url, and suddenly images are starting to get rewritten!

That makes me think that either https fetching was not properly set up earlier, or that these images originally were served as non-cachable or non-transformable by your webserver? Setting up LoadFromFile would address both.

Otto

John-Olav Hoddevik

unread,
May 27, 2016, 7:08:58 AM5/27/16
to mod-pagespeed-discuss
Yes, you are probably right. 

Not sure which one is the case. Right now Pagespeed is working only on our https domain, and is not working on any subdomains served with http.

Before I added LoadFromFile Pagespeed was working on both http and https, but only on js and css files, not images.

A bit confusing.

John-Olav

serge esteves

unread,
Jun 3, 2016, 6:34:53 AM6/3/16
to mod-pagespeed-discuss
I dont' recommend to compress .jpg files because it's already compressed (cpu usage for a negligible saving) and your quality/weight ratio will be bad, its better to optimize yourself your background images before uploading them. So, I don't recommend to activate gzip for jpg files. But you can still activate rewrite_images and specify to not gzip jpg files.

Joshua Marantz

unread,
Jun 3, 2016, 8:51:37 AM6/3/16
to mod-pagespeed-discuss
Hi Serge -- this depends on how the JPG files were created in the first place  There is often significant data reduction by compressing & resizing jpegs for the device and network, as well as (for Chrome & Opera) transcoding them to webp.  See https://developers.google.com/speed/pagespeed/module/filter-image-optimize for details.  Note that mod_pagespeed doesn't gzip jpegs; it recompresses them as jpegs or transcodes them to webp.


John: if you are still having trouble getting PageSpeed to operate on all your domains, can you share your pagespeed.conf?

Thanks,
-Josh


--
You received this message because you are subscribed to the Google Groups "mod-pagespeed-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mod-pagespeed-di...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/mod-pagespeed-discuss/a153ac49-3963-48d9-89d0-11d7dafc1344%40googlegroups.com.
Reply all
Reply to author
Forward
0 new messages