Skip to content

Added an instantaneous bitrate plot to the Inspect tab - #16

Merged
CodyCBakerPhD merged 3 commits into
mainfrom
claude/instantaneous-bitrate-plot-nf6w2k
Aug 12, 2026
Merged

CodyCBakerPhD merged 3 commits into
mainfrom
claude/instantaneous-bitrate-plot-nf6w2k

Conversation

@CodyCBakerPhD

Copy link
Copy Markdown
Member

Adds a Video Bitrate Over Time card to the Inspect tab: the video track's rate plotted one window of playback at a time (roughly one per second, bounded to 12-240 windows so a short clip and a long recording both draw readably) as a step area chart against the track average. It is binned straight from the container's sample table, so no decoding is involved. Hovering a window gives its rate and frame count, and peak / quietest / peak ÷ average sit above the plot.

On "unless the metadata held it constant"

The obvious signal is a btrt box declaring the same number as both the track average and its maximum. That signal alone is wrong in practice: the bundled mice.mp4 declares btrt max = avg = 565109 yet actually ranges 327-741 kbps (peak/avg 1.31), because muxers commonly write the computed average into both fields whatever the encoder was doing. Gating on the declaration alone would have hidden the plot for most ffmpeg-produced files, including the sample video.

So the declaration gates the decision but has to be corroborated by the frame sizes before the plot is withheld. Where the two disagree, the card plots the measurement and adds a note saying why the declaration cannot be taken at face value.

Testing

  • 17 new unit tests (binning, the flatness predicate, per-track btrt extraction, and the full render decision in jsdom for all four cases); 135 pass in all
  • A new integration test asserting the sample video draws 30 hover bands and a peak above its average; 8 pass in all
  • Checked the card in both themes and with the hover layer active
  • pre-commit and npm run build clean

Version bumped to 0.2.9. package-lock.json's root version had been left behind at 0.2.7 and is synced here too.

🤖 Generated with Claude Code

https://claude.ai/code/session_01E8xqZHozn5aicsdnbBPo4z


Generated by Claude Code

The Inspect tab could only report what a track's bitrate averaged to,
which is the one thing a variable-bitrate encode is guaranteed not to be
doing at any given moment. Bin the video track's sample sizes by
presentation time into roughly one window per second and plot them as a
step area chart against the track average, so the card shows where the
bits actually went. The sample table already carries every frame's size
and timestamp, so nothing has to be decoded.

Suppress the plot for a file whose rate really was held constant, where
it would only ever draw a flat line. A btrt box declaring the same number
as both the track average and its maximum is not sufficient evidence on
its own: muxers routinely write the computed average into both fields
whatever the encoder was doing, and the bundled mice.mp4 is a CRF encode
that does exactly that. The frame sizes have to agree before the plot is
withheld, and where declaration and frames disagree the card plots the
measurement and explains why the declaration cannot be taken at face
value.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01E8xqZHozn5aicsdnbBPo4z
@chromatic-com

chromatic-com Bot commented Aug 12, 2026 •

Copy link
Copy Markdown

Tip

All tests passed and all changes approved!

🟢 UI Tests: encoding-helper-storybook: 7 tests unchanged
🟢 UI Review: encoding-helper-storybook: 7 stories published -- no changes
Storybook icon Storybook Publish: encoding-helper-storybook: 7 stories published

@chromatic-com

chromatic-com Bot commented Aug 12, 2026 •

Copy link
Copy Markdown

Tip

All tests passed and all changes approved!

🟢 UI Tests: encoding-helper-playwright: 1 change accepted as baseline
🟢 UI Review: encoding-helper-playwright: Approved by Cody Baker
Storybook icon Test suite publish: encoding-helper-playwright: 2 tests published

@github-actions

github-actions Bot commented Aug 12, 2026 •

Copy link
Copy Markdown
PR Preview Action v1.8.1

QR code for preview link

🚀 View preview at
https://brain-bbqs.github.io/encoding-helper/pr-preview/pr-16/

Built to branch gh-pages at 2026-08-12 19:46 UTC.
Preview will be ready when the GitHub Pages deployment is complete.

@CodyCBakerPhD CodyCBakerPhD self-assigned this Aug 12, 2026
@codecov-commenter

codecov-commenter commented Aug 12, 2026 •

Copy link
Copy Markdown

Codecov Report

❌ Patch coverage is 85.91549% with 20 lines in your changes missing coverage. Please review.

Files with missing lines Patch % Lines
src/ui/bitrateChart.ts 80.00% 6 Missing and 9 partials ⚠️
src/ui/inspectTab.ts 90.00% 2 Missing and 1 partial ⚠️
src/lib/bitrateTimeline.ts 96.29% 0 Missing and 1 partial ⚠️
src/ui/fileLoading.ts 0.00% 1 Missing ⚠️
Files with missing lines Coverage Δ
src/lib/mp4boxParser.ts 25.71% <100.00%> (+9.58%) ⬆️
src/lib/state.ts 92.30% <100.00%> (+92.30%) ⬆️
src/lib/bitrateTimeline.ts 96.29% <96.29%> (ø)
src/ui/fileLoading.ts 0.00% <0.00%> (ø)
src/ui/inspectTab.ts 21.67% <90.00%> (+21.67%) ⬆️
src/ui/bitrateChart.ts 80.00% <80.00%> (ø)

... and 1 file with indirect coverage changes

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

The Video Track card's Bitrate field and the new card's Average are the
same number measured the same way, so drop the former and carry its
explainer across to the latter. A file with too few frames to divide into
windows now keeps the average on the new card, with a note in place of
the plot, rather than losing the figure entirely. The Report tab still
lists the video track's bitrate, having no plot to carry it.

Also drop the caption under the plot: the axes, the direct label on the
average line, and the per-window tooltips already say what it said.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01E8xqZHozn5aicsdnbBPo4z
@CodyCBakerPhD
CodyCBakerPhD merged commit 54e1c6e into main Aug 12, 2026
16 checks passed
@CodyCBakerPhD
CodyCBakerPhD deleted the claude/instantaneous-bitrate-plot-nf6w2k branch August 12, 2026 19:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants