Configure the React SDK event dispatcher

The Optimizely SDKs make HTTP requests for every decision event or conversion event that gets triggered. The React SDK has a built-in event dispatcher for handling these events.

Minimum SDK version

v4.0.0+

For versions 3.x and earlier, see React SDK prior to v4.

Description

In v4, event processing is opt-in. You must pass an eventProcessor to createInstance to enable event dispatching. The SDK provides two built-in event processor factories:

Both processors use the SDK's built-in event dispatcher by default.

Custom event dispatcher

You can customize the event dispatcher for more control over how the SDK sends events so that it scales to the volumes handled by your application. In v4, the EventDispatcher interface uses Promises instead of callbacks:

export type EventDispatcherResponse = {
  statusCode?: number;
};

export interface EventDispatcher {
  dispatchEvent(event: LogEvent): Promise<EventDispatcherResponse>;
}

Pass a custom event dispatcher to the event processor factory:

import {
  createInstance,
  createPollingProjectConfigManager,
  createBatchEventProcessor,
} from '@optimizely/react-sdk';

const customEventDispatcher = {
  dispatchEvent(event) {
    return fetch(event.url, {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify(event.params),
    }).then((res) => ({ statusCode: res.status }));
  },
};

const optimizely = createInstance({
  projectConfigManager: createPollingProjectConfigManager({
    sdkKey: 'YOUR_SDK_KEY',
  }),
  eventProcessor: createBatchEventProcessor({
    eventDispatcher: customEventDispatcher,
  }),
});

🚧

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.

Disable event dispatching

To disable sending all events to Optimizely's results backend, simply omit the eventProcessor parameter when calling createInstance. In v4, no events are dispatched by default.