简体   繁体   English

PNG图像的奇怪的pagespeed网址?

[英]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: 我使用文件名logo.png将带有alpha透明度的PNG图像上传到我的服务器,但是,当在页面上使用图像并且我去看它的文件路径时,我得到:

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. 我不知道它是否会影响它,但实际图像大小是400像素×400像素,我在HTML中显示为300像素×300像素。 (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 似乎在文件300x300x要显示的分辨率: 300x300x并且还有一个奇怪的后缀: .pagespeed.ic.0A66xVq4G9.png

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. 您看到的URL符合预期:mod_pagespeed将图像URL重写为优化名称,并将内容的大小和指纹嵌入到文件名中。

If you're downscaling the image in HTML from the original size.. you're wasting user's bandwidth, which is especially painful on mobile. 如果你从原始大小缩小HTML格式的图像...你浪费用户的带宽,这在移动设备上尤其痛苦。 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. mod_pagespeed的优点是它可以动态地为您调整大小 - 只需在HTML中指定所需的尺寸,它就会做正确的事情。

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 您可以在此处详细了解mod_pagespeed所做的各种图片优化: 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 您所描述的“加载速度较慢”听起来像“图像延迟”: 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. 图像被推迟到onload fires,这有助于使页面更快地绘制到屏幕上。 You can also configure mod_pagespeed to do this on-scroll, such that only visible images are loaded. 您还可以配置mod_pagespeed以在滚动时执行此操作,以便仅加载可见图像。 Finally, you can also disable this specific filter, but keep the image optimization done above. 最后,您还可以禁用此特定过滤器,但保持上面的图像优化。

PS mod_pagespeed is no longer beta, the team recently shipped 1.0. PS mod_pagespeed不再是测试版,该团队最近发布了1.0。

Solved! 解决了! Google Pagespeed was enabled by default in the webhosts control panel. 默认情况下,在Webhosts控制面板中启用了Google Pagespeed 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.) (谷歌Pagespeed虽然是测试版。)

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM