声音
文章摘要
这是波兰工程师 Bartosz Ciechanowski 2022 年 10 月发表的交互式长文，这周又被人翻出来送上了 HN 首页（标题标注了 2022）。和他写机械表、GPS、相机镜头的那几篇一样，全文嵌了几十个可以拖动、点击、发声的 WebGL 演示，从空气分子讲起，一路讲到傅里叶变换、弦的谐波、分贝、多普勒效应和混响。页面上还有一个小键盘，可以用鼠标点，也可以按电脑上的 W、E、R 三个键，边读边听。
空气与压强。 文章先把一小立方体空气放大到分子尺度。常温下空气分子的平均速度大约 460 米/秒，所以演示都放慢了很多倍。分子不停互相碰撞，也撞在容器壁上，撞击力的总和除以面积就是压强：分子越多、越重、跑得越快，压强越大。把盒子压小，单位面积的碰撞次数上升，压强随之升高。作者接着把视角放大到 1 微米见方（里面有两千六百多万个分子），只追踪一个分子，说明它虽然跑得飞快，却因为不停碰撞而基本留在原地附近。这就是香水喷出后要过一会儿才能闻到的原因，也说明在声音关心的短时间尺度上，每一小团空气里基本还是同一批分子。
压力波就是声音。 在一根管子里用圆板推空气，把空气切成一片片来看：每片空气只是前后小幅挪动，但”被压缩”这个扰动会一片传一片地向外跑，而且不管板往哪边动，扰动都远离板传播。板往前推形成高压区（红色），往后退形成稀疏区（蓝色）。这种压强的起伏传到耳朵，就是我们听到的声音，这块板也就成了一个最原始的扬声器。
发声：从”啪”到音符。 让板突然跳一下，会发出”啪”的一声；向前跳还是向后跳听起来一样，跳得越远越响。让设备以固定频率反复跳，频率低时听起来是一串啪啪声，频率高了就融合成一个音，频率越高音调越高。多个键同时按下，板的最终运动就是各个键要求的位移之和，而发出的声音只取决于板的最终运动：作者专门让第三个键直接播放前两个键叠加后的波形，听起来一模一样。接着他引入三角波，讲振幅、频率和相位三个参数，并演示相位相差半个周期的两个同频波会完全抵消，板一动不动，没有声音，这就是相消干涉。最后读者可以自己画任意波形来播放：形状不同但音调相近，差别体现在”音色”上，这也是我们能分辨不同乐器演奏同一个音的原因。
纯音与傅里叶。 正弦波可以看成一个匀速旋转的圆上某点的高度，振幅、频率、相位分别对应半径、转速和初始角度。一个扫频演示让读者体会人耳只能听到有限频段，而且不同频率的响度感受差别很大。两个频率接近的音同时响起会出现忽大忽小的”拍音”，坐飞机时两台发动机转速不完全同步就能听到。反过来，任意周期波形都可以拆成一组正弦波之和，这就是傅里叶级数和傅里叶变换；文中的分解器用 64 个正弦波去逼近读者画的形状。由于人耳几乎感觉不到相位，通常只看各频率的振幅就够了。方波分解时会在跳变处出现振铃，也就是吉布斯现象；而每秒跳一次的方波之所以听得见，是因为它包含大量我们听得到的高频成分。作者还放了一个调用麦克风的实时频谱图，鼓励读者吹口哨或唱”啊”，观察基频和它的倍频。
质量、弹簧与弦。 为了解释这些倍频从哪来，文章从一个挂在两根弹簧之间的小质量块开始，再加到两个、五个质量块，说明任何复杂振动都能分解成若干”简正模式”的叠加。质量块多到极限，就成了一根弦。两端固定的弦只允许特定的驻波形态，最低的叫基频，其余模式的频率都是基频的整数倍，即谐波。读者可以在页面上拨弦，拨的位置不同，谐波比例不同，音色就不同。弦的基频取决于长度、线密度和张力：越短、越细、越紧，音越高，所以小提琴比低音提琴高，按弦能改音高，拧弦轴能调音。弦本身推不动多少空气，要靠琴身放大；鼓膜是二维的振动网格，钟、锣、镲则是固体晶格的三维振动，长笛、管风琴靠管内空气柱，人声靠声带一开一合送出的气流。
压力波的传播。 最后一部分讲声音如何离开声源、在环境中传播。脉动的球体在高频时像管中的板一样，膨胀时产生高压；低频时由于空气的惯性，膨胀结束后反而出现低压。带大挡板的圆形振膜则有方向性，频率越高声波越集中在正前方，所以扬声器的低音比高音扩散得更开。作者提醒，图里的红蓝色块很夸张：声速约 343 米/秒，正常说话时的压强变化只有约 0.02 帕，约为大气压的千万分之二，耳朵能分辨这么小的差别相当惊人。之后依次演示了：离声源越远声音到达越晚；球面波的声压与距离成反比，距离加倍声压减半；用以 20 微帕为参考的对数刻度定义声压级（分贝），距离每加倍下降 6 dB，两个音箱只比一个多 6 dB；声强遵循平方反比律；声源运动时的多普勒效应，以及超过声速时的音爆；两个音箱同时发声时空间里会出现”死点”；以及遇到墙面的回声（延迟小于约 50 毫秒时人耳分不出两次声音），和封闭房间里的混响。
文末推荐了两本书：入门但全面的《The Science of Sound》，以及可以在作者网站免费读的 Steven W. Smith《The Scientist and Engineer’s Guide to Digital Signal Processing》。结尾一句很有他的风格：最刺耳的噪音和最动人的音乐，背后是同一种现象，不同的只是压力波的形状和大小。
HN 评论精华
这次重发的帖子拿到 269 分，但只有三十来条评论，dang 照例贴出了 2022 年首发时的讨论链接（3053 分、206 条评论）。新帖的讨论有一个 2022 年没有的主题：在 AI 能批量生成交互式可视化的今天，这种手工作品还意味着什么。
手工的分量。 Cider9986 说最近博客里这类可视化多了很多，但质量都比不上这个网站。disillusioned 强调这些全是手写的原生 JavaScript，”绝对是个手艺人”；bayindirh 说他是手写 WebGL 代码在”打造”作品，不是为了网络积分在”生产”内容。f311a 猜作者已经因为作品不像以前那样受重视而不再更新；Cider9986 反驳说他在 Patreon 上仍有 541 位付费支持者，最新一篇是 2024 年的，那时 AI 还做不出这种东西，现在做得也不如他。
AI 可视化是好是坏。 matsemann 的担心比较有代表性：更多人能轻松做出这类东西当然好，但粗制滥造、带着误解的版本可能先火起来，抢走了”氧气”，让本来想认真做的人失去动力。ndriscoll 不同意，他举了瑞利散射的例子：给五岁女儿解释”天为什么是蓝的”时，他发现现有讲解都很糟，于是让 Codex 做了一个动画，先回答”天为什么不是黑的”，再讲光在空气中反弹、蓝光反弹得更多。他认为如果你清楚自己想表达什么，AI 反而降低了做出更好讲解的门槛。miki123211 指出一个容易被忽视的点：AI 生成的可视化常常（不总是）带有完整的键盘和 ARIA 支持，屏幕阅读器可用，而 Ciechanowski 的作品在无障碍上基本没做，”哪怕是 vibe coding 出来的无障碍，也比没有强”。vincnetas 开玩笑说，有了图灵测试，现在需要一个”Bartosz 测试”：给 AI 一个概念，看它能不能讲成这样。jlhawn 说他正是照着这个博客的格式，借助前沿模型把自己 2022 年卡住的浏览器气候模型做完，并写了一个十部分的讲解系列。
读者反馈。 SwtCyber 最佩服的是递进节奏：从空气分子乱撞开始，不知不觉就理解了谐波和干涉。isolli 说他 10 岁的儿子在那些小部件上点了一个小时，学到不少。bita_nidir 说小时候学乐器时满脑子问题，老师只会说”因为这是三度、这是五度”，要是能穿越回去，他会把这页拍在老师面前。natty 说读他的文章就像小时候读杂志上的好科普，而且因为他早在 AI 之前就这样写了，让人更放心内容是经过核实的。janOla 补充推荐了斯坦福 Julius O. Smith 的《Physical Audio Signal Processing》，讲得更深。
2022 年首发讨论的几个亮点。 当年那个帖子几乎是一边倒的赞美，PostOnce 说这个人该拿”天才奖”，一篇的直觉收获胜过教科书三个月。几条有信息量的补充：jcims 提到常压下空气分子的平均自由程只有约 65 纳米，每立方厘米约 2×10^19 个分子；Erwin 惊讶于空气压强相当于每平方米 10 吨，zeroonetwothree 补充说潜到 10 米深外压就翻倍，人也能承受；Waterluvian 警告长时间满音量播放正弦波可能烧坏笔记本扬声器；srcreigh 和 xani__ 讲解了音箱倒相孔的原理，它是一段空气质量在振动，相当于第二块”板”；有读者用文中扫频滑块发现自己左右耳在某些频段有听力损失，也有人提醒听不到的次声和超声同样可能损伤听力，别乱调音量。WhitneyLand 摘出 Smith 书里的一段历史：傅里叶关于”任何连续周期信号都能表示为正弦波之和”的论文，因为拉格朗日反对，拖了十几年才发表。