perf: Implement visibility gating in ExploreDataService

Co-authored-by: PR0M3TH3AN <[email protected]>

context/CONTEXT_2026-02-15.md

@@ -0,0 +1,13 @@
+# Context: Daily Performance & Docs Audit - 2026-02-15
+
+## Goal
+Improve app responsiveness and ensure documentation accuracy regarding upload/contribution.
+
+## Scope
+- Identify performance bottlenecks (CPU/Network).
+- Audit `content/` docs against `js/` implementation.
+- Apply small, safe fixes.
+
+## Assumptions
+- We are on `unstable` branch (implied by agent prompt, though I should check).
+- Node.js environment is ready.

docs/agents/task-logs/daily/2026-02-15_12-00-00_perf-agent_completed.md

@@ -0,0 +1,9 @@
+# Scheduler Run Log
+- **Date:** 2026-02-15
+- **Agent:** perf-agent
+- **Status:** Completed
+- **Changes:**
+  - Implemented visibility gating in `ExploreDataService` to pause background intervals when the tab is hidden.
+  - Audited upload documentation against `UploadModal` implementation (no changes needed).
+- **Reports:**
+  - `perf/daily-perf-report-2026-02-15.md`

js/services/exploreDataService.js

@@ -143,9 +143,16 @@ export default class ExploreDataService {
     this.watchHistoryInterval = null;
     this.tagIdfInterval = null;
     this.unsubscribeHandlers = [];
+    this.boundHandleVisibilityChange = this.handleVisibilityChange.bind(this);
   }
 
   initialize() {
+    if (typeof document !== "undefined") {
+      document.addEventListener(
+        "visibilitychange",
+        this.boundHandleVisibilityChange
+      );
+    }
     this.refreshWatchHistoryTagCounts({ force: true, reason: "init" });
     this.refreshTagIdf({ force: true, reason: "init" });
     this.subscribeToUpdates();
@@ -154,18 +161,39 @@ export default class ExploreDataService {
 
   startIntervals() {
     this.clearIntervals();
-    if (Number.isFinite(this.historyRefreshIntervalMs) && this.historyRefreshIntervalMs > 0) {
+
+    // If hidden, do not start intervals (will start on visibility change)
+    if (typeof document !== "undefined" && document.hidden) {
+      return;
+    }
+
+    if (
+      Number.isFinite(this.historyRefreshIntervalMs) &&
+      this.historyRefreshIntervalMs > 0
+    ) {
       this.watchHistoryInterval = setInterval(() => {
         this.refreshWatchHistoryTagCounts({ reason: "interval" });
       }, this.historyRefreshIntervalMs);
     }
-    if (Number.isFinite(this.idfRefreshIntervalMs) && this.idfRefreshIntervalMs > 0) {
+    if (
+      Number.isFinite(this.idfRefreshIntervalMs) &&
+      this.idfRefreshIntervalMs > 0
+    ) {
       this.tagIdfInterval = setInterval(() => {
         this.refreshTagIdf({ reason: "interval" });
       }, this.idfRefreshIntervalMs);
     }
   }
 
+  handleVisibilityChange() {
+    if (typeof document === "undefined") return;
+    if (document.hidden) {
+      this.clearIntervals();
+    } else {
+      this.startIntervals();
+    }
+  }
+
   clearIntervals() {
     if (this.watchHistoryInterval) {
       clearInterval(this.watchHistoryInterval);
@@ -304,6 +332,12 @@ export default class ExploreDataService {
   }
 
   destroy() {
+    if (typeof document !== "undefined") {
+      document.removeEventListener(
+        "visibilitychange",
+        this.boundHandleVisibilityChange
+      );
+    }
     this.clearIntervals();
 
     if (this.watchHistoryRefreshHandle) {

perf/daily-perf-report-2026-02-15.md

@@ -0,0 +1,28 @@
+# Daily Performance Report - 2026-02-15
+
+## Summary
+Investigated performance hits and audited upload documentation. Identified unnecessary background processing when the tab is hidden in `ExploreDataService`. Verified that upload documentation aligns with the implementation (multipart uploads, file types).
+
+## Findings & Fixes
+
+### P1: Background processing when hidden
+- **Component**: `js/services/exploreDataService.js`
+- **Issue**: `watchHistoryInterval` and `tagIdfInterval` run indefinitely even when the tab is backgrounded. This consumes CPU and Worker resources unnecessarily.
+- **Fix**: Added visibility gating. Intervals are cleared when `document.hidden` is true and restarted when visible.
+- **Status**: Fix implemented.
+
+### Docs Audit
+- **Scope**: `content/docs/guides/upload-content.md` vs `js/ui/components/UploadModal.js` / `js/services/r2Service.js`
+- **Verification**:
+    - **File Types**: Docs list specific extensions (`.mp4`, `.webm` etc). Code (`components/upload-modal.html`) matches this list in the `accept` attribute.
+    - **Upload Method**: Docs claim "Multipart Upload". Code (`js/services/r2Service.js`) uses `s3-multipart.js` `multipartUpload`, which implements chunked uploading.
+- **Result**: Docs are accurate. No changes needed.
+
+## Metrics
+- **Login Time**: N/A (No specific measurement this run)
+- **Queue Sizes**: N/A
+
+## Actions Taken
+- [x] Ran search patterns for performance bottlenecks.
+- [x] Audited upload documentation.
+- [x] Implemented visibility gating in `ExploreDataService`.

todo/TODO_2026-02-15.md

@@ -0,0 +1,8 @@
+# TODO - 2026-02-15
+
+- [ ] Run search patterns for performance hits.
+- [ ] Generate `perf/hits-2026-02-15.json`.
+- [ ] Audit `content/` for upload docs.
+- [ ] Verify `js/` upload logic.
+- [ ] Create `daily-perf-report-2026-02-15.md`.
+- [ ] Apply fixes if critical/safe issues found.