# forward-future/outlier-tracker architecture

> Architecture diagram of the GitHub repository forward-future/outlier-tracker, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-15). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/forward-future/outlier-tracker
- Repository: https://github.com/forward-future/outlier-tracker

## Overview

Outlier Tracker is a Chrome extension that turns YouTube video and channel data into outlier badges, observed view histories, and channel analysis. The main workflow starts on YouTube: the content script identifies visible videos and requests scores; the background service worker fetches and caches API data, computes format-aware baselines, and returns results for badges. Users can inspect or track a video, or follow channels for analysis and hourly sampling. Popup, hover, and dashboard interfaces expose these features. The excerpts do not show all message handlers or alarm wiring, so those documented links cite the README.

Main entry points: [`background.js`](https://github.com/forward-future/outlier-tracker/blob/main/background.js) (API and scoring), [`hover.js`](https://github.com/forward-future/outlier-tracker/blob/main/hover.js) (History inspector), [`dashboard.js`](https://github.com/forward-future/outlier-tracker/blob/main/dashboard.js) (Channel dashboard), [`options.js`](https://github.com/forward-future/outlier-tracker/blob/main/options.js) (API key settings)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_discovery["YouTube discovery"]
  node_content["Video badges<br/>[content.js]"]
end

subgraph group_collection["Data and scoring"]
  node_worker["API and scoring<br/>[background.js]"]
  node_history["History analysis<br/>[history.js]"]
  node_alarms["Hourly alarms"]
end

subgraph group_surfaces["User interfaces"]
  node_popup["Video popup<br/>[popup.js]"]
  node_hover["History inspector<br/>[hover.js]"]
  node_dashboard["Channel dashboard<br/>[dashboard.js]"]
  node_chart["Chart renderers<br/>[chart.js]"]
end

subgraph group_settings["Settings and state"]
  node_storage[("Extension storage")]
  node_options["API key settings<br/>[options.js]"]
end

node_user(("YouTube user"))
node_youtube(("YouTube pages"))
node_api{{"YouTube Data API"}}

node_user -->|"browses"| node_youtube
node_youtube -->|"hosts script"| node_content
node_content -->|"requests scores"| node_worker
node_worker -->|"returns scores"| node_content
node_worker -->|"fetches data"| node_api
node_worker -->|"computes baselines"| node_history
node_worker -->|"caches and records"| node_storage
node_alarms -->|"schedules collection"| node_worker
node_user -->|"opens"| node_popup
node_popup -->|"requests details"| node_worker
node_user -->|"inspects badges"| node_hover
node_hover -->|"requests history"| node_worker
node_user -->|"opens analysis"| node_dashboard
node_dashboard -->|"requests channel data"| node_worker
node_hover -->|"renders history"| node_chart
node_dashboard -->|"renders uploads"| node_chart
node_user -->|"sets API key"| node_options
node_options -->|"tests key"| node_worker
node_options -->|"saves key"| node_storage

click node_content "https://github.com/forward-future/outlier-tracker/blob/main/content.js"
click node_worker "https://github.com/forward-future/outlier-tracker/blob/main/background.js"
click node_history "https://github.com/forward-future/outlier-tracker/blob/main/history.js"
click node_popup "https://github.com/forward-future/outlier-tracker/blob/main/popup.js"
click node_hover "https://github.com/forward-future/outlier-tracker/blob/main/hover.js"
click node_dashboard "https://github.com/forward-future/outlier-tracker/blob/main/dashboard.js"
click node_chart "https://github.com/forward-future/outlier-tracker/blob/main/chart.js"
click node_options "https://github.com/forward-future/outlier-tracker/blob/main/options.js"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_content,node_user toneBlue
class node_worker,node_history,node_alarms toneAmber
class node_popup,node_hover,node_dashboard,node_chart,node_api toneMint
class node_storage,node_options toneRose
class node_youtube toneIndigo
```

## Components

### YouTube discovery

- [Video badges](https://github.com/forward-future/outlier-tracker/blob/main/content.js): `content.js`

### Data and scoring

- [API and scoring](https://github.com/forward-future/outlier-tracker/blob/main/background.js): `background.js`
- [History analysis](https://github.com/forward-future/outlier-tracker/blob/main/history.js): `history.js`
- **Hourly alarms**

### User interfaces

- [Video popup](https://github.com/forward-future/outlier-tracker/blob/main/popup.js): `popup.js`
- [History inspector](https://github.com/forward-future/outlier-tracker/blob/main/hover.js): `hover.js`
- [Channel dashboard](https://github.com/forward-future/outlier-tracker/blob/main/dashboard.js): `dashboard.js`
- [Chart renderers](https://github.com/forward-future/outlier-tracker/blob/main/chart.js): `chart.js`

### Settings and state

- **Extension storage**
- [API key settings](https://github.com/forward-future/outlier-tracker/blob/main/options.js): `options.js`

### Other components

- **YouTube user**
- **YouTube pages**
- **YouTube Data API**

## Connections

- YouTube user → YouTube pages: browses (evidence: `README.md`)
- YouTube pages → Video badges: hosts script (evidence: `README.md`)
- Video badges → API and scoring: requests scores (evidence: `README.md`)
- API and scoring → Video badges: returns scores (evidence: `README.md`)
- API and scoring → YouTube Data API: fetches data (evidence: `README.md`)
- API and scoring → History analysis: computes baselines (evidence: `history.js`)
- API and scoring → Extension storage: caches and records (evidence: `README.md`)
- Hourly alarms → API and scoring: schedules collection (evidence: `README.md`)
- YouTube user → Video popup: opens (evidence: `README.md`)
- Video popup → API and scoring: requests details (evidence: `popup.js`)
- YouTube user → History inspector: inspects badges (evidence: `README.md`)
- History inspector → API and scoring: requests history (evidence: `hover.js`)
- YouTube user → Channel dashboard: opens analysis (evidence: `README.md`)
- Channel dashboard → API and scoring: requests channel data (evidence: `dashboard.js`)
- History inspector → Chart renderers: renders history (evidence: `chart.js`)
- Channel dashboard → Chart renderers: renders uploads (evidence: `chart.js`)
- YouTube user → API key settings: sets API key (evidence: `README.md`)
- API key settings → API and scoring: tests key (evidence: `options.js`)
- API key settings → Extension storage: saves key (evidence: `options.js`)