无需音频文件，为你的网站添加UI音效

一个让我纠结了半天的需求

之前给自己做的小工具网站加交互反馈，总觉得按钮点下去没啥感觉，想配点音效又嫌麻烦——找音效文件、处理版权、加载一堆 mp3 拖慢页面速度。后来看到 tiks 这个库，2KB 不到，一个音频文件都不用，全靠代码实时合成声音，试了一下发现还真挺好使的。

声音是算出来的不是播文件

tiks 的思路跟传统音效库完全不一样。别的库要加载 mp3、wav，它直接拿 Web Audio API 的振荡器和噪声缓冲来算声音。浏览器播完自动回收，没有下载、没有解码、没有缓存。内置十种即开即用的音效，从按钮点击的短促敲击、开关切换的音调升降、操作成功的悦耳铃铛，到鼠标悬停的轻响、页面切换的过渡声，日常交互场景基本都盖住了。

所有声音都统一在一个主题下，听着协调不会乱。默认 soft 主题温暖圆润，有点苹果那股子精致劲；切到 crisp 就变的锐利带感，像机械键盘的反馈。不满意还能用 defineTheme 自己调，基础频率、波形类型、滤波器参数都能改。

接入成本非常低

npm 装完 import 进来，第一次用户交互时调个 init，然后 click、success、toggle 随便调。React 有 useTiks hook，Vue 有 useTiks composable，各加 300 字节，自动初始化不用担心重渲染的性能问题。想极致瘦身的话按需引入，没用的音效不会打包。连 npm 都懒得装也行，CDN 直接引入一个 script 标签就完事了。默认音量只有30%，不会吓人一跳。

不过有些地方得注意

合成的声音毕竞不是真实录音，追求拟真音效的话这个库满足不了你，它更适合那种简洁的 UI 反馈声。浏览器自动播放策略限制比较严，必须在用户第一次交互之后才能 init，不然会被静默拦截。另外目前只有十种预设，复杂场景可能不够用，得自己拿 defineTheme 去搓。

下载链接：https://pan.quark.cn/s/e2380fdaf5a4