sublimetext 首页动画制作原理

[gkiwi]

刚刚看canvas相关,结果了解到这个:
http://www.zhihu.com/question/20449279
大概意思就是找图这些帧图片间的不同,然后切割出来拼出一张新的图片,在html通过js反向解析渲染.
思路极佳,棒极了!

英文介绍文章:http://www.sublimetext.com/~jps/animated_gifs_the_hard_way.html
对应lib库:https://github.com/sublimehq/anim_encoder

跑了下例子,13张70kb的图,拼接后大概有131KB的大小,还是蛮划算的!
同时作者提供了一个抓图的功能,全套就齐备了:)

[Septembers]

抓图可用屏录软件录制下来，然后再利用ffmpeg导出成png序列

[NemoAlex]

这是3年前的事情啦
现在其实不用管那些老浏览器，直接用 Video 就好啦

[gkiwi]

@Septembers
库里自带啦:)

@NemoAlex
嗯嗯.其实这个还有个好处就是文件小(不确定video压缩起来会咋样),不过现在的带宽都还不错,这个影响都不算不太大了:)

[Septembers]

@gkiwi
刚刚测了下用ScriptPNG对最终的example_packed.png可压缩到32KiB
整体发布的整体大小在40KiB以内

[gkiwi]

@Septembers

http://css-ig.net/scriptpng 这个么?暂时打不开.
不过看到其他资料了,学习了:)

@NemoAlex 也来瞅瞅这个:)

[Septembers]

@gkiwi 恩 我是使用的"[8] PNG8+A"选项

[eeeeeeve]

@NemoAlex 现在没有必要用那种方法了么？