我们刚刚描述的算法无法 " 向前看 " 音频时间线。它只看当前响度，即我们已经发送到音频输出设备的样本。

但向前看（也称为 " 前边距 "）很重要，因为，例如，在语音中有一些可以用来开始一个词的声音并不很响。但仅仅因为这一点就跳过这些声音是不好的。语音的可理解性会降低。例如，" throb " 会变成 " rob "。

这里就是 " 拉伸 " 的部分。它关乎于我们如何能够 " 预见 " 并在响亮的部分之前稍微减慢。基本上，它涉及在输出音频之前略微（约200毫秒） 延迟 音频（这是有目的的！）。

想象一下我们当前播放的是一个静音部分，因此播放速度更快。现在，当我们遇到响亮的部分时，我们就会 " 啊哈！那可能是一个单词，并且可能以'th'开头 " 。

如上所述，我们总是在输出音频之前将其延迟（缓冲）约200毫秒。因此我们知道，这200毫秒的缓冲音频中一定包含了那个 " th " 声音，而我们希望用户能听到那个 " th " 声音。但请记住：在我们录制所说的声音时，视频播放速度是 快速 的，但我们希望以正常速度播放那个 'th' 。因此我们不能直接将其输出。我们该怎么办呢？

我们所做的是将缓冲（延迟）的音频， 放慢（拉伸并改变音高），这样它就看起来像是以正常速度播放的！只有这样我们才将其传递给系统（然后系统将其传到你的扬声器）。

孩子们，这就是为什么我们称它为 " 拉伸算法 "。

想了解更多细节，你可以查看其源代码中的注释。

如果下面你看到的是一段文字而不是图表，请访问 这里 。

图
%%graph TD

    %% TODO 添加链接  https://mermaid.js.org/syntax/flowchart.html#interaction

    watchAllElements["watchAllElements"
        looks for media elements
        on the page"]
    点击 watchAllElements https://github.com/WofWca/jumpcutter/blob/890a2b25948f39f1553cb9afb06c4cc10c9d2a19/src/entry-points/content/watchAllElements.ts

    AllMediaElementsController["AllMediaElementsController"
        the orchestrator,"]
    点击 AllMediaElementsController https://github.com/WofWca/jumpcutter/blob/44fadb1982fbe7dd20c64741ae9e754ba9261042/src/entry-points/content/AllMediaElementsController.ts

    watchAllElements -- > |"onNewMediaElements(...元素)"| AllMediaElementsController
    AllMediaElementsController -- > |原始 HTMLMediaElement| chooseController{选择
        appropriate
        controller}
    chooseController --  >  |原始 HTMLMediaElement| ElementPlaybackControllerCloning  &  ElementPlaybackControllerStretching

    %% 元素播放控制器克隆

    %% Subgraph "ElementPlaybackControllerCloning"

    元素播放控制克隆["元素播放控制克隆"
        controls playbackRate
        of the original
        HTMLMediaElement"]
    点击 ElementPlaybackControllerCloning https://github.com/WofWca/jumpcutter/blob/3ff011318dc9af407eaf9f4cc8d33dfafaf0b53e/src/entry-points/content/ElementPlaybackControllerCloning/ElementPlaybackControllerCloning.ts

    前瞻["前瞻"]
        plays back the clone element
        to look for silence ranges"]
    点击 Lookahead " https://github.com/WofWca/jumpcutter/blob/988ec301bf2e6c07e6cc328f73a4177f7504f1e1/src/entry-points/content/ElementPlaybackControllerCloning/Lookahead.ts"

    ElementPlaybackControllerCloning -- >  | 原始 HTMLMediaElement 引用 | 前瞻
    前瞻 -- >  |静音范围| 元素播放控制器克隆

    createCloneElementWithSameSrc --> |HTMLMediaElement 克隆| 前瞻
    前瞻 --> |原始 HTMLMediaElement 引用| createCloneElementWithSameSrc 点击 createCloneElementWithSameSrc "https://github.com/WofWca/jumpcutter/blob/e9daff122f12263a50fb1c4a10e4b13c7fd190cf/src/entry-points/content/ElementPlaybackControllerCloning/createCloneElementWithSameSrc.ts"

    cloneMediaSources["`cloneMediaSources"
        intercepts all MediaSources
        and holds a clone
        HTMLMediaElement`"]
    点击 cloneMediaSources "https://github.com/WofWca/jumpcutter/blob/5bcfdaf53066c5ac4f664e089b916118afe37ae2/src/entry-points/content/cloneMediaSources/lib.ts"

    cloneMediaSources -->|HTMLMediaElement 克隆| 前瞻
    前瞻 -- > |getMediaSourceCloneElement| 克隆媒体源

    SilenceDetector1["SilenceDetector"]
        utilizes Web Audio API
        to detect silence"]
    点击 SilenceDetector1 "https://github.com/WofWca/jumpcutter/blob/e3283500aeefe994a8be5bb7fdd8f7308e895f4f/src/entry-points/content/SilenceDetector/SilenceDetectorProcessor.ts"
    前瞻 -- >  |克隆 HTMLMediaElement 音频| SilenceDetector1
    静音检测器1 -- >  |
        SILENCE_END &
        SILENCE_START events
        with timestamps
| 前瞻

    %% 结束

    %% 元素播放控制器拉伸

    %% 子图 "ElementPlaybackControllerStretching"

    ElementPlaybackControllerStretching["ElementPlaybackControllerStretching"]
        controls playbackRate
        of the original
        HTMLMediaElement"]
    点击 ElementPlaybackControllerStretching "https://github.com/WofWca/jumpcutter/blob/3ff011318dc9af407eaf9f4cc8d33dfafaf0b53e/src/entry-points/content/ElementPlaybackControllerStretching/ElementPlaybackControllerStretching.ts"

    SilenceDetector2["SilenceDetector"]
        utilizes Web Audio API
        to detect silence"]
    点击 SilenceDetector2 "https://github.com/WofWca/jumpcutter/blob/e3283500aeefe994a8be5bb7fdd8f7308e895f4f/src/entry-points/content/SilenceDetector/SilenceDetectorProcessor.ts"
    ElementPlaybackControllerStretching -- >  |原始 HTMLMediaElement 音频| SilenceDetector2
    静音检测器2 -- >  |
        SILENCE_END &
        SILENCE_START events
        with timestamps
| 元素播放控制器拉伸

    %% 结束

    %% 遥测

    %% 元素播放控制器克隆  &  元素播放控制器拉伸 -- >  |遥测| 所有媒体元素控制器

    弹出窗口["弹出窗口"]
        (UI, chart)"]
    点击弹出窗口 "https://github.com/WofWca/jumpcutter/blob/44fadb1982fbe7dd20c64741ae9e754ba9261042/src/entry-points/popup/App.svelte"
    AllMediaElementsController --> |telemetry| 弹出窗口

捐款很好，但它们告诉用户的是 " 我们并不真正想要钱，但如果你坚持，你可以捐一些 " ，甚至 " 没有人为这个产品付费，所以你将成为少数慷慨的人之一，如果你捐 $5，我只能用它买一杯咖啡，实际上不会激励我继续开发 " 。

很多人愿意付款。他们想真正购买产品，公平合理地完成交易，而不是开一个慈善机构，把钱扔进无底洞的 " 咖啡 " 中，并想着 " 我给得够吗？" 。

当然，我并不是说我不感激捐赠。它们对我意义重大，更加个人化。我只是想说明，就收入而言，它们的影响力没有那么大。