跳转到内容

优化动画GIF带损压缩

即使是图像格式动画GIF越来越受欢迎,文件大小通常很大,造成缓慢加载并高带宽成本GIF格式老化,现代视频剪片不优化开发者快速加载动画GIF并交付优化图像的工作复杂耗时

云形可转换动画GIF视频,减少文件尺寸并保存带宽(见此邮局详解)视频嵌入网站与应用比普通图像难得多, 更不用说视频自播放在一些浏览器和移动设备中无效或可转换动画GIF动画WEP文件.WebP格式由Google开发, 只对Chrome Android和Opera工作,

GIF转换工具往往产生大高视觉质量文件或小低视觉质量文件,两者均达不到优化标准。

损压缩启动时,过滤发生后,通过扫描线上冗余模式增加消除某些像素数据现实中用词损耗压缩GIFs误名,格式基础调色板,因为相关压缩算法无损,因此输出中无数据损

注释 :

8位GIF限制256色,将其他图像格式转换为GIF做点什么导致数据丢失

参考阅读此云文件段图像优化:原因、事物和工具

优化动画GIF失压技术产生小但视觉动画 双赢币游国际真人娱乐云形应用损压缩平台即时动态URL为什么因为压缩过程发生在云中

所有你需要做的设置国旗参数切换失落感高山市散失内URLs)举例说,这个动画GIF命名小猫打上传云房6.3MB大小化 <\/Image>","codeSnippet":" \n\n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\");","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\");","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\");","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\");","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-image>","codeSnippet":" \n\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\");","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\");","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('kitten_fighting.gif').toHtml();","codeSnippet":"cloudinary.imageTag('kitten_fighting.gif').toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"kitten_fighting.gif\").image()","codeSnippet":"CloudinaryImage(\"kitten_fighting.gif\").image()","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('kitten_fighting.gif'));","codeSnippet":"(new ImageTag('kitten_fighting.gif'));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"kitten_fighting.gif\")","codeSnippet":"cl_image_tag(\"kitten_fighting.gif\")","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().imageTag(\"kitten_fighting.gif\");","codeSnippet":"cloudinary.url().transformation(new Transformation().imageTag(\"kitten_fighting.gif\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"kitten_fighting.gif\")","codeSnippet":"cl_image_tag(\"kitten_fighting.gif\")","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.BuildImageTag(\"kitten_fighting.gif\")","codeSnippet":"cloudinary.Api.UrlImgUp.BuildImageTag(\"kitten_fighting.gif\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation());","codeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation());","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().generate(\"kitten_fighting.gif\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().generate(\"kitten_fighting.gif\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().generate(\"kitten_fighting.gif\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation().generate(\"kitten_fighting.gif\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation());","codeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation());","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"kitten_fighting.gif\") \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"kitten_fighting.gif\") \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"kitten_fighting.gif\")","codeSnippet":"$.cloudinary.image(\"kitten_fighting.gif\")","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\");","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\");","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.agrosoland.com\/demo\/image\/upload\/kitten_fighting.gif","cloud_name":"demo","host":"res.www.agrosoland.com","type":"upload","resource_type":"image","transformation":[],"transformation_string":"","url_suffix":"","version":"","secure":true,"public_id":"kitten_fighting.gif","extension":"gif","format":"gif","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例 原创非优化动画GIF

添加散失参数交付URL减少40%2.5MB.优化GIF显示如下,看起来像原创一样锐利 <\/Image>","codeSnippet":" \n\t \n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\").delivery(format(gif()).lossy());","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\").delivery(format(gif()).lossy());","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\").delivery(format(gif()).lossy());","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\").delivery(format(gif()).lossy());","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\").delivery(format(gif()).lossy());","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\").delivery(format(gif()).lossy());","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('kitten_fighting', {flags: \"lossy\"}).toHtml();","codeSnippet":"cloudinary.imageTag('kitten_fighting', {flags: \"lossy\"}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"kitten_fighting\").image(flags=\"lossy\")","codeSnippet":"CloudinaryImage(\"kitten_fighting\").image(flags=\"lossy\")","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('kitten_fighting.gif'))\n\t->delivery(Delivery::format(\n\tFormat::gif())\n\t->lossy()\n\t);","codeSnippet":"(new ImageTag('kitten_fighting.gif'))\n\t->delivery(Delivery::format(\n\tFormat::gif())\n\t->lossy()\n\t);","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"kitten_fighting\", array(\"flags\"=>\"lossy\"))","codeSnippet":"cl_image_tag(\"kitten_fighting\", array(\"flags\"=>\"lossy\"))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().flags(\"lossy\")).imageTag(\"kitten_fighting\");","codeSnippet":"cloudinary.url().transformation(new Transformation().flags(\"lossy\")).imageTag(\"kitten_fighting\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"kitten_fighting\", :flags=>\"lossy\")","codeSnippet":"cl_image_tag(\"kitten_fighting\", :flags=>\"lossy\")","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Flags(\"lossy\")).BuildImageTag(\"kitten_fighting\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Flags(\"lossy\")).BuildImageTag(\"kitten_fighting\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation()\n\t.delivery(Delivery.format(\n\tFormat.gif())\n\t.lossy()\n\t));","codeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation()\n\t.delivery(Delivery.format(\n\tFormat.gif())\n\t.lossy()\n\t));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setFlags(\"lossy\")).generate(\"kitten_fighting\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setFlags(\"lossy\")).generate(\"kitten_fighting\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().flags(\"lossy\")).generate(\"kitten_fighting\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation().flags(\"lossy\")).generate(\"kitten_fighting\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation()\n\t.delivery(Delivery.format(\n\tFormat.gif())\n\t.lossy()\n\t));","codeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation()\n\t.delivery(Delivery.format(\n\tFormat.gif())\n\t.lossy()\n\t));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"kitten_fighting.gif\")\n\t delivery(Delivery.format(\n\tFormat.gif()) {\n\t lossy()\n\t }) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"kitten_fighting.gif\")\n\t delivery(Delivery.format(\n\tFormat.gif()) {\n\t lossy()\n\t }) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"kitten_fighting\", {flags: \"lossy\"})","codeSnippet":"$.cloudinary.image(\"kitten_fighting\", {flags: \"lossy\"})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\").delivery(format(gif()).lossy());","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\").delivery(format(gif()).lossy());","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.agrosoland.com\/demo\/image\/upload\/fl_lossy\/kitten_fighting.gif","cloud_name":"demo","host":"res.www.agrosoland.com","type":"upload","resource_type":"image","transformation":[{"flags":"lossy"}],"transformation_string":"fl_lossy","url_suffix":"","version":"","secure":true,"public_id":"kitten_fighting.gif","extension":"gif","format":"gif","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例 优化动画GIF压缩

GIF压缩极优小技巧:微调压缩级压缩压缩压缩质量问题参数(q二维内值))的默认值80.启动损压缩设置质量问题参数切换50码小猫GIF制作2.1-MB图像约30%原创尺寸

<\/Image>","codeSnippet":" \n\t \n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('kitten_fighting', {flags: \"lossy\", quality: 50}).toHtml();","codeSnippet":"cloudinary.imageTag('kitten_fighting', {flags: \"lossy\", quality: 50}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"kitten_fighting\").image(flags=\"lossy\", quality=50)","codeSnippet":"CloudinaryImage(\"kitten_fighting\").image(flags=\"lossy\", quality=50)","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('kitten_fighting.gif'))\n\t->delivery(Delivery::format(\n\tFormat::gif())\n\t->lossy()\n\t)\n\t->delivery(Delivery::quality(50));","codeSnippet":"(new ImageTag('kitten_fighting.gif'))\n\t->delivery(Delivery::format(\n\tFormat::gif())\n\t->lossy()\n\t)\n\t->delivery(Delivery::quality(50));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"kitten_fighting\", array(\"flags\"=>\"lossy\", \"quality\"=>50))","codeSnippet":"cl_image_tag(\"kitten_fighting\", array(\"flags\"=>\"lossy\", \"quality\"=>50))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().flags(\"lossy\").quality(50)).imageTag(\"kitten_fighting\");","codeSnippet":"cloudinary.url().transformation(new Transformation().flags(\"lossy\").quality(50)).imageTag(\"kitten_fighting\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"kitten_fighting\", :flags=>\"lossy\", :quality=>50)","codeSnippet":"cl_image_tag(\"kitten_fighting\", :flags=>\"lossy\", :quality=>50)","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Flags(\"lossy\").Quality(50)).BuildImageTag(\"kitten_fighting\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Flags(\"lossy\").Quality(50)).BuildImageTag(\"kitten_fighting\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation()\n\t.delivery(Delivery.format(\n\tFormat.gif())\n\t.lossy()\n\t)\n\t.delivery(Delivery.quality(50)));","codeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation()\n\t.delivery(Delivery.format(\n\tFormat.gif())\n\t.lossy()\n\t)\n\t.delivery(Delivery.quality(50)));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setFlags(\"lossy\").setQuality(50)).generate(\"kitten_fighting\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setFlags(\"lossy\").setQuality(50)).generate(\"kitten_fighting\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().flags(\"lossy\").quality(50)).generate(\"kitten_fighting\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation().flags(\"lossy\").quality(50)).generate(\"kitten_fighting\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation()\n\t.delivery(Delivery.format(\n\tFormat.gif())\n\t.lossy()\n\t)\n\t.delivery(Delivery.quality(50)));","codeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation()\n\t.delivery(Delivery.format(\n\tFormat.gif())\n\t.lossy()\n\t)\n\t.delivery(Delivery.quality(50)));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"kitten_fighting.gif\")\n\t delivery(Delivery.format(\n\tFormat.gif()) {\n\t lossy()\n\t })\n\t delivery(Delivery.quality(50)) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"kitten_fighting.gif\")\n\t delivery(Delivery.format(\n\tFormat.gif()) {\n\t lossy()\n\t })\n\t delivery(Delivery.quality(50)) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"kitten_fighting\", {flags: \"lossy\", quality: 50})","codeSnippet":"$.cloudinary.image(\"kitten_fighting\", {flags: \"lossy\", quality: 50})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.agrosoland.com\/demo\/image\/upload\/fl_lossy,q_50\/kitten_fighting.gif","cloud_name":"demo","host":"res.www.agrosoland.com","type":"upload","resource_type":"image","transformation":[{"flags":"lossy","quality":"50"}],"transformation_string":"fl_lossy,q_50","url_suffix":"","version":"","secure":true,"public_id":"kitten_fighting.gif","extension":"gif","format":"gif","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例 50%质量损耗动画GIF

币游国际真人娱乐云化应用损耗压缩平台上富集图像优化和变换能力匹配图形设计、维度、设备、浏览器、响应布局等失压缩还可以优化生成图像而不是优化原创大动画GIF, 你可以优化变换或裁剪版显示

例举这些步骤生成并交付校准版小猫GIF

  1. 裁剪GIF宽度50%高80%
  2. 添加上传PNG图像命名云型icon仿作叠加调整叠加宽度为40像素,定位5像素自动画GIF右上角并增加40%半透明性
  3. 应用损耗压缩值50%

万事通优化GIF尺寸765KB60%比原创大小1.9MB <\/Image>","codeSnippet":" \n\t \n\t \n\t \n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .resize(crop().width(0.5).height(0.8))\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation().resize(scale().width(40)).adjust(opacity(40))\n )\n ).position(\n new Position()\n .gravity(compass(\"north_east\"))\n .offsetX(5)\n .offsetY(5)\n )\n )\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .resize(crop().width(0.5).height(0.8))\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation().resize(scale().width(40)).adjust(opacity(40))\n )\n ).position(\n new Position()\n .gravity(compass(\"north_east\"))\n .offsetX(5)\n .offsetY(5)\n )\n )\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n\t \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .resize(crop().width(0.5).height(0.8))\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation().resize(scale().width(40)).adjust(opacity(40))\n )\n ).position(\n new Position()\n .gravity(compass(\"north_east\"))\n .offsetX(5)\n .offsetY(5)\n )\n )\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .resize(crop().width(0.5).height(0.8))\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation().resize(scale().width(40)).adjust(opacity(40))\n )\n ).position(\n new Position()\n .gravity(compass(\"north_east\"))\n .offsetX(5)\n .offsetY(5)\n )\n )\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-transformation> <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .resize(crop().width(0.5).height(0.8))\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation().resize(scale().width(40)).adjust(opacity(40))\n )\n ).position(\n new Position()\n .gravity(compass(\"north_east\"))\n .offsetX(5)\n .offsetY(5)\n )\n )\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .resize(crop().width(0.5).height(0.8))\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation().resize(scale().width(40)).adjust(opacity(40))\n )\n ).position(\n new Position()\n .gravity(compass(\"north_east\"))\n .offsetX(5)\n .offsetY(5)\n )\n )\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('kitten_fighting', {transformation: [ {width: \"0.5\", height: \"0.8\", crop: \"crop\"}, {overlay: new cloudinary.Layer().publicId(\"cloudinary_icon\"), width: 40, gravity: \"north_east\", opacity: 40, x: 5, y: 5, crop: \"scale\"}, {flags: \"lossy\", quality: 50} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('kitten_fighting', {transformation: [\n {width: \"0.5\", height: \"0.8\", crop: \"crop\"},\n {overlay: new cloudinary.Layer().publicId(\"cloudinary_icon\"), width: 40, gravity: \"north_east\", opacity: 40, x: 5, y: 5, crop: \"scale\"},\n {flags: \"lossy\", quality: 50}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"kitten_fighting\").image(transformation=[ {'width': \"0.5\", 'height': \"0.8\", 'crop': \"crop\"}, {'overlay': \"cloudinary_icon\", 'width': 40, 'gravity': \"north_east\", 'opacity': 40, 'x': 5, 'y': 5, 'crop': \"scale\"}, {'flags': \"lossy\", 'quality': 50} ])","codeSnippet":"CloudinaryImage(\"kitten_fighting\").image(transformation=[\n {'width': \"0.5\", 'height': \"0.8\", 'crop': \"crop\"},\n {'overlay': \"cloudinary_icon\", 'width': 40, 'gravity': \"north_east\", 'opacity': 40, 'x': 5, 'y': 5, 'crop': \"scale\"},\n {'flags': \"lossy\", 'quality': 50}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('kitten_fighting.gif'))\n\t->resize(Resize::crop()->width(0.5)\n->height(0.8))\n\t->overlay(Overlay::source(\n\tSource::image(\"cloudinary_icon\")\n\t->transformation((new Transformation())\n\t->resize(Resize::scale()->width(40))\n\t->adjust(Adjust::opacity(40)))\n\t)\n\t->position((new Position())\n\t->gravity(\n\tGravity::compass(\n\tCompass::northEast()))\n->offsetX(5)\n->offsetY(5))\n\t)\n\t->delivery(Delivery::format(\n\tFormat::gif())\n\t->lossy()\n\t)\n\t->delivery(Delivery::quality(50));","codeSnippet":"(new ImageTag('kitten_fighting.gif'))\n\t->resize(Resize::crop()->width(0.5)\n->height(0.8))\n\t->overlay(Overlay::source(\n\tSource::image(\"cloudinary_icon\")\n\t->transformation((new Transformation())\n\t->resize(Resize::scale()->width(40))\n\t->adjust(Adjust::opacity(40)))\n\t)\n\t->position((new Position())\n\t->gravity(\n\tGravity::compass(\n\tCompass::northEast()))\n->offsetX(5)\n->offsetY(5))\n\t)\n\t->delivery(Delivery::format(\n\tFormat::gif())\n\t->lossy()\n\t)\n\t->delivery(Delivery::quality(50));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"kitten_fighting\", array(\"transformation\"=>array( array(\"width\"=>\"0.5\", \"height\"=>\"0.8\", \"crop\"=>\"crop\"), array(\"overlay\"=>\"cloudinary_icon\", \"width\"=>40, \"gravity\"=>\"north_east\", \"opacity\"=>40, \"x\"=>5, \"y\"=>5, \"crop\"=>\"scale\"), array(\"flags\"=>\"lossy\", \"quality\"=>50) )))","codeSnippet":"cl_image_tag(\"kitten_fighting\", array(\"transformation\"=>array(\n array(\"width\"=>\"0.5\", \"height\"=>\"0.8\", \"crop\"=>\"crop\"),\n array(\"overlay\"=>\"cloudinary_icon\", \"width\"=>40, \"gravity\"=>\"north_east\", \"opacity\"=>40, \"x\"=>5, \"y\"=>5, \"crop\"=>\"scale\"),\n array(\"flags\"=>\"lossy\", \"quality\"=>50)\n )))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().width(0.5).height(0.8).crop(\"crop\").chain() .overlay(new Layer().publicId(\"cloudinary_icon\")).width(40).gravity(\"north_east\").opacity(40).x(5).y(5).crop(\"scale\").chain() .flags(\"lossy\").quality(50)).imageTag(\"kitten_fighting\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .width(0.5).height(0.8).crop(\"crop\").chain()\n .overlay(new Layer().publicId(\"cloudinary_icon\")).width(40).gravity(\"north_east\").opacity(40).x(5).y(5).crop(\"scale\").chain()\n .flags(\"lossy\").quality(50)).imageTag(\"kitten_fighting\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"kitten_fighting\", :transformation=>[ {:width=>0.5, :height=>0.8, :crop=>\"crop\"}, {:overlay=>\"cloudinary_icon\", :width=>40, :gravity=>\"north_east\", :opacity=>40, :x=>5, :y=>5, :crop=>\"scale\"}, {:flags=>\"lossy\", :quality=>50} ])","codeSnippet":"cl_image_tag(\"kitten_fighting\", :transformation=>[\n {:width=>0.5, :height=>0.8, :crop=>\"crop\"},\n {:overlay=>\"cloudinary_icon\", :width=>40, :gravity=>\"north_east\", :opacity=>40, :x=>5, :y=>5, :crop=>\"scale\"},\n {:flags=>\"lossy\", :quality=>50}\n ])","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Width(0.5).Height(0.8).Crop(\"crop\").Chain() .Overlay(new Layer().PublicId(\"cloudinary_icon\")).Width(40).Gravity(\"north_east\").Opacity(40).X(5).Y(5).Crop(\"scale\").Chain() .Flags(\"lossy\").Quality(50)).BuildImageTag(\"kitten_fighting\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Width(0.5).Height(0.8).Crop(\"crop\").Chain()\n .Overlay(new Layer().PublicId(\"cloudinary_icon\")).Width(40).Gravity(\"north_east\").Opacity(40).X(5).Y(5).Crop(\"scale\").Chain()\n .Flags(\"lossy\").Quality(50)).BuildImageTag(\"kitten_fighting\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation()\n\t.resize(Resize.crop().width(0.5)\n.height(0.8))\n\t.overlay(Overlay.source(\n\tSource.image(\"cloudinary_icon\")\n\t.transformation(new Transformation()\n\t.resize(Resize.scale().width(40))\n\t.adjust(Adjust.opacity(40)))\n\t)\n\t.position(Position()\n\t.gravity(\n\tGravity.compass(\n\tCompass.northEast()))\n.offsetX(5)\n.offsetY(5))\n\t)\n\t.delivery(Delivery.format(\n\tFormat.gif())\n\t.lossy()\n\t)\n\t.delivery(Delivery.quality(50)));","codeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation()\n\t.resize(Resize.crop().width(0.5)\n.height(0.8))\n\t.overlay(Overlay.source(\n\tSource.image(\"cloudinary_icon\")\n\t.transformation(new Transformation()\n\t.resize(Resize.scale().width(40))\n\t.adjust(Adjust.opacity(40)))\n\t)\n\t.position(Position()\n\t.gravity(\n\tGravity.compass(\n\tCompass.northEast()))\n.offsetX(5)\n.offsetY(5))\n\t)\n\t.delivery(Delivery.format(\n\tFormat.gif())\n\t.lossy()\n\t)\n\t.delivery(Delivery.quality(50)));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setWidth(0.5).setHeight(0.8).setCrop(\"crop\").chain() .setOverlay(\"cloudinary_icon\").setWidth(40).setGravity(\"north_east\").setOpacity(40).setX(5).setY(5).setCrop(\"scale\").chain() .setFlags(\"lossy\").setQuality(50)).generate(\"kitten_fighting\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .setWidth(0.5).setHeight(0.8).setCrop(\"crop\").chain()\n .setOverlay(\"cloudinary_icon\").setWidth(40).setGravity(\"north_east\").setOpacity(40).setX(5).setY(5).setCrop(\"scale\").chain()\n .setFlags(\"lossy\").setQuality(50)).generate(\"kitten_fighting\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().width(0.5).height(0.8).crop(\"crop\").chain() .overlay(new Layer().publicId(\"cloudinary_icon\")).width(40).gravity(\"north_east\").opacity(40).x(5).y(5).crop(\"scale\").chain() .flags(\"lossy\").quality(50)).generate(\"kitten_fighting\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .width(0.5).height(0.8).crop(\"crop\").chain()\n .overlay(new Layer().publicId(\"cloudinary_icon\")).width(40).gravity(\"north_east\").opacity(40).x(5).y(5).crop(\"scale\").chain()\n .flags(\"lossy\").quality(50)).generate(\"kitten_fighting\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation()\n\t.resize(Resize.crop().width(0.5)\n.height(0.8))\n\t.overlay(Overlay.source(\n\tSource.image(\"cloudinary_icon\")\n\t.transformation(new Transformation()\n\t.resize(Resize.scale().width(40))\n\t.adjust(Adjust.opacity(40)))\n\t)\n\t.position(Position()\n\t.gravity(\n\tGravity.compass(\n\tCompass.northEast()))\n.offsetX(5)\n.offsetY(5))\n\t)\n\t.delivery(Delivery.format(\n\tFormat.gif())\n\t.lossy()\n\t)\n\t.delivery(Delivery.quality(50)));","codeSnippet":"cloudinary.image('kitten_fighting.gif').transformation(Transformation()\n\t.resize(Resize.crop().width(0.5)\n.height(0.8))\n\t.overlay(Overlay.source(\n\tSource.image(\"cloudinary_icon\")\n\t.transformation(new Transformation()\n\t.resize(Resize.scale().width(40))\n\t.adjust(Adjust.opacity(40)))\n\t)\n\t.position(Position()\n\t.gravity(\n\tGravity.compass(\n\tCompass.northEast()))\n.offsetX(5)\n.offsetY(5))\n\t)\n\t.delivery(Delivery.format(\n\tFormat.gif())\n\t.lossy()\n\t)\n\t.delivery(Delivery.quality(50)));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"kitten_fighting.gif\")\n\t resize(Resize.crop() { width(0.5F)\n height(0.8F) })\n\t overlay(Overlay.source(\n\tSource.image(\"cloudinary_icon\") {\n\t transformation(Transformation {\n\t resize(Resize.scale() { width(40) })\n\t adjust(Adjust.opacity(40)) })\n\t }) {\n\t position(Position() {\n\t gravity(\n\tGravity.compass(\n\tCompass.northEast()))\n offsetX(5)\n offsetY(5) })\n\t })\n\t delivery(Delivery.format(\n\tFormat.gif()) {\n\t lossy()\n\t })\n\t delivery(Delivery.quality(50)) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"kitten_fighting.gif\")\n\t resize(Resize.crop() { width(0.5F)\n height(0.8F) })\n\t overlay(Overlay.source(\n\tSource.image(\"cloudinary_icon\") {\n\t transformation(Transformation {\n\t resize(Resize.scale() { width(40) })\n\t adjust(Adjust.opacity(40)) })\n\t }) {\n\t position(Position() {\n\t gravity(\n\tGravity.compass(\n\tCompass.northEast()))\n offsetX(5)\n offsetY(5) })\n\t })\n\t delivery(Delivery.format(\n\tFormat.gif()) {\n\t lossy()\n\t })\n\t delivery(Delivery.quality(50)) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"kitten_fighting\", {transformation: [ {width: \"0.5\", height: \"0.8\", crop: \"crop\"}, {overlay: new cloudinary.Layer().publicId(\"cloudinary_icon\"), width: 40, gravity: \"north_east\", opacity: 40, x: 5, y: 5, crop: \"scale\"}, {flags: \"lossy\", quality: 50} ]})","codeSnippet":"$.cloudinary.image(\"kitten_fighting\", {transformation: [\n {width: \"0.5\", height: \"0.8\", crop: \"crop\"},\n {overlay: new cloudinary.Layer().publicId(\"cloudinary_icon\"), width: 40, gravity: \"north_east\", opacity: 40, x: 5, y: 5, crop: \"scale\"},\n {flags: \"lossy\", quality: 50}\n ]})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .resize(crop().width(0.5).height(0.8))\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation().resize(scale().width(40)).adjust(opacity(40))\n )\n ).position(\n new Position()\n .gravity(compass(\"north_east\"))\n .offsetX(5)\n .offsetY(5)\n )\n )\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","codeSnippet":"new CloudinaryImage(\"kitten_fighting.gif\")\n .resize(crop().width(0.5).height(0.8))\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation().resize(scale().width(40)).adjust(opacity(40))\n )\n ).position(\n new Position()\n .gravity(compass(\"north_east\"))\n .offsetX(5)\n .offsetY(5)\n )\n )\n .delivery(format(gif()).lossy())\n .delivery(quality(50));","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.agrosoland.com\/demo\/image\/upload\/c_crop,w_0.5,h_0.8\/l_cloudinary_icon,c_scale,w_40,g_north_east,o_40,x_5,y_5\/fl_lossy,q_50\/kitten_fighting.gif","cloud_name":"demo","host":"res.www.agrosoland.com","type":"upload","resource_type":"image","transformation":[{"crop_mode":"crop","width":"0.5","height":"0.8"},{"overlay":"cloudinary_icon","crop_mode":"scale","width":"40","gravity":"north_east","opacity":"40","x":"5","y":"5"},{"flags":"lossy","quality":"50"}],"transformation_string":"c_crop,w_0.5,h_0.8\/l_cloudinary_icon,c_scale,w_40,g_north_east,o_40,x_5,y_5\/fl_lossy,q_50","url_suffix":"","version":"","secure":true,"public_id":"kitten_fighting.gif","extension":"gif","format":"gif","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例 动画GIF重整规模,加叠加半损GIF压缩

概括地说,对动画GIF应用损压缩产生两大好处:显示这些活性GIF的灵活性和从小但可视图像节省带宽,更不用说增强用户经验搭建只需要最小努力, 释放你专注开发网站应用

记住这两个手法技巧

动画GIF系统失压缩可免费支付所有云式平面图试一试注册免费账号并起步前行估计会令你印象深刻

回顶

特征邮箱

Baidu
map