Setting up LangSmith tracing in LangChain - Performance Optimization Steps

Performance: Setting up LangSmith tracing

MEDIUM IMPACT

This affects the runtime overhead and network latency during LangChain operations by adding tracing calls.

Adding tracing to monitor LangChain calls

LangChain

import { LangChainTracer } from "@langchain/core/tracers/langchain";
import { Client } from "langsmith";
const client = new Client();
const tracer = new LangChainTracer({
  client,
  projectName: "important",
  samplingRate: 0.1
});
result = await model.invoke("some input", { callbacks: [tracer] });

Selective tracer with sampling reduces traces sent asynchronously, minimizing overhead.

📈 Performance GainLowers network/processing load, improving interaction responsiveness (INP)

Adding tracing to monitor LangChain calls

LangChain

(window as any).LANGCHAIN_TRACING_V2 = "true";
(window as any).LANGCHAIN_API_KEY = "lsv2_...";
// Every LangChain call (e.g., model.invoke()) will send full trace data
result = await model.invoke("some input");

Global tracing enabled without sampling or filtering, causing every call to queue and send full trace data.

📉 Performance CostAdds processing and network latency on every call, increasing JS execution time and INP

Performance Comparison

Pattern	DOM Operations	Reflows	Paint Cost	Verdict
Global tracing enabled for all events	Minimal	0	Minimal	[X] Bad
Selective async tracing with sampling	Minimal	0	Minimal	[OK] Good

Rendering Pipeline

Tracing calls add extra JavaScript execution and network requests during LangChain operations, affecting the interaction responsiveness stage.

→JavaScript Execution

→Network

→Idle

⚠️ BottleneckUnfiltered tracing creates frequent network requests and JS overhead during interactions.

Core Web Vital Affected

INP

This affects the runtime overhead and network latency during LangChain operations by adding tracing calls.

Optimization Tips

1Avoid global tracing for all events; use selective callbacks.

2Set samplingRate < 1.0 to reduce trace volume.

3Monitor interaction responsiveness (INP) when enabling tracing.

Performance Quiz - 3 Questions

What is the main performance impact of enabling LangSmith tracing globally on every LangChain call?

A Reduces network requests by batching traces

B Improves page load speed by caching traces

C Increases interaction latency by adding JS and network overhead

D Has no impact on performance

DevTools: Performance

How to check: Record a performance profile while running LangChain operations with tracing enabled. Look for long tasks and network requests during interaction.

What to look for: Check for blocking network calls and long JavaScript execution times that increase INP.