跳转到内容

WebP格式CDN自动交付

向网站访问者显示图像最优化目标之一是在保持高显示质量的同时尽量减少图像文件大小
小图像文件大小直接转换为更快加载时间,降低带宽成本并改进用户浏览经验小文件大小直接转换为低图像质量并可能损及访问者满意度保持正确平衡既关键又难
结果 难得找到解决方案 减少图像文件尺寸 而不牺牲图像质量幸运的是 事实正是如此 谷歌WebP文件格式.
WebP是2010年谷歌首次推出的强图像格式WebP格式使用远小于广受欢迎的JPEG图像格式编译照片
if it's so amazing图像格式, 为什么我们不在每个网站都看到它?广度WebP文件格式应用的主要挫折在于它并没有得到甚至最现代浏览器的广泛支持
谷歌热门 染色体web浏览器 歌剧院浏览器原创支持WebP、Firefox和InternetExplorer不支持支持WebP需要动动地决定是否提供WebP文件格式或JPG/PNG图像
数周前我们介绍Cloudinary支持WebP格式 如何支持WEP图像,保存带宽并改进用户性能.文章中,我们描述你如何设置CloudinaryjQuery插件检查浏览器是否支持WebP,如果支持,则告诉Cloudinary动态生成并交付WebP文件而不是标准JPG/PNG文件
Query懒洋溢客户端方法有其长处,但如果处理整个逻辑本可以简单得多 透明化服务端为您服务这正是我们在过去数周中一直在研究的
博客文章中我们想介绍 云性无缝支持动态发送WebP图像.
云化系统现在可识别支持WEP浏览器请求图像URL时云形自动转换图像到WebP文件格式并交付缓存优化 上海CDN.
并通知云形可自动使用WebP f_autundiary智能交付URL
下方可见两幅样本图片左侧图像使用无云新标志URLJP格式传递到所有浏览器中(同时从实时缩放到300px宽度并保留侧比)。右侧图像中包括交付URL中的f_auto,使用Google Chrome即以WebP交付生成WebP图像只权重 6.9KB中意 60%小JPEG版本交付Firefox访问者Safari访问者
https://res.www.aaaalireno.com/demo/image/upload/w_300,f_auto/nice_beach.jpg

PG图像WebP自动图像

16.9KBJPG6.9KBWEP
就是这样微小加法即为网络应用所需要 快速加载并节省高带宽成本网站向统计学上使用chrome比其他人多多的Chrome提供技术时尤其如此
注释 :
  • f_auti系统只支持使用AkamaiCDN交付的云用户用户当前不支持云前分发
  • 透明WebP支持工作时,交付URL必须明文包括'f_auto'因此,你不能设置取出格式内命名变换反之,您可使用命名变换并链化 URL
云化客户集成库已支持新'f_auto'特征几个例子说明如何生成网际网际网际网际网际网际网际网际网际网际网际网际网际网际网际网际
Ruby铁路公司
Cl_image_tag
PHP:
       300xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx? >
Python和Django
云性.CloudinaryImage (sample.jpg).image(width=300,crop=Squa
节点js:
云性图像(sample.jpg) {宽度:100, 裁剪:Squa
.Net:
cloudinary.Api.UrlImgUp.Transform(    new Transformation().Width(300).Height(130).Crop("scale").FetchFormat("auto")).BuildImageTag("sample.jpg");
Java和Android:
cloudinary.url().transformation(    new Transformation().width(300).crop("fill").fetchFormat('auto')).generate("sample.jpg");
webP支持图像优先上传云端,或从服务器代码上传API或直接从访问者浏览器上传API
Cloudinary除直接上传外,还支持通过公共URL取图像,转换这些实时图像并交付通过CDN优化后生成图像(见 博客文章详解)
举个例子,这意味着您可以很容易地将云化与网站整合而无需修改您的基础设施和代码简单前缀图像URL
云形新WebP支持下,您现在可以设置取件格式 汽车动态转换图像WebP格式并改进网站性能
举例说, URL提供Usain Bolt图片取自远程Wikimedia公共HTTP URL远程图像由云端取取,持久存储云中,动态转换为WebP,通过高端CDN支持并交付优化并缓存
https://res.www.aaaalireno.com/demo/image/fetch/f_auto/
http://upload.wikimedia.org/wikipedia/commons/1/13/Usain_Bolt_16082009_Berlin.JPG

Usain Bolt-cet-WebP

注意WebP上方图像缩放 50% 从33.6KB到16.8KB不影响显示质量可见
可动态应用云化图像变换取图像下示例将图像裁成广场,使其颜色轻化并环绕角角
https://res.www.aaaalireno.com/demo/image/fetch/w_160,h_160,c_fill,e_fill_light:0,r_30,f_auto/
http://upload.wikimedia.org/wikipedia/commons/1/13/Usain_Bolt_16082009_Berlin.JPG
Usain Bolt-cet-WebP带特效
WebP文件格式是优化网站应用的高效方式CloudinaryWebP支持我们希望WebP转换和交付过程如此简单,不使用脑机,研发IT方面近乎零技术努力
WebP自动转换和CDN发送WebP图像目前可供所有免费付费计划使用
最好你试一试 告诉我们你的想法任何反馈或建议都非常感激
回顶

特征邮箱

Baidu
map