Best practices for performance

Use these best practices to maximize the performance of your custom JavaScript code.

Although many performance benefits come out of the box with EdgeWorkers, you should still develop your custom code with these tips in mind.

Use the right events

Tip: Reduce EdgeWorkers invocations by using onOrigin* events.

EdgeWorkers granular event model lets you control when to execute code. EdgeWorkers are only invoked on the events that you implemented. Although the EdgeWorkers overhead is minimal, you avoid any performance cost for events that you did not implement.

Every hit triggers the onClientRequest and onClientResponse events. The onOriginRequest and onOriginResponse events are only triggered when going forward to origin.

For example, when creating an EdgeWorkers function, you have two options to remove a set of HTTP response headers on all static assets. Let's assume there are 100 million requests, with 98% offload.
  • Option A: Implement onOriginResponse and only trigger the EdgeWorkers function on cache misses.
  • Option B: Implement onClientResponse and trigger the EdgeWorkers function on all Edge hits.
Event handler Edge hits (100M) Origin hits (2M)
onClient Response 100M EdgeWorkers invocations 0 EdgeWorkers invocations
onOriginResponse 0 EdgeWorkers 2 M EdgeWorkers invocations
100 million images at the Edge with 98% offload.
Picking option A, onOriginResponse invokes your EdgeWorkers function only 2 million times. If you pick onClientResponse the EdgeWorkers function would trigger 100 million times.

Avoid empty events

Tip: Prevent empty events from adding overhead to requests.
EdgeWorkers are invoked if the event handler is present in your code bundle, even if the handler is empty. These three examples still add EdgeWorkers overhead to every request, as the code bundle exports the onClientResponse() function.
export onClientResponse(request, response)(){
	//commented out
}
export onClientResponse(request, response)(){} //empty
export onClientResponse(request, response)(){
	if(request.getHeader(‘debug’)[0]==’secret’){
		//conditional invocation
	}
}

Use JSON parsing

Tip: Use JSON.parse(‘string’) to instantiate larger JSON objects.
The way you instantiate the JSON object impacts your runtime performance, especially with larger objects. Using the JSON.parse(‘string’) function is significantly faster than using the JavaScript object literal.
//Slower: JavaScript object literal 
const dataJson = {"hello": "world", "foo": "bar"}
//Faster: JSON.parse(string) 
const dataJson = JSON.parse('{"hello": "world", "foo": "bar"}')

You can find more information about JSON parsing here.

Reduce code bundle size

Tip: Deploy smaller code bundles to reduce invocation time.

Remove any unnecessary or dead code from your code bundles. Treeshaking can be automated using modern bundlers like Rollup to create lean ES2015 modules. Read the EdgeWorkers Use Case: Store Locator blog to learn how to use npm and rollup to add JavaScript libraries to your EdgeWorkers scripts.

You should also use the smallest library that provides the functionality you need to achieve your use case.

Parallelise subrequests

Tip: Invoke multiple HTTP sub-requests in parallel.
Evaluate if you can parallelise your subrequests before handling their responses. This is faster than doing them one by one in series. Remember to take into account the limits for concurrent HTTP sub-requests per event handler.
// Two subrequests triggered and handled in series
const responseA = await httpRequest($endPointA);
let jsonA = await responseA.json();

const responseB = await httpRequest($endPointB);
let jsonB = await responseB.json();
// Two subrequests triggered in parallel, handled in series
const responseA = await httpRequest($endPointA);
const responseB = await httpRequest($endPointB);

let jsonA = await responseA.json();
let jsonB = await responseB.json();

Cache subrequests

Tip: Cache individual subrequests.

When possible use Edge caching to make individual subrequests fast so your actual request is not slowed down.

You can control these settings outside of your EdgeWorker in Property Manager, PAPI, and origin headers. Learn more about caching and caching features such as cache prefreshing and cache ID modification in our Property Manager documentation.

Cache responseProvider output

Tip: Cache the output of your responseProvider.

When possible use Edge caching to serve the output of your responseProvider.

You can control these settings outside of your EdgeWorker in Property Manager, PAPI, and origin headers. Learn more about caching and caching features such as cache prefreshing and cache ID modification in our Property Manager documentation.