V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member  Sign In
• 请不要在回答技术问题时复制粘贴 AI 生成的内容
linncharm9
V2EX  ›  程序员

逆向了老牌音频可视化 Specterr 的前端,用 Next.js 重写实现了 100%还原+渲染后端并开源

  •  
  •   linncharm9 · 10h 2m ago · 361 views

    最近一直在用 Specterr 给音乐做可视化视频,但它要订阅收费,而且功能其实挺简单的——无非就是 waveform / spectrum 跑在一段背景视频上,加个 logo 导出。 后面发现他的代码没有关闭 source map 于是干脆逆向了它的前端源码,摸清楚数据结构和渲染逻辑之后,用 Next.js 从头重写了前端,然后自己实现了渲染后端。 项目叫 Spectral ,现在开源了: https://github.com/charmlinn/spectral 技术栈:

    前端:Next.js 16 + React 19 + PixiJS (实时预览) 渲染后端:Node.js + Headless Chromium + ffmpeg (帧渲染 + 编码) 队列:Redis + BullMQ 存储:Cloudflare R2 / MinIO 数据库:PostgreSQL + Prisma

    核心设计思路: 前端预览和后端导出共用同一套 PixiJS runtime 和同一份项目 schema ,保证预览和导出结果一致。 目前支持:waveform / spectrum 可视化、背景图片/视频、logo 、文字图层、浏览器实时预览、后端异步渲染队列。 本地用 Docker Compose 起全套环境,README 里有详细文档。 如果有人用 Specterr 或者类似工具的,欢迎试试,也欢迎提 issue 或者聊聊渲染这块的实现细节。

    No Comments Yet
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   1090 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 23:55 · PVG 07:55 · LAX 16:55 · JFK 19:55
    ♥ Do have faith in what you're doing.