webWorks

Shows the CPU, memory and network load caused by the site you are looking at, as live graphs.

webWorks shows how much of your computer the site you are looking at is actually using — live, in a small panel in the top-right corner of the page. CPU (main-thread occupancy), memory (JS heap) and network down/up are sampled once a second and drawn as graphs. You can see which tab is spinning up your fan without ever opening the browser's task manager, and you can turn it off the moment you are done. ■ WHAT IT DOES • Four live graphs — CPU occupancy, JS heap, network down and up. Down and up share a unit, so they sit on one chart as two series. • Three time ranges — 1 min (1s interval), 5 min (5s average), 1 hour (1m average). All three buffers fill at the same time, so switching ranges never loses history. • Crosshair tooltip — move over a graph and all three charts point at the same instant. Keyboard focus plus the arrow keys reads the same values. • Table view — every sample drawn on the graph, plus min, average and max. Nothing depends on telling colours apart. • CSV / JSON export — the ⤓ in the footer. CSV is a plain table of the current range's samples that drops straight into a spreadsheet, pandas or R; JSON carries all three ranges plus cumulative totals and how each number was measured. You see a preview before saving. • Collapsed state — shrinks to a one-line pill: "CPU 12% · 148MB · 34.2KB/s". It covers almost none of the page. • Drag to move — grab the header; the position is remembered on the next page. • Three themes — system / light / dark, with system following your OS setting in real time. • Two languages — Korean and English, plus a system option that follows your browser. Changing it redraws an open panel in place, without interrupting the measurement. • Off means off — closing the panel disconnects the observers and timers, and once no tab is being measured, every request listener is detached too. ■ HOW TO USE IT • Click the webWorks icon, then "Measure this tab". • Alt+Shift+W toggles the panel on the current tab. • "Start automatically on every site" turns it on whenever a page loads. • ⏸ freezes the display (collection continues) · ⌄ collapses · ✕ stops measuring · ⤓ exports. Measurement counts from the moment you turn it on. Navigating away resets the counters. ■ HOW IT MEASURES — AND WHAT IT CANNOT SEE An instrument that hides its limits cannot be trusted, so here they are. • CPU — from PerformanceObserver('longtask') and a 100ms timer-lag probe, whichever is larger, divided by the sample interval. This is main-thread occupancy, not process CPU usage: Web Workers, the GPU, the compositor and other frames are excluded. That is why the panel labels it "CPU · main thread". • Memory — performance.memory.usedJSHeapSize, falling back to measureUserAgentSpecificMemory(). It is the renderer's JS heap only; DOM nodes, images and GPU textures are not included, and other frames sharing the process are mixed in. • Network down — Resource Timing transferSize, topped up with Content-Length where a cross-origin response masks the size. Cache hits count as zero, which is correct. • Network up — reconstructed from the request line, request headers and body. It does not account for HTTP/2 and HTTP/3 header compression, so it reads higher than reality. Read it as a trend, not an absolute. Known limits: graphs stall in background tabs (Chrome throttles their timers hard, and a stretched sample is discarded rather than drawn as garbage); iframes are not instrumented, only the top frame; and the panel cannot run on chrome:// pages, the Chrome Web Store or other extension pages, because the browser forbids script injection there. The exact per-process numbers would require chrome.debugger, which puts a "being debugged" banner on every tab. webWorks deliberately stays on web standard APIs instead: a little less accurate, but quiet, light, and switchable at any moment. ■ PRIVACY No data leaves your machine. No network requests, no remote reporting, no analytics, no account. Every number lives in tab memory and disappears when you close the panel. The only things stored are your settings — theme, language, default range, auto-start and panel position. ■ PERMISSIONS • webRequest — the only window onto upload bytes and request counts. It observes only; it never blocks or modifies a request. • storage — saves the settings listed above. • scripting — injects the measurement scripts into tabs that were already open before the extension was installed or reloaded. The files it injects are fixed and packaged; no remote code is ever executed. • Access to all sites — needed to measure on whichever site you are on. Requires Chrome 116 or newer. Open source, MIT licensed. --- webWorks는 지금 보고 있는 사이트가 내 컴퓨터를 얼마나 쓰고 있는지를 페이지 오른쪽 위 작은 패널에 실시간으로 보여줍니다. CPU(메인 스레드 점유율), 메모리(JS 힙), 네트워크 수신/송신을 1초에 한 번 재서 그래프로 그립니다. 브라우저 작업 관리자를 열지 않아도 어느 탭이 팬을 돌리고 있는지 보이고, 다 봤으면 바로 끌 수 있습니다. ■ 무엇을 하나 • 실시간 그래프 4종 — CPU 점유율, JS 힙, 네트워크 수신/송신. 수신과 송신은 단위가 같아 한 차트에 두 계열로 올립니다. • 시간 범위 3종 — 1분(1초 간격) · 5분(5초 평균) · 1시간(1분 평균). 세 버퍼가 동시에 차기 때문에 범위를 바꿔도 기록이 사라지지 않습니다. • 십자선 툴팁 — 그래프 위로 움직이면 세 차트가 같은 순간을 함께 가리킵니다. 키보드 포커스 + 화살표 키로도 같은 값을 읽습니다. • 표 보기 — 그래프에 그려진 모든 샘플과 최소·평균·최대. 색만으로 구분해야 하는 상황을 만들지 않습니다. • CSV / JSON 내보내기 — 푸터의 ⤓. CSV는 현재 범위 샘플만 담은 순수한 표라 스프레드시트·pandas·R에 그대로 들어가고, JSON은 세 범위 전부와 누적 합계, 측정 방식까지 함께 담습니다. 저장 전에 미리보기가 뜹니다. • 접기 — 한 줄 알약으로 줄어듭니다: "CPU 12% · 148MB · 34.2KB/s". 페이지를 거의 가리지 않습니다. • 끌어서 이동 — 헤더를 잡아 옮기면 위치가 저장되어 다음 페이지에서도 유지됩니다. • 테마 3종 — 시스템 / 라이트 / 다크. 시스템은 OS 설정을 실시간으로 따라갑니다. • 언어 2종 — 한국어 / 영어, 그리고 브라우저 언어를 따르는 시스템 옵션. 바꾸면 열려 있는 패널이 그 자리에서 다시 그려지고, 측정 기록은 끊기지 않습니다. • 끄면 진짜 꺼집니다 — 패널을 닫으면 옵저버와 타이머가 해제되고, 측정 중인 탭이 하나도 없으면 요청 리스너까지 전부 뗍니다. ■ 사용법 • 툴바의 webWorks 아이콘 → "이 탭 측정". • Alt+Shift+W 로 현재 탭의 패널을 켜고 끕니다. • "모든 사이트에서 자동 시작"을 켜면 페이지가 열릴 때마다 알아서 켜집니다. • ⏸ 화면 정지(수집은 계속) · ⌄ 접기 · ✕ 측정 종료 · ⤓ 내보내기. 측정은 켠 순간부터 셉니다. 페이지를 벗어나면 카운터가 초기화됩니다. ■ 어떻게 재고, 무엇은 못 보는가 한계를 감추는 계측기는 믿을 수 없으니 그대로 적습니다. • CPU — PerformanceObserver('longtask')와 100ms 타이머 지연 프로브 중 큰 쪽을 샘플 간격으로 나눈 값. 프로세스 CPU 사용률이 아니라 메인 스레드 점유율입니다. 웹 워커, GPU, 컴포지터, 다른 프레임은 빠집니다. 그래서 패널에도 "CPU · 메인 스레드"라고 적혀 있습니다. • 메모리 — performance.memory.usedJSHeapSize, 없으면 measureUserAgentSpecificMemory(). 렌더러의 JS 힙만이며 DOM 노드·이미지·GPU 텍스처는 포함되지 않고, 같은 프로세스를 쓰는 다른 프레임의 힙이 섞입니다. • 네트워크 수신 — Resource Timing transferSize에, 크로스 오리진 응답이 크기를 가린 경우 Content-Length로 보충. 캐시 적중은 0으로 세며 이게 맞습니다. • 네트워크 송신 — 요청 라인 + 요청 헤더 + 본문으로 재구성한 근사치. HTTP/2·HTTP/3의 헤더 압축을 반영할 수 없어 실제보다 높게 나옵니다. 절대값이 아니라 추세로 읽어 주세요. 알려진 한계: 백그라운드 탭에서는 그래프가 멈춥니다(크롬이 타이머를 강하게 조이며, 늘어진 구간은 엉터리로 그리느니 버립니다). iframe은 계측하지 않고 최상위 프레임만 봅니다. chrome:// 페이지, 크롬 웹 스토어, 다른 확장 프로그램 페이지에서는 브라우저가 스크립트 주입을 막으므로 동작하지 않습니다. 프로세스별 정확한 값은 chrome.debugger가 필요한데, 그러면 모든 탭에 "디버깅 중" 배너가 붙습니다. webWorks는 일부러 웹 표준 API만 씁니다. 조금 덜 정확한 대신 조용하고 가볍고, 언제든 끌 수 있습니다. ■ 개인정보 어떤 데이터도 기기를 떠나지 않습니다. 네트워크 요청도, 원격 보고도, 분석 도구도, 계정도 없습니다. 모든 수치는 탭 메모리에만 있다가 패널을 닫으면 사라집니다. 저장되는 것은 설정(테마·언어·기본 범위·자동 시작·패널 위치)뿐입니다. ■ 권한 • webRequest — 업로드 바이트와 요청 수를 볼 수 있는 유일한 창구. 관찰만 하며 요청을 막거나 바꾸지 않습니다. • storage — 위의 설정을 저장합니다. • scripting — 확장을 설치·새로고침하기 전에 이미 열려 있던 탭에 측정 스크립트를 넣습니다. 주입하는 파일은 패키지에 포함된 고정된 파일이며, 원격 코드는 실행하지 않습니다. • 모든 사이트 접근 — 어느 사이트에서든 측정하기 위해 필요합니다. Chrome 116 이상이 필요합니다. 오픈소스, MIT 라이선스.