Configure the React SDK event dispatcher
The Optimizely SDKs make HTTP requests for every decision event or conversion eventdecision event or conversion event that gets triggered. The React SDK has a built-in event dispatcher for handling these events.
You can customize the event dispatcher you use in production to have more control over the way the SDK sends events so that it scales to the volumes handled by your application. Customizing the event dispatcher lets you handle large event volumes efficiently or to implement retry logic when a request fails. You can build your dispatcher from scratch or start with the provided dispatcher.
The following examples show how to initialize the Optimizely client (or manager) with an event dispatcher instance:
import { createInstance, eventDispatcher } from '@optimizely/react-sdk';
// Create an Optimizely client with the default event dispatcher
// Note: If you don't pass eventDispatcher, this default event dispatcher
// will be used automatically. This is just to demonstrate how to provide
// an event dispatcher when creating an instance.
const optimizely = createInstance({
datafile: window.datafile, // assuming you have a datafile at window.datafile
eventDispatcher: eventDispatcher,
});The event dispatcher should implement a dispatchEvent function, which takes in three arguments: httpVerb, url, and params, all of which are created by the internal EventBuilder class. In this function, you should send a POST request to the given url using the params as the body of the request (be sure to stringify it to JSON) and {content-type: 'application/json'} in the headers.
Important If you are using a custom event dispatcher, do not modify the event payload returned from Optimizely. Modifying this payload will alter your results.
Disabled event dispatcher
To disable sending all events to Optimizely's results backend, use the logOnlyEventDispatcher when creating a client:
import { createInstance, logOnlyEventDispatcher } from '@optimizely/react-sdk';
const optimizely = createInstance({
datafile: window.datafile,
eventDispatcher: logOnlyEventDispatcher,
});