阅读中文版本

Build an Image Resize Pipeline

Image Resize Pipeline — a complete walkthrough of image processing, covering decode pool, resize worker, format encoder, and testing.

image_resize_pipeline/
├── src/index.ts
├── src/decode-pool.ts
├── src/resize-worker.ts
├── tests/image_resize_pipeline.test.ts
└── package.json

// Decode pool: image processing core
export function decodepool(input: DecodepoolInput): DecodepoolResult {
  // Build the decode pool that anchors image processing and defines the core data shape.
  return processDecodepool(input);
}

// Resize worker — handles image processing Add the resize worker so
export class Resizeworker {
  constructor(private opts: ResizeworkerOptions) {}
  async run(ctx: Context): Promise<ResizeworkerOutput> {
    return this.execute(ctx);
  }
}

// Format encoder: image processing stage
export const formatencoder = (next: Next) => async (req: Request) => {
  const out = await transform(req);
  return next(out);
};

// Derivative planner for image processing
export async function derivativeplanner(stream: AsyncIterable<Chunk>): Promise<Aggregate> {
  let acc = init();
  for await (const c of stream) acc = merge(acc, c);
  return acc;
}

// Cache writer: image processing finalization
export function cachewriter(state: State): Result {
  validate(state);
  return finalize(state);
}

Project overview

This project builds a image processing system whose reason for existing is producing multiple resized derivatives from a source image efficiently and without blocking on a single large decode. The temptation in image processing is to bolt the interesting part onto a working prototype and discover the hard cases in production; this build inverts that order and treats a malformed image that triggers a decode crash and takes down the worker pool for every other request as the first thing designed, not the last.

You will implement Decode pool, Resize worker, Format encoder, Derivative planner, and Cache writer, each as a module with one responsibility and a test that proves it in isolation. The image processing pipeline is then the wiring that composes them, and the integration test is where the composition is shown to survive a malformed image that triggers a decode crash and takes down the worker pool for every other request.

The walkthrough is written for a developer who has used a image processing system but has not had to make one honest. It favors explicit data shapes over clever abstractions, and it names the failure each design choice prevents rather than presenting the choice as a style preference.

Each phase ends with something observable — a decode pool that returns the right shape, a resize worker that rejects bad input, an integration test that goes green — so you can stop at any point and still have a image processing system that works for the cases covered so far.

What you will build

The finished image processing system exposes five capabilities, each with a focused test:

• Decode pool
• Resize worker
• Format encoder
• Derivative planner
• Cache writer

Decode pool is the foundation that every later stage assumes; Resize worker is where image processing correctness lives; Format encoder handles a malformed image that triggers a decode crash and takes down the worker pool for every other request; Derivative planner makes the system observable; and Cache writer is the graceful-degradation layer that keeps overload from becoming corruption.

The build keeps the image processing logic in ordinary modules you can read in one sitting, and pulls in dependencies only for the parts that are genuinely tedious to hand-roll. That keeps the diff between the tutorial and a real codebase small, and keeps the failure modes visible in code rather than hidden behind a framework.

Architecture and data model

The system is organized around Decode pool, Resize worker, and Format encoder, with Derivative planner tying them together. Data flows as a source image decoded once and resized into several target dimensions, each encoded and cached keyed by source hash and size.

Each component is a module with a pure interface where practical: the same input produces the same output, and side effects are pushed to the edges. That discipline is what makes the phases independently testable, because a test for Format encoder does not need to stand up Decode pool and Resize worker to exercise the interesting branch.

The data model is deliberately explicit. A source image decoded once and resized into several target dimensions, each encoded and cached keyed by source hash and size Keeping the shape written down — in a schema, a type, or a fixture — means a change to the shape is a visible diff rather than a silent runtime shift, and it means the integration test can assert against a concrete shape instead of guessing.

Configuration and code are kept apart: the configuration says what image processing should do, the modules say how. A reviewer can change a threshold or a policy without reading the implementation, which keeps the risky changes small and lets the diff stand as the review.

The failure path through Format encoder is designed before the happy path is finished, because a malformed image that triggers a decode crash and takes down the worker pool for every other request is the case that distinguishes a image processing system from a demo. Every component declares what it does when its inputs are wrong, and the integration test asserts each of those declarations.

Prerequisites and dependencies

Have these ready before you install anything, so the image processing setup is not blocked by a missing tool:

• Node.js 20 LTS or later
• Familiarity with image processing fundamentals
• A local environment to run the test suite

The runtime dependencies are chosen to keep the image processing datapath legible:

• sharp (^0.33.0) — Image decode and resize
• fastify (^5.0.0) — Pipeline API

# setup for image-resize-pipeline
pnpm init
pnpm add sharp fastify
pnpm add -D typescript tsx vitest

Versions are pinned to a major range so the image processing install is reproducible; commit the lockfile. The decode pool reads its operational parameters from the environment and validates them at startup, so a missing value fails the boot rather than the first image processing request.

Directory structure

Keep each image processing component in its own file so it can be tested without starting the others:

image_resize_pipeline/
├── src/index.ts
├── src/decode-pool.ts
├── src/resize-worker.ts
├── tests/image_resize_pipeline.test.ts
└── package.json

Phase 1: Decode pool

Build the decode pool that anchors image processing and defines the core data shape.

// Decode pool: image processing core
export function decodepool(input: DecodepoolInput): DecodepoolResult {
  // Build the decode pool that anchors image processing and defines the core data shape.
  return processDecodepool(input);
}

After this phase the decode pool works in isolation and is covered by a unit test. The decode pool defines the data shape that every later stage assumes, so getting it right first means the later phases compile against a stable contract.

Treat the decode pool as the single source of truth for the image processing data shape. Validate inputs at the boundary and reject early, so a malformed value never reaches Resize worker or Format encoder where its effect would be harder to localize.

Phase 2: Resize worker

Add the resize worker so image processing can producing multiple resized derivatives correctly.

// Resize worker — handles image processing Add the resize worker so
export class Resizeworker {
  constructor(private opts: ResizeworkerOptions) {}
  async run(ctx: Context): Promise<ResizeworkerOutput> {
    return this.execute(ctx);
  }
}

After this phase the resize worker works in isolation and is covered by a unit test. This is where image processing correctness lives: the resize worker is what makes producing multiple resized derivatives from a source image efficiently and without blocking on a single large decode true, and its test is the proof.

Keep the resize worker pure where you can. A function that takes an input and returns an output is trivial to test and impossible to mock wrong; a class with hidden state is the opposite. Push side effects to the caller and keep the resize worker about the transformation.

Phase 3: Format encoder

Wire the format encoder to handle a malformed image that without losing data.

// Format encoder: image processing stage
export const formatencoder = (next: Next) => async (req: Request) => {
  const out = await transform(req);
  return next(out);
};

After this phase the format encoder works in isolation and is covered by a unit test. The format encoder is the difference between a image processing system that works on the happy path and one that survives a malformed image that triggers a decode crash and takes down the worker pool for every other request.

Design the failure before the success. Decide what format encoder does when a malformed image that triggers a decode crash and takes down the worker pool for every other request: reject, retry, shed, or degrade — and write that test first. A image processing system whose failure behavior is unspecified will pick one at random under pressure, and it is usually the wrong one.

Phase 4: Derivative planner

Integrate the derivative planner to make image processing observable and testable end to end.

// Derivative planner for image processing
export async function derivativeplanner(stream: AsyncIterable<Chunk>): Promise<Aggregate> {
  let acc = init();
  for await (const c of stream) acc = merge(acc, c);
  return acc;
}

After this phase the derivative planner works in isolation and is covered by a unit test. Observability is not a finishing touch; it is how you know the image processing system is doing what it claims in production.

Emit one structured event per meaningful action, with enough context to localize a failure without a second round-trip. The derivative planner is what turns “something is slow” into “the resize worker is slow for inputs matching this shape,” which is the difference between an alert and an investigation.

Phase 5: Cache writer

Finalize the cache writer so the image processing system degrades gracefully under overload.

// Cache writer: image processing finalization
export function cachewriter(state: State): Result {
  validate(state);
  return finalize(state);
}

After this phase the cache writer works in isolation and is covered by a unit test. The cache writer is what keeps overload from becoming corruption: when the image processing system is asked for more than it can do, it degrades in a defined way instead of failing in an undefined one.

Pick a degradation strategy for cache writer — shed, queue, or backpressure — and make it explicit in code and in a test. Leaving the behavior to chance is how a image processing traffic spike becomes a data loss incident.

Testing

Each phase has a focused test: decode pool, resize worker, and format encoder are exercised in isolation, then an integration test drives the full image processing pipeline and asserts the a malformed image that case is handled.

Start with unit tests that pin each component’s contract: the decode pool returns the documented shape, the resize worker transforms correctly, and the format encoder fails in the documented way. These tests are fast and they localize regressions to the component that broke.

Then add an integration test that composes the components and drives a realistic image processing scenario end to end. Assert the happy path first, then deliberately trigger a malformed image that triggers a decode crash and takes down the worker pool for every other request and assert the system degrades rather than corrupts. Because the components are pure where practical, the integration test stays deterministic rather than flaky.

A image processing suite must also prove the negative: bad input is rejected at the boundary, overload is shed rather than queued indefinitely, and a partial failure does not leave the system in an inconsistent state. These are the tests that catch the regressions a happy-path suite never would.

The entire image processing suite runs with no external service; every dependency is either in-process or stubbed, so every case is reproducible in CI. That is what lets the format encoder failure-mode assertions live as tests rather than as a manual checklist that drifts out of date.

# run the image processing test suite
pnpm vitest run

Deployment and operations

Run at least two image processing instances behind a load balancer and share state in Redis. Set resource limits so image processing overload surfaces as backpressure rather than failure.

Run at least two stateless instances behind a load balancer, and move any shared state into a shared store so the image processing behavior is global rather than per instance. Size limits so the system sheds load before it runs out of memory, because a image processing system that OOMs under load fails in a way that is hard to reason about.

Drain on deploy: stop accepting new work, let in-flight image processing operations finish, then exit. Because the system holds no state that cannot be reconstructed, a rollout is a matter of cycling instances one at a time while watching the error rate.

When a dependency is unavailable, decide explicitly whether the image processing system fails closed or degrades. Leaving that choice to chance is how a dependency outage becomes a silent data loss, so make the choice visible in code and in a test.

Security considerations

Validate all image processing inputs at the boundary, reject oversized payloads before buffering them, and keep secrets in the environment rather than the repository.

The image processing system is a choke point, so it is the right place to reject malformed input before it reaches resize worker or format encoder. Validate the shape and the size at the edge, and let the inner components assume what they receive is well-formed.

Never log secrets or full payloads; log enough to localize a failure without recording data that should not be on disk. Treat any external call as untrusted and validate its response before using it, because a image processing system that trusts its inputs blindly is one malformed response away from corruption.

Keep dependencies pinned and run an audit in CI. A transitive dependency with a known vulnerability is still a vulnerability in your image processing system, and the lockfile is what makes the audit meaningful.

Observability

Emit one structured event per image processing operation with the inputs’ shape, the outcome, and a correlation id. Track error rate and latency per component and alert on a step change rather than a single spike.

The correlation id is the thread that ties a user-visible symptom to the image processing decision and to the component log entry for the same operation. Without it, an investigation starts from a timestamp and a guess.

Watch the format encoder failure rate separately from the overall error rate. A jump in format encoder failures usually means a malformed image that triggers a decode crash and takes down the worker pool for every other request, not a bug in resize worker, and the two have different owners and different fixes.

Chart the share of image processing operations that shed, queue, or succeed. A change in the mix points at the cause faster than an aggregate latency can, because each class has a different root.

Troubleshooting

A malformed image that triggers a decode crash and takes down the worker pool for every other request. Reproduce with a minimal fixture, then add a guard test so the image processing system rejects the condition loudly.

Performance regresses under image processing load. Profile with the sampling analyzer, locate the hot path in resize worker, and add a targeted benchmark to lock the regression.

Keep the image processing dashboards separate from dependency dashboards. When an operation fails, the correlation id lets you decide in seconds whether the fault is decode pool, resize worker, or format encoder, instead of guessing from a timeout.

Limitations and next steps

• Single-region; multi-region replication is out of scope.
• The decode pool is in-process and not horizontally shared by default.
• No auth layer; assume deployment behind an edge that enforces identity.

The image processing system is single-region by design; extending to multi-region means making decode pool shareable across regions, which is a real change to the consistency model rather than a config flag. The format encoder is in-process, which is correct for one instance but must move to a shared store before scaling out.

There is no authentication or authorization layer; the system assumes it is deployed behind an edge that enforces identity. Adding one is straightforward but out of scope for this build, and doing it here would distract from the image processing correctness that is the point.

The natural next step, once the image processing pipeline is trusted in production, is to add a short-TTL cache for idempotent reads and a richer derivative planner that exports histograms rather than counters. Both are additive and neither changes the contracts this build establishes.