Edge Function
Serverless code that runs at CDN edge locations, close to users. Handles request/response transformation, A/B testing, auth, and dynamic content without a round trip to origin. Also called edge workers or edge compute.
Full Explanation
Edge functions let you run custom code at every CDN PoP. Instead of routing a request to your origin for processing, the edge handles it in milliseconds. This is the evolution from CDNs as dumb caches to CDNs as programmable platforms.
Common use cases: A/B testing (rewrite the response at the edge based on a cookie), authentication (validate JWT before forwarding to origin), personalization (inject user-specific content into a cached template), redirects (handle thousands of redirect rules without origin involvement), and API routing.
The main platforms: Cloudflare Workers (V8 isolates, JavaScript/Wasm), Fastly Compute (Wasm), AWS CloudFront Functions and Lambda@Edge, Vercel Edge Functions, and Deno Deploy. Each has different runtime constraints, cold start characteristics, and pricing models.
Examples
# Cloudflare Worker: A/B testing at the edge
export default {
async fetch(request) {
const url = new URL(request.url);
const bucket = request.headers.get('cookie')?.includes('ab=b') ? 'b' : 'a';
if (bucket === 'b') {
url.pathname = '/experiment' + url.pathname;
}
const response = await fetch(url, request);
const resp = new Response(response.body, response);
resp.headers.set('Set-Cookie', `ab=${bucket}; path=/`);
return resp;
}
};
# CloudFront Function: add security headers
function handler(event) {
var response = event.response;
response.headers['x-frame-options'] = {value: 'DENY'};
return response;
}Video Explanation
Frequently Asked Questions
Serverless code that runs at CDN edge locations, close to users. Handles request/response transformation, A/B testing, auth, and dynamic content without a round trip to origin. Also called edge workers or edge compute.
# Cloudflare Worker: A/B testing at the edge
export default {
async fetch(request) {
const url = new URL(request.url);
const bucket = request.headers.get('cookie')?.includes('ab=b') ? 'b' : 'a';
if (bucket === 'b') {
url.pathname = '/experiment' + url.pathname;
}
const response = await fetch(url, request);
const resp = new Response(response.body, response);
resp.headers.set('Set-Cookie', `ab=${bucket}; path=/`);
return resp;
}
};
# CloudFront Function: add security headers
function handler(event) {
var response = event.response;
response.headers['x-frame-options'] = {value: 'DENY'};
return response;
}Related CDN concepts include:
- Edge Server — A CDN server located at the network edge, close to end users. Handles caching, SSL …
- Cache-Control — The primary HTTP header for controlling caching behavior. Tells browsers, CDNs, and proxies whether to …
- CDN (Content Delivery Network) (CDN) — A distributed network of servers that caches and delivers content from locations close to end …
- ESI (ESI) — Edge Side Includes. A markup language for assembling pages from fragments at the CDN edge. …