Show HN:我做了一个自制的极简版网页端 Audacity
Show HN: I think I made my own web version of minimalistic audacity

原始链接: https://github.com/askpext/HERTZ

HERTZ 是一款“零服务器”架构的网页数字音频工作站(DAW),专为即时、高保真的语音润色而设计。通过利用 WebAssembly 和 Web Audio API,HERTZ 可在用户的浏览器中完全执行所有音频处理,从而消除了云端方案常见的延迟、成本及隐私风险。 该应用程序支持导入多种音频格式,允许进行非破坏性的、采样级精确的编辑。其核心引擎采用了一套优化的信号链(包括高通滤波、硬拐点压缩及峰值归一化),可为口语和播客提供广播级的音频质量。音频经处理后,会通过 FFmpeg.wasm 进行编码,并直接流式传输至用户的本地设备。 **关键技术要求:** * **安全性:** HERTZ 需要 `SharedArrayBuffer` 以实现多线程处理。因此,托管环境必须强制执行特定的安全标头(`Cross-Origin-Opener-Policy` 和 `Cross-Origin-Embedder-Policy`)。 * **兼容性:** 需要支持 WebAssembly 的现代浏览器。 * **部署:** 应用程序必须通过 Web 服务器(如 Vercel、Netlify)进行部署以满足标头要求;无法通过直接打开本地 HTML 文件运行。 HERTZ 专为高性能与隐私保护而构建,直接在浏览器线程中提供专业级的音频工作流。

```Hacker News最新 | 过往 | 评论 | 提问 | 展示 | 招聘 | 提交登录Show HN: 我想我做了一个极简版 Audacity 的网页版 (github.com/askpext)5 分,由 askadityapandey 发布于 1 小时前 | 隐藏 | 过往 | 收藏 | 2 条评论帮助 mikojan 8 分钟前 | 下一条 [–] 我也喜欢那种一键克隆音乐制作软件,用单次提交重写整个自述文件,然后在 6 个月后展示给 Hacker News 看的操作。回复 askadityapandey 1 小时前 | 上一条 [–] 我喜欢 Audacity,但大部分时间我都在重复同样的步骤来处理我的 YouTube 音频,所以我构建了自己的网页版,可以一键完成同样的操作,也支持裁剪等功能,直接在你的本地浏览器中运行。我打算以此开源项目为基础继续扩展,让更多的创作者能够使用它。回复 考虑申请 YC 2026 年秋季批次!申请截止日期为 7 月 27 日。 指南 | 常见问题 | 列表 | API | 安全 | 法律 | 申请 YC | 联系 搜索:```
相关文章

原文

High-fidelity client-side audio processing engine.

HERTZ is a web-based Digital Audio Workstation (DAW) utility designed for instant vocal polishing. It leverages the Web Audio API for real-time signal processing and FFmpeg.wasm for client-side encoding. Unlike traditional tools that rely on server-side processing (FFmpeg binaries on Linux), HERTZ runs entirely within the user's browser thread via WebAssembly.


image

The application is built on a "Zero-Server" architecture. The goal is to eliminate the latency, bandwidth costs, and privacy risks associated with uploading sensitive audio data to cloud storage.

  1. Ingestion: Decodes varied input formats (WAV, MP3, M4A, OGG) into a raw 32-bit floating-point AudioBuffer.
  2. Manipulation: Provides a non-destructive editing layer using Wavesurfer.js regions, allowing users to define sample-accurate start/end points.
  3. Digital Signal Processing (DSP):
    • Constructs an OfflineAudioContext for faster-than-realtime rendering.
    • Routes audio through a hardcoded vocal chain (EQ -> Compressor -> Limiter).
    • Analysis pass determines peak amplitude for accurate normalization.
  4. Encoding:
    • Transfers processed buffer to the ffmpeg.wasm virtual file system.
    • Executes LAME MP3 encoding at 192kbps VBR.
    • Streams the resulting Blob directly to the user's download manager.

Signal Chain Specification

HERTZ does not use generic presets. The audio engine implements a specific vocal chain optimized for spoken word and podcast clarity.

  • Cutoff: 80Hz
  • Q: 1.4
  • Purpose: Removes sub-bass rumble and DC offset artifacts often present in consumer microphones.

A hard-knee compressor designed to level vocal dynamic range without introducing pumping artifacts.

  • Threshold: -20.0 dB
  • Ratio: 3.1:1
  • Knee: 5.0 dB
  • Attack: 0.03s (30ms)
  • Release: 0.1s (100ms)

Post-compression gain staging ensures compliance with broadcast loudness standards.

  • Target: -3.0 dB Peak
  • Method: Linear gain calculation based on absolute max amplitude scanning.

Technical Constraints & Browser Security

HERTZ relies on SharedArrayBuffer to facilitate multi-threaded processing in FFmpeg.wasm. Modern browsers restrict this feature behind strict security headers to prevent Spectre/Meltdown vulnerabilities.

To run HERTZ locally or in production, the host must serve the following headers:

Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp

If these headers are missing, ffmpeg.wasm will fail to initialize, and the application will throw a buffer allocation error. The included vite.config.ts handles this for local development.


Installation & Development

  • Node.js 18.x or higher
  • NPM or Bun package manager
  • A modern browser with WebAssembly support (Chrome 90+, Firefox 90+, Safari 15+)
# Clone the repository
git clone [https://github.com/askpext/hertz.git](https://github.com/askpext/hertz.git)

# Enter directory
cd hertz

# Install dependencies
npm install

The application will launch at http://localhost:5173.

This generates a static asset bundle in /dist. Note that you cannot simply open index.html locally; it must be served via a web server that supports the required COOP/COEP headers (e.g., Vercel, Netlify, or GitHub Pages).


联系我们 contact @ memedata.com