AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

GIF添加3D加速

2016-09-16 896
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 由于浏览器内核对Gif格式的图片会产生卡的情况，所以我们需要告诉浏览器，开启一下加速，方法很简单，就是利用css3的特性，强制告诉浏览器，这是个元素，需要3D转换，请务必开启加速效果方法1给gif开启3D独立层渲染，就是给图片一个0度角3D旋转，使动画图片只渲染最小区域，就是给gif添加样式transform: translate3d(0,0,0)，gif动画会引起全屏重新渲染，开启3d动画目的是让git动画独立渲染方法2如果gif没有高保真的图片你可以按桢导入ai，然后导成矢量，github上有一个叫svgo的东西好像可以优化svg动画差值。

由于浏览器内核对Gif格式的图片会产生卡的情况，所以我们需要告诉浏览器，开启一下加速，方法很简单，就是利用css3的特性，强制告诉浏览器，这是个元素，需要3D转换，请务必开启加速效果

方法1

给gif开启3D独立层渲染，就是给图片一个0度角3D旋转，使动画图片只渲染最小区域，就是给gif添加样式transform: translate3d(0,0,0)，gif动画会引起全屏重新渲染，开启3d动画目的是让git动画独立渲染

方法2

如果gif没有高保真的图片你可以按桢导入ai，然后导成矢量，github上有一个叫svgo的东西好像可以优化svg动画差值。好久没用过了，矢量导出svg格式

方法3

别用gif.用css动画或者canvas动画

文章标签：
前端开发
Web App开发
落雨_
目录
相关文章
小然然
|
编解码 弹性计算 Serverless
FGAP加速图片和视频转码
场景1：图片转码 移动互联网早已进入读图时代，目前的图片都是JPEG格式，尺寸太大，导致传输占用更多的网络带宽，花费更多的传输时间并占用更多的存储空间。JPEG图片转码为WebP/HEIF需要消耗大量的计算能力。使用阿里云FaaS加速图片转码解决方案将使客户TCO降低约40%。 场景2：视频转码 到2022年，82%的IP流量都将来自于视频的录制、上传和播放。HEVC/H.265无论从画质还是码率，都比H.264有明显的优势，但是将视频将H.264编码为H.265将消耗巨大的算力。使用阿里云FaaS加速视频转码将显著降低视频大小，节省网络流量，降低成本。
小然然
678 0
FGAP加速图片和视频转码
机智的程序员小熊
|
Web App开发 存储 SQL
你不知道的图片压缩格式 ".webp"
你不知道的图片压缩格式 ".webp"
机智的程序员小熊
489 0
你不知道的图片压缩格式 ".webp"
王同学睡醒了
DPG图片压缩技术和webp图片格式
DPG图片压缩技术和webp图片格式
王同学睡醒了
167 0
ValentineHP
|
计算机视觉 异构计算
图片处理之图片融合及GIF图片生成
笔记
ValentineHP
239 0
疯狂的猿
|
9月前
|
区块链
webp2jpg网页在线图片格式转换源码
webp2jpg-免费在线图片格式转化器, 可将jpeg、jpg、png、gif、 webp、svg、ico、bmp文件转化为jpeg、png、webp、webp动画、gif文件。 无需上传文件，本地即可完成转换!
疯狂的猿
110 0
可乐鸡翅kele
|
10月前
|
编解码 Rust 前端开发
纯前端也能实现在线GIF压缩
纯前端也能实现在线GIF压缩
可乐鸡翅kele
170 2
GameProgramer
|
Android开发
将video转成gif工具（免费）
将video转成gif工具（免费）
GameProgramer
200 0
我是小七
|
数据处理 对象存储
如何利用 OSS 转换 webp 文件为jpeg
如何利用 OSS 转换 webp 文件为jpeg,OSS 样式使用
我是小七
2028 1
游客njxd47hac6d2e
|
存储 算法 Android开发
聊一聊几种常用web图片格式：gif、jpg、png、webp
在大多数的web页面中，图片占到了页面大小的60%-70%。因此在web开发中，不同的场景使用合适的图片格式对web页面的性能和体验是很重要的。图片格式种类非常多，本文仅针对几种web应用中常用的图片格式：gif、png、jpg、webp进行一个基本的总结。
游客njxd47hac6d2e
1973 0
zengjf
免费Gif图片录制工具
/************************************************************************* * 免费Gif图片录制工具 * 说明： * 最近在github上放东西，但是发现仅仅放置图片是不够用的，要是能够放置 * 视频那就很好了，貌似markdown不支持，后来查资料发现可以采用gif图片，于是 * 就找到了这个工具来制作。
zengjf
767 0

热门文章

最新文章

  • 1
    信用算力基于 RocketMQ 实现金融级数据服务的实践
  • 2
    git 报错 RPC failed; curl 18 transfer closed with outstanding read data remaining
  • 3
    如何在chrome上开启WebGL功能和判断目前浏览器是否支持
  • 4
    阿里云全面支持IPv6！一文揽尽4位大咖精彩演讲
  • 5
    OAuth 及 移动端鉴权调研
  • 6
    YARN中的CPU资源隔离-CGroups
  • 7
    南理工计算机学院研究生课程的评价和反思（研一上）
  • 8
    我的实用设计模式 - Simple Factory和Reflection
  • 9
    再提一下Linux系统中的MD5校验
  • 10
    checkpoint性能测试
  • 1
    有偿创建 CosyVoice2-0.5B 大模型
    46
  • 2
    《深度揭秘：分布式技术如何赋能AI与鸿蒙系统集成的性能飞跃》
    30
  • 3
    《深度解析：人工智能与鸿蒙系统集成中的版本管理与迭代升级》
    37
  • 4
    《探索AI与鸿蒙融合的开源宝藏：这些框架你不能错过》
    26
  • 5
    《鸿蒙系统下AI模型训练加速：时间成本的深度剖析与优化策略》
    22
  • 6
    《深度剖析：鸿蒙系统下智能NPC与游戏剧情的深度融合》
    26
  • 7
    2025年国内工单系统推荐：技术架构、场景适配与行业实践
    29
  • 8
    JVM实战—2.JVM内存设置与对象分配流转
    28
  • 9
    2025年AI客服机器人推荐：核心能力与实际场景应用分析
    32
  • 10
    从第十批算法备案通过名单中分析算法的属地占比、行业及应用情况
    33

    • 相关电子书

    更多
  • 低代码开发师（初级）实战教程
  • 冬季实战营第三期：MySQL数据库进阶实战
  • 阿里巴巴DevOps 最佳实践手册
    • 下一篇
    获取百炼API-KEY