图片组合使用的mod_pagespeed [英] Image spriting with mod_pagespeed
问题描述
我已经安装了谷歌的mod_pagespeed在Apache 2.2和一切似乎除了图片组合不正常的事实，是工作。
我已经设置的LogLevel调试和我收到的唯一信息是：
[周一3月10日17点51分58秒2014年] [信息] [的mod_pagespeed 1.6.29.7-3566 @ 26487]试图精灵CSS背景。
没有涉及到进一步拼合的消息在日志中显示出来。
我也可以确认图片精灵已开启：
/ mod_pagespeed_statistics？配置
配置：
版本：13：上过滤器
啊添加头
CW压缩空白
CC结合的CSS
JC结合的Javascript
GP的Gif转换为PNG
JP Jpeg格式转换为逐行
MC转换Meta标签
PJ将PNG为JPEG
DJ推迟的Javascript
EC缓存扩展的CSS
EI缓存扩展图片
ES缓存扩展脚本
FC后备重写的CSS
如果拼合进口CSS
HW刷新HTML
CI内联CSS
二内嵌图像
金正日内嵌@import来链接
吉内联JavaScript
JS的Jpeg子采样
LL Lazyload图片
涂左修剪的url
PR优先化关键的CSS
RJ Recom的preSS的Jpeg
RP Recom的preSS巴
RW Recom的preSS的WebP
RC删除评论
リ调整图像大小
比照重写的CSS
JM重写的Javascript
铜重写样式属性使用URL
是雪碧图片
CP地带图像色彩配置文件
MD地带图像元数据
图片spiriting滤波器具有很大的局限性，可能是你的站点触及这些问题的一个或多个。
限制
在雪碧图片过滤器仍处于实验阶段，目前已达
一些限制：
- 只有PNG AMD GIF图片支持; JPG会在将来的版本。
- 只有CSS背景支持;
＆LT; IMG方式＆gt;标记会在将来的版本
- 背景图像不能安全拼合如果HTML元素比背景图像放大（因为这将允许将合并的
图像的额外的像素，显示周围的边缘）。因此，CSS
必须在同一声明作为明确的宽度和高度
背景URL以及宽度和高度必须小于或等于
对这些图像的。
- 的CSS必须的不包括没有背景-URL声明的背景，地位的声明。这样的裸体
背景位置声明可以适用于任何背景图像，
因为我们不知道哪一个，它是不是安全做任何拼合。
- 在Sprite图像过滤器目前安排在垂直条的图像，这可能不是最有效的安排。更多
先进的布局，会在未来的版本。
I've installed Google mod_pagespeed on Apache 2.2 and everything seems to be working except for the fact the image spriting is not working.
I've set the LogLevel to debug and the only message I'm getting is:
[Mon Mar 10 17:51:58 2014] [info] [mod_pagespeed 1.6.29.7-3566 @26487] Attempting to sprite css background.No further messages related to spriting show up in the logs.
I can also confirm the Image Spriting is switched on:
/mod_pagespeed_statistics?config
Configuration: Version: 13: on Filters ah Add Head cw Collapse Whitespace cc Combine Css jc Combine Javascript gp Convert Gif to Png jp Convert Jpeg to Progressive mc Convert Meta Tags pj Convert Png to Jpeg dj Defer Javascript ec Cache Extend Css ei Cache Extend Images es Cache Extend Scripts fc Fallback Rewrite Css if Flatten CSS Imports hw Flushes html ci Inline Css ii Inline Images il Inline @import to Link ji Inline Javascript js Jpeg Subsampling ll Lazyload Images tu Left Trim Urls pr Prioritize Critical Css rj Recompress Jpeg rp Recompress Png rw Recompress Webp rc Remove Comments ri Resize Images cf Rewrite Css jm Rewrite Javascript cu Rewrite Style Attributes With Url is Sprite Images cp Strip Image Color Profiles md Strip Image Meta Data
解决方案The image spiriting filter has a lot of limitations, probably your site is hitting one or more of these issues.
From Sprite Images documentation:
Limitations
The Sprite Images filter is still experimental, and currently has a number of limitations:
- Only PNG amd GIF images are supported; JPG will come in a future release.
- Only CSS backgrounds are supported;
<img>tags will come in a future release.- A background image can't be safely sprited if the HTML element is larger than the background image (since this would allow the combined image's extra pixels to show around the edges). Accordingly, the CSS must have explicit width and height in the same declaration as the background URL, and the width and height must be smaller than or equal to those of the image.
- The CSS must not include any background-position declarations without background-url declarations. Such a naked background-position declaration could apply to any background-image, and since we don't know which one, it isn't safe to do any spriting.
- The Sprite Images filter currently arranges images in a vertical strip, which might not be the most efficient arrangement. More advanced layouts will come in a future release.
这篇关于图片组合使用的mod_pagespeed的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
