fix(docs): stop Live Telemetry charts from growing endlessly + pin CDN script versions - #451
Merged
cobusgreyling merged 2 commits intoAug 3, 2026
Conversation
…he showcase page Two independent reliability issues on the Dogfooding/Live Telemetry section of docs/index.html (the GitHub Pages showcase): 1. Both third-party scripts were unpinned (`mermaid@11` floats across every 11.x release, and the Chart.js <script> tag had no version at all) -- any upstream release of either library can change or break rendering on the live page with zero corresponding commit in this repo, making a "why is the site broken" report unreproducible from git history alone. Pinned both to the versions currently being served (mermaid 11.16.0, Chart.js 4.5.1) so the page only changes when this repo changes it. 2. renderTelemetry()'s cumulative-tokens calculation was a nested loop (O(n^2) over loop-run-log.md's entries) recomputing the full prefix sum from scratch for every point instead of carrying a running total. loop-run-log.md's own format section documents pruning entries older than 30 days, but nothing in daily-triage.yml actually does that -- the log only ever grows, so this cost compounds indefinitely. Replaced with an O(n) running total; verified identical output on a sample dataset. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
…ntainer Reproduced the user-reported "page keeps growing endlessly" bug with a headless-Chromium probe: canvas.height climbed continuously even with zero user interaction (2661px -> 8152px over 5s), and body.scrollHeight grew on every scroll. This is Chart.js's well-known responsive-resize feedback loop: `responsive: true` + `maintainAspectRatio: false` makes the canvas resize to fill its container, but the three telemetry `.card` divs had no explicit height -- their height was itself determined by the canvas inside them. Every resize of the canvas grew the container, which re-triggered Chart.js's ResizeObserver, which grew the canvas again, unbounded. Fixed by wrapping each canvas in a `position: relative; height: 240px` container, so the container's size no longer depends on the canvas it holds. Re-ran the same probe after the fix: canvas.height holds steady at 240 indefinitely, and repeated scrolling no longer changes scrollHeight. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Contributor
|
Thanks @KhaiTrang1995 for contributing a docs improvement — visible, reviewable PRs like this grow the reference for everyone. What happens next
More ways to help — loop-engineering maintainers |
cobusgreyling
approved these changes
Aug 3, 2026
cobusgreyling
left a comment
cobusgreyling
left a comment
Owner
There was a problem hiding this comment.
Solid root-cause fix for the Chart.js resize feedback loop (fixed-height wrapper), plus sensible CDN pins and the O(n) running total. LGTM.
Owner
|
Merged. Thanks @KhaiTrang1995 — Live Telemetry charts no longer unbounded-grow, CDN pins are locked, and the token sum is O(n). |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
The three charts in the Dogfooding / Live Telemetry section
(https://cobusgreyling.github.io/loop-engineering/#telemetry) grew taller
forever, making the page feel like it never finished loading. Root cause:
each canvas sat directly inside a
.carddiv with no explicit height.Chart.js is configured with
responsive: true+maintainAspectRatio: false, which resizes the canvas to fill its parent -- but since thecontainer's own height was determined by the canvas inside it, every
resize grew the container, which re-triggered Chart.js's ResizeObserver,
which grew the canvas again. Unbounded feedback loop.
Fixed by wrapping each canvas in a
position: relative; height: 240pxcontainer, so the container's size no longer depends on the canvas it
holds.
Also, while investigating:
mermaid@11floatsacross every 11.x release, and the Chart.js
<script>tag had noversion at all) -- any upstream release of either library can silently
change or break the live page with zero corresponding commit here.
Pinned both to the versions currently being served (mermaid 11.16.0,
Chart.js 4.5.1).
renderTelemetry()'s cumulative-tokens calculation recomputed the fullprefix sum from scratch for every point (O(n^2) over loop-run-log.md's
entries) instead of carrying a running total. loop-run-log.md is
appended to daily with nothing pruning it, so this cost compounds
indefinitely. Replaced with an O(n) running total.
Test plan
canvas.heightclimbed from 2661px to 8152px over 5 seconds with zerouser interaction, and
body.scrollHeightgrew on every scroll.canvas.heightholds steadyindefinitely, and repeated scrolling no longer changes
scrollHeight.old O(n^2) version on a sample dataset.
script still passes
node --checkafter the edits.