Skip to content

perf: serve images from a static host instead of the API - #397

Merged
nGervasyuk merged 2 commits into
Visual-Regression-Tracker:masterfrom
nGervasyuk:fix/offload-image-serving
Aug 23, 2026
Merged

perf: serve images from a static host instead of the API#397
nGervasyuk merged 2 commits into
Visual-Regression-Tracker:masterfrom
nGervasyuk:fix/offload-image-serving

Conversation

@nGervasyuk

@nGervasyuk nGervasyuk commented Aug 20, 2026

Copy link
Copy Markdown
Collaborator

Problem

The UI loads every screenshot through ${API_URL}/images/<name> — the same single-threaded API process that computes image diffs. While a build is ingesting, image requests queue behind CPU-bound comparison work and baseline/checkpoint images take seconds to appear in the test details dialog.

Change

New optional REACT_APP_STATIC_URL runtime env var. When set (e.g. /static/imageUploads — the UI container's nginx already mounts the imageUploads volume there), images are fetched directly from the static host and never touch the API. When unset, behaviour is unchanged, so S3-backed deployments keep working through the API redirect.

Measured on a local stack during a 4-way concurrent upload burst: image GET through the API — 963 ms median; same file through nginx — 3 ms.

Pairs with Visual-Regression-Tracker/backend#368.


Deploying

REACT_APP_STATIC_URL is opt-in and only applies to HDD-backed deployments, where the UI container already mounts the imageUploads volume. Leave it unset on an S3-backed deployment: there the API redirects to storage and images never pass through it anyway, so pointing the UI at a static path that does not exist would break every image. Unset is the default and keeps todays behaviour exactly.

The second commit (socket events for other builds no longer re-render the list) helps every deployment regardless of storage.

@pashidlos pashidlos left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

The API serves images from the same single-threaded process that computes
image diffs, so during build ingestion image requests queue behind CPU-bound
work and screenshots take seconds to load. The UI container's nginx already
exposes the imageUploads volume, so let deployments opt in via
REACT_APP_STATIC_URL (e.g. /static/imageUploads) to fetch images from it
directly. When unset, images keep going through the API — S3-backed
deployments are unaffected.
Socket events arrive for every build, and even an all-filtered-out batch
dispatched a state update that replaced the testRuns array — invalidating
every memo over it and re-rendering the grid each debounce tick while an
unrelated build was ingesting. With thousands of runs open that made the
whole UI stutter. Skip empty batches, return the same state when nothing
matched, and deduplicate by id via Set/Map instead of nested scans.
@nGervasyuk
nGervasyuk force-pushed the fix/offload-image-serving branch from 12104cf to 11f1d59 Compare August 23, 2026 06:30
@sonarqubecloud

Copy link
Copy Markdown

@nGervasyuk
nGervasyuk merged commit 915f029 into Visual-Regression-Tracker:master Aug 23, 2026
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants