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

2021-05-26 11:36:28 +08:00
 TomatoYuyuko

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

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

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

在公司,只要你喉咙足够响,桌子拍的足够响,webp 的体积就不会大。
hxsf
2021-05-26 14:58:48 +08:00
CDN + HTTP/2 push ?

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/779278

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX