V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
TomatoYuyuko
V2EX  ›  问与答

除了雪碧图,加载大量图片素材还有什么好的方案?

  •  
  •   TomatoYuyuko · 2021-05-26 11:36:28 +08:00 · 1573 次点击
    这是一个创建于 1306 天前的主题,其中的信息可能已经有所发展或是发生改变。

    类似静态官网这种,有一些前端动画需要大量前端图片素材 暂定用 nuxt 写

    10 条回复    2021-05-26 14:58:48 +08:00
    liyer
        1
    liyer  
       2021-05-26 12:13:11 +08:00
    base64
    svg
    canvas
    Resource
        2
    Resource  
       2021-05-26 12:17:57 +08:00
    一般是 iconfont 和 svg,但是你这种情况,我认为雪碧图是最吼的。
    Mutoo
        3
    Mutoo  
       2021-05-26 12:38:12 +08:00
    用骨骼动画替代帧动画,可以节省大量素材空间。
    免费的 dragonbone http://dragonbones.com/en/index.html#.YK3QgZP7Q8M
    收费的 spine http://en.esotericsoftware.com/
    TomatoYuyuko
        4
    TomatoYuyuko  
    OP
       2021-05-26 13:41:10 +08:00
    @liyer canvas 对加载图片素材还有优化?
    liyer
        5
    liyer  
       2021-05-26 13:47:41 +08:00
    @TomatoYuyuko 你不是有动画吗?
    3dwelcome
        6
    3dwelcome  
       2021-05-26 13:59:51 +08:00
    WebP 支持动画的吧,可以考虑一下。

    然后用 JS 把需要的单帧提取出来,存在 window BOM 下。img src 直接去引用。
    TomatoYuyuko
        7
    TomatoYuyuko  
    OP
       2021-05-26 14:13:33 +08:00
    @liyer 只有切图,然后前端用这堆素材做一个动画。。。
    TomatoYuyuko
        8
    TomatoYuyuko  
    OP
       2021-05-26 14:16:06 +08:00
    @3dwelcome UI 那边的说法是 webp 体积会很大。。
    3dwelcome
        9
    3dwelcome  
       2021-05-26 14:20:52 +08:00   ❤️ 1
    @TomatoYuyuko UI 那是懒吧,地球人都知道 webp 比 jpg 还要小。

    在公司,只要你喉咙足够响,桌子拍的足够响,webp 的体积就不会大。
    hxsf
        10
    hxsf  
       2021-05-26 14:58:48 +08:00
    CDN + HTTP/2 push ?
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2924 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 13:24 · PVG 21:24 · LAX 05:24 · JFK 08:24
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.