V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
garywill
V2EX  ›  前端开发

做个可以图片/视频不同质量文件(格式、码率不同)side by side 对比的东西

  •  
  •   garywill ·
    garywill · 2023-05-15 11:46:19 +08:00 · 743 次点击
    这是一个创建于 558 天前的主题,其中的信息可能已经有所发展或是发生改变。

    见过一些批量压缩 /转换格式的软件,但它们没有一个好的 side by side 对比前后功能

    有 squoosh 这样的 side by side 比较的的,但又不能批量压缩转换

    于是就想做个结合各种优点的:

    1. side by side 比较。此外,分界线自动地左右摆动
    2. 在上条的基础上,不限于 2 个文件的比较,可以同时比较多张
    3. 不限于图片,还可以比较视频、音频
    4. 批量压缩 /转换格式(以后再实现)

    初步已用 web ui 做了个比较的功能(打算以后 electron )

    演示网址 https://garywill.github.io/ivacomp/

    演示视频 https://youtu.be/H9yqASKA67Y

    仓库地址 https://github.com/garywill/ivacomp

    遇到些小疑问:

    1. chrome 的<video>不支持image-rendering: pixelated;
    2. 因上条,以后打包成像 electron 这样的 app ,有使用 firefox 渲染而不是 chromium 的吗?
    3. 第一次用 webpack ,用法可能不太规范,若有大神愿意看代码,欢迎吐槽一下
    2 条回复    2023-05-19 13:47:09 +08:00
    garywill
        1
    garywill  
    OP
       2023-05-15 11:48:28 +08:00
    对了,还有一点,两个<video>同时播放,放久了会不同步。。有没有人有经验?

    squoosh 用的是<canvas>来做图片 side by side 的比较,而我这里就比较粗暴,直接把<img>或<video>叠放,改变宽度来 side by side
    lran9527
        2
    lran9527  
       2023-05-19 13:47:09 +08:00
    感觉一般 压缩比例 80% 左右,就是在 图片失真和图片资源大小的 一个平衡点了,没必要在一张长的看是否失真和能不能再压缩了。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2682 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 04:16 · PVG 12:16 · LAX 20:16 · JFK 23:16
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.