typescript 41 lines · 9 steps

A method decorator that times async calls

A configurable TypeScript decorator wraps an async method to log how long it takes, but only past a threshold.

Explained by highlit

Advanced decorators higher-order-functions async instrumentation closures

1type AsyncMethod = (...args: any[]) => Promise<any>;
2 
3function LogExecutionTime(thresholdMs = 0) {
return function <T extends AsyncMethod>(
  target: object,
  propertyKey: string | symbol,
  descriptor: TypedPropertyDescriptor<T>,
): TypedPropertyDescriptor<T> {
  const original = descriptor.value;
  if (!original) {
    throw new Error(`@LogExecutionTime can only decorate methods`);
  }
13 
  const label = `${target.constructor.name}.${String(propertyKey)}`;
15 
  descriptor.value = async function (this: unknown, ...args: unknown[]) {
    const start = performance.now();
    try {
      return await original.apply(this, args);
    } finally {
      const elapsed = performance.now() - start;
      if (elapsed >= thresholdMs) {
        console.info(`[perf] ${label} took ${elapsed.toFixed(2)}ms`);
      }
    }
  } as T;
27 
  return descriptor;
};
30}
31 
32class ReportService {
@LogExecutionTime(50)
async generate(userId: string): Promise<Buffer> {
  const rows = await this.repo.fetchRows(userId);
  return this.renderer.toPdf(rows);
}
38 
private repo!: { fetchRows(id: string): Promise<unknown[]> };
private renderer!: { toPdf(rows: unknown[]): Buffer };
41}

01 / 01

STEP 01

Walkthrough

Space play ←→ step click any line

Three takeaways

1Decorator factories take arguments and return the real decorator, letting you configure behavior per usage.
2Wrapping the original method while preserving `this` via `apply` keeps the decorated method behaving identically.
3A `finally` block guarantees timing is recorded whether the wrapped call resolves or throws.

Related explainers

typescript

import { registerLocaleData } from '@angular/common';
import localeFr from '@angular/common/locales/fr';
import localeFrExtra from '@angular/common/locales/extra/fr';
import localeDe from '@angular/common/locales/de';

Locale-aware bootstrapping in Angular

i18n localization dependency-injection

Intermediate 8 steps

python

from fastapi import FastAPI, WebSocket, WebSocketDisconnect
 
app = FastAPI()

Building a WebSocket chat with FastAPI

websockets broadcast connection-management

Intermediate 9 steps

typescript

import { Module } from '@nestjs/common';
import { ConfigModule } from '@nestjs/config';
import * as Joi from 'joi';

Validating env config at boot in NestJS

configuration schema-validation environment-variables

Intermediate 8 steps

javascript

function evaluate(expression) {
  const tokens = tokenize(expression);
  let pos = 0;

Building a recursive descent calculator

parsing recursion operator-precedence

Intermediate 8 steps

typescript

import { Inject, Injectable, Logger } from '@nestjs/common';
import { CACHE_MANAGER } from '@nestjs/cache-manager';
import { Cache } from 'cache-manager';
import { InjectRepository } from '@nestjs/typeorm';