Linen Charcoal Denim Ruby Matcha Butter

Default Playfair Inconsolata Caveat

Codebase Cleanup Backlog

Generated 2026-03-01. 71 items across reuse, quality, and efficiency.

Bugs (fix first)

• B1. Undefined CSS variables in _games.scss — --bg-color, --border-color, --accent-color, --text-muted (lines 322–440) are never defined. Should be --background-main, --translucent-medium, --page-accent, --sec-text-color.
• B2. ipod.js:222 calls undefined playNextSong() — runtime error when any song finishes. Also currentSong (lines 121, 222, 296) is never declared, making it an implicit global.
• B3. empty_fullscreen.html:29 has stale theme list — missing "matcha". Also duplicates theme-reading logic instead of loading url-params.js.
• B4. initSwitch re-bound on every type change in gradient-generator.js:63,131 — accumulates duplicate event listeners.

Page Load / Performance (high impact)

• P1. MathJax + jQuery loaded unconditionally on every page (default.html:121–131). Should be conditional via front-matter flag or at minimum async/defer.
• P2. Phosphor Icons loaded from unpkg without version pin or defer (default.html:74). Render-blocking, unversioned CDN load.
• P3. Three unthrottled resize listeners on heavy canvas renders (lastfm-blog.js:226,410,605). Full canvas repaints at 60fps during resize. Add debounce/throttle.
• P4. 4K canvas render on every slider/color input (gradient-generator.js:170–171). generateHighResolution() fires synchronously on every preview update. Debounce or defer to download.
• P5. Temporary canvas created every animation frame (circle-camera.js:87–91). Create once and reuse.
• P6. getComputedStyle called every animation frame (circle-camera.js:100). Cache and re-read only on theme change.
• P7. JSON.parse(JSON.stringify(...)) deep clone every Game of Life tick (gameoflife.js:110). Use double-buffer swap.
• P8. Game of Life renders every cell every tick including dead ones (gameoflife.js:157–196). Track dirty set.
• P9. setInterval for Flappy Bird game loop (flappybird.js:98,293). Switch to requestAnimationFrame.
• P10. Duplicate fetch of 3am-analysis.json (lastfm-blog.js:614 and :236). Share the data.
• P11. Wikipedia tool makes 2 sequential fetches when 1 suffices (random-wiki.js:23–50). Summary endpoint already returns everything needed.
• P12. css() helper called 3–4 times per render in lastfm-blog.js. Cache values per theme change instead.

N+1 DOM Queries

• D1. querySelector per cell in Minesweeper flood-fill (minesweeper.js:199,255,268,278). Hundreds of attribute-selector queries on expert board. Cache in a 2D array at init.
• D2. Repeated querySelectorAll('.guess-row') on every guess (colordle.js:148,291). Query once and cache.
• D3. updateNavigationButtonStates re-queries elements already captured in outer scope (historical-browser.js:107–108).
• D4. updateThemeSwitch/updateFontSwitch re-query DOM on every change (theme-manager.js:55–63, font-manager.js:26–33). Cache selectors at init.
• D5. showColorDetails clones buttons via cloneNode on every click (color-palette.js:416–434). Use event delegation.
• D6. renderMusicGrid double-queries grid children + O(n) scan per click (lastfm.js:149–168). Use event delegation.

Memory / Cleanup

• M1. Unbounded setTimeout loop in iPod (ipod.js:237–262). updateProgress() re-schedules forever even after player is nulled.
• M2. setInterval in location-time.js:18 never cleared.
• M3. drawArtistLifecycle missing from resize re-render list in lastfm-blog.js. All other charts re-render on resize; this one doesn’t.

JS Deduplication

• J1. Extract shared mobile detection utility — duplicated in camera-to-ascii.js:8, circle-camera.js:9, flappybird.js:13, gameoflife.js:10.
• J2. Extract shared getCSSVariable helper — duplicated in lastfm-blog.js:62, gameoflife.js:35, circle-camera.js:17.
• J3. Extract shared camera start/stop module — camera-to-ascii.js:29–54, circle-camera.js:43–75 + fullscreen toggle.
• J4. Move calculateOptimalFontSize into ascii-utils.js — duplicated in photo-to-ascii.js:11–13, camera-to-ascii.js:24–27.
• J5. Extract shared image file-load + preview swap — photo-to-ascii.js:18–29, color-palette.js:16–30.
• J6. Use existing [data-copy] pattern from ui-components.js — reimplemented in color-palette.js:421–434, colordle.js:354–366.
• J7. Extract triggerDownload(blob, filename) utility — duplicated in photo-to-ascii.js:116–125, gradient-generator.js:329–336.
• J8. Extract shared rgbToHex/hexToRgb color utils — color-palette.js:438, gradient-generator.js:194.
• J9. Deduplicate X-axis year-label logic in lastfm-blog.js — triplicated at lines 164–177, 330–344, 554–567.
• J10. Deduplicate Y-axis label boilerplate in lastfm-blog.js — triplicated at lines 151–154, 317–320, 541–544.
• J11. Dispatch themechange event from theme-manager.js — eliminates duplicate MutationObserver in gameoflife.js:56–63 and lastfm-blog.js:641–646.
• J12. Single source of truth for theme list — duplicated in url-params.js:11, theme-manager.js:67, empty_fullscreen.html:29.
• J13. Unify back/forward handlers in historical-browser.js:131–175 into navigateToHistoryIndex(newIndex).
• J14. Move initSwitch from inline <script> in selection-switch.html to a standalone JS file loaded once.

SCSS Deduplication

• S1. Replace 13+ raw backdrop-filter: blur(10px) with @include translucent-surface or a dedicated mixin.
• S2. Extract 3-line outline pattern (9 occurrences) into a mixin or use shorthand.
• S3. Add $breakpoint-tablet: 768px variable — hardcoded in _games.scss:18, _grids.scss:72 vs $breakpoint-mobile: 600px.
• S4. Use @include no-select in _post.scss:131–135 and _ipod.scss:32–35 instead of manual vendor prefixes.
• S5. Use @include system-font in _games.scss:209 and _forms.scss:176 instead of hardcoded 'Inter'.
• S6. Use @include mono-font in _post.scss:119 instead of hardcoded "IBM Plex Mono".
• S7. Replace raw RGBA values in _buttons.scss:28,31 with CSS custom properties.
• S8. Replace raw RGBA values in _cards.scss:79,89,95,103 with named custom properties.

Dead Code Removal

• X1. Delete canvas-helpers.js — CanvasUtils has zero consumers.
• X2. Add SCSS for about.html layout classes (about__back, about__title, about__content) or remove the classes.
• X3. Add SCSS for music-loading, masonry-gallery, album-description in r2-album.html or remove the classes.
• X4. Remove duplicate font-weight: 500 in _games.scss:59,61.
• X5. Remove dead display: inline overridden by display: block in _post.scss:10–12.
• X6. Remove duplicate font-weight: 200 in _post.scss:115,120.
• X7. Remove duplicate text-decoration-color and text-decoration-thickness in _post.scss:100–103.
• X8. Remove redundant inline userSelect styles in ipod.js:3–6 — already handled by CSS @include no-select.

Redundant State

• R1. Drop currentTheme variable in theme-manager.js:3 — derive from data-theme attribute.
• R2. Drop currentFont variable in font-manager.js:3 — derive from CSS custom property.
• R3. Drop isInitialLoad flag in theme-manager.js:4 — redundant with skipTransition parameter.
• R4. Drop generatedImageData in gradient-generator.js:25 — canvas already holds the data.

Minor Quality

• Q1. Simplify loadAlbum params (r2-gallery.js:8) — derive containerId/loadingId from album.
• Q2. Simplify renderGradientToCanvas params (gradient-generator.js:218) — derive ctx from canvas.
• Q3. Remove redundant switchManager.setActive call in minesweeper.js:299.
• Q4. Replace inline onclick in header.html with addEventListener for consistency.
• Q5. Use constants for localStorage keys ("theme", "font", "colordle-stats", etc.).
• Q6. Use constants for repeated CSS variable name strings in lastfm-blog.js.
• Q7. Fix --spacing-lg used as font-size in _games.scss:226–244 — use a typography token.
• Q8. Replace about.html standalone back link with shared header breadcrumb.
• Q9. Extract switchManager from raw global into a proper module.
• Q10. Use constants for minesweeper difficulty keys instead of magic strings.