Cache interceptor in NestJS - Performance & Optimization

Performance: Cache interceptor

MEDIUM IMPACT

This affects server response time and client perceived load speed by reducing repeated processing and data fetching.

Serving repeated API responses efficiently

NestJS

import { CacheInterceptor, ExecutionContext, Injectable } from '@nestjs/common';

@Injectable()
export class CustomCacheInterceptor extends CacheInterceptor {
  trackBy(context: ExecutionContext): string | undefined {
    const request = context.switchToHttp().getRequest();
    return request.url; // Cache key based on URL
  }
}

Caches responses for repeated requests, reducing server processing and speeding up response delivery.

📈 Performance GainSaves full processing on repeated requests, reducing LCP and server CPU load.

Serving repeated API responses efficiently

NestJS

import { Injectable, NestInterceptor, ExecutionContext, CallHandler } from '@nestjs/common';
import { Observable } from 'rxjs';

@Injectable()
export class NoCacheInterceptor implements NestInterceptor {
  intercept(context: ExecutionContext, next: CallHandler): Observable<any> {
    // Always process request without caching
    return next.handle();
  }
}

Every request triggers full processing and database calls, increasing server load and response time.

📉 Performance CostBlocks response for full processing each time, increasing LCP and server CPU usage.

Performance Comparison

Pattern	DOM Operations	Reflows	Paint Cost	Verdict
No cache interceptor	N/A (server-side)	N/A	N/A	[X] Bad
Cache interceptor with URL key	N/A (server-side)	N/A	N/A	[OK] Good

Rendering Pipeline

The cache interceptor short-circuits server processing by returning cached data, reducing backend response time and improving client load speed.

→Server Processing

→Network Transfer

→Client Rendering

⚠️ BottleneckServer Processing

Core Web Vital Affected

LCP

This affects server response time and client perceived load speed by reducing repeated processing and data fetching.

Optimization Tips

1Use cache interceptors to reduce repeated server processing for identical requests.

2Customize cache keys to maximize cache hit accuracy and efficiency.

3Monitor cache hit rates and response times to ensure caching improves performance.

Performance Quiz - 3 Questions

How does using a cache interceptor in NestJS affect server response time?

A It has no effect on server response time.

B It increases server processing by adding extra steps for caching.

C It reduces server processing by returning cached responses for repeated requests.

D It delays responses to ensure cache consistency.

DevTools: Network

How to check: Open DevTools, go to Network tab, observe repeated API calls and their response times with and without cache interceptor.

What to look for: Look for faster response times and fewer full data fetches indicating cache hits.

Practice

1. What is the main purpose of the CacheInterceptor in NestJS?

easy

A. To handle authentication and authorization

B. To store responses and speed up repeated requests

C. To log all incoming requests

D. To format response data before sending

Solution

1. Step 1: Understand the role of CacheInterceptor

   The CacheInterceptor caches HTTP responses to avoid recomputing them on repeated requests.

2. Step 2: Compare with other options

   Logging, authentication, and formatting are handled by other interceptors or middleware, not CacheInterceptor.

3. Final Answer:

   To store responses and speed up repeated requests -> Option B

4. Quick Check:

   CacheInterceptor caches responses = C [OK]

Hint: CacheInterceptor caches responses to speed up requests [OK]

Common Mistakes:

• Confusing CacheInterceptor with logging interceptors
• Thinking it handles security tasks
• Assuming it formats data

2. Which of the following is the correct way to apply the CacheInterceptor to a controller method in NestJS?

easy

A. Add CacheInterceptor in the constructor of the controller

B. @Cacheable() decorator on the method

C. @UseInterceptors(CacheInterceptor) above the method

D. Use @CacheInterceptor() as a method parameter

Solution

1. Step 1: Recall how to apply interceptors in NestJS

   Interceptors are applied using the @UseInterceptors() decorator above methods or controllers.

2. Step 2: Check each option

   Only @UseInterceptors(CacheInterceptor) above the method uses the correct decorator syntax. Options B, C, and D are invalid or do not exist in NestJS.

3. Final Answer:

   @UseInterceptors(CacheInterceptor) above the method -> Option C

4. Quick Check:

   UseInterceptors decorator = A [OK]

Hint: Use @UseInterceptors(CacheInterceptor) to apply caching [OK]

Common Mistakes:

• Using non-existent @Cacheable decorator
• Trying to inject interceptor in constructor
• Passing interceptor as method parameter

3. Given this code snippet, what will be the output on the second request to /hello?

import { Controller, Get, UseInterceptors } from '@nestjs/common';
import { CacheInterceptor } from '@nestjs/cache-manager';

@Controller()
export class HelloController {
  private count = 0;

  @UseInterceptors(CacheInterceptor)
  @Get('hello')
  getHello() {
    this.count++;
    return `Hello count: ${this.count}`;
  }
}

medium

A. "Hello count: 1" first request, "Hello count: 2" second request

B. Error because count is private

C. "Hello count: 0" on both requests

D. "Hello count: 1" on first and second request

Solution

1. Step 1: Understand CacheInterceptor behavior

   CacheInterceptor caches the response of the first request and returns it for subsequent requests without calling the method again.

2. Step 2: Analyze the count variable increment

   On the first request, count increments to 1 and returns "Hello count: 1". On the second request, the cached response is returned, so count does not increment again.

3. Final Answer:

   "Hello count: 1" on first and second request -> Option D

4. Quick Check:

   Cache returns cached response = B [OK]

Hint: CacheInterceptor returns cached response, method not re-executed [OK]

Common Mistakes:

• Assuming count increments on every request
• Thinking private variables cause errors here
• Ignoring caching effect on method execution

4. Identify the error in this NestJS CacheInterceptor usage:

import { Controller, Get, UseInterceptors } from '@nestjs/common';
import { CacheInterceptor } from '@nestjs/cache-manager';

@Controller()
export class TestController {
  @UseInterceptors(CacheInterceptor())
  @Get('test')
  test() {
    return 'Test response';
  }
}

medium

A. CacheInterceptor should not be called as a function

B. Missing CacheModule import in the controller

C. Method test must be async to use CacheInterceptor

D. CacheInterceptor must be applied globally, not per method

Solution

1. Step 1: Check how CacheInterceptor is applied

   CacheInterceptor is a class, not a function, so it should be passed without parentheses to @UseInterceptors().

2. Step 2: Verify other options

   CacheModule import is required but not shown here (not an error in this snippet). Method does not need to be async. CacheInterceptor can be applied per method.

3. Final Answer:

   CacheInterceptor should not be called as a function -> Option A

4. Quick Check:

   Use class name without () = A [OK]

Hint: Pass CacheInterceptor class, not call it as function [OK]

Common Mistakes:

• Calling CacheInterceptor with parentheses
• Assuming method must be async
• Thinking CacheModule import error here

5. You want to customize the cache key for a route in NestJS using CacheInterceptor. Which approach correctly achieves this?

hard

A. Extend CacheInterceptor and override the trackBy method to return a custom key

B. Pass a custom key string directly to @UseInterceptors(CacheInterceptor)

C. Set a custom key in the controller constructor

D. Use @CacheKey('customKey') decorator on the method

Solution

1. Step 1: Understand how to customize cache keys

   CacheInterceptor allows customization by extending it and overriding the trackBy method to define how keys are generated.

2. Step 2: Evaluate other options

   Passing a string to @UseInterceptors() is invalid. Setting keys in constructor or using @CacheKey decorator does not exist in NestJS.

3. Final Answer:

   Extend CacheInterceptor and override the trackBy method to return a custom key -> Option A

4. Quick Check:

   Override trackBy method = D [OK]

Hint: Override trackBy method in extended CacheInterceptor [OK]

Common Mistakes:

• Trying to pass key directly to decorator
• Using non-existent @CacheKey decorator
• Setting keys in constructor instead of method