Description
We get a SDK client on the server by running createInstance({...})
Next.js serialize all objects to json when sending them to the client.
We then get
Error: Circular structure in "getInitialProps" result of page "/_error". https://err.sh/zeit/next.js/circular-structure
The reason is that the SDKClient has a circular structure whitch is not supported in JSON
TypeError: Converting circular structure to JSON
Creating on client at the server side and the create it again in the client browser leads to a flickering behavior, since we recreate the SDK client and the turned on feature temporary goes away until we load data in the newly created client
It would be great if you could you change your SDK client to not use circular structure, so it can be serialized.
Our created SDK client looks like this
OptimizelyReactSDKClient {
user: { id: null, attributes: {} },
isUserPromiseResolved: false,
onUserUpdateHandlers: [],
initialConfig: { sdkKey: 'DNNv456Qy6tj6TuosxyyvE' },
userPromiseResovler: [Function],
_client:
Optimizely {
clientEngine: 'react-sdk',
clientVersion: '1.0.1',
errorHandler: NoopErrorHandler {},
eventDispatcher: { dispatchEvent: [Function: dispatchEvent] },
__isOptimizelyConfigValid: true,
logger: OptimizelyLogger { messagePrefix: '' },
projectConfigManager:
ProjectConfigManager {
__updateListeners: [Array],
jsonSchemaValidator: [Object],
skipJSONValidation: false,
__configObj: null,
datafileManager: [NodeDatafileManager],
__readyPromise: [Promise] },
__disposeOnUpdate: [Function: bound ],
__readyPromise: Promise { <pending> },
decisionService:
DecisionService {
audienceEvaluator: [AudienceEvaluator],
forcedVariationMap: {},
logger: [OptimizelyLogger],
userProfileService: null },
notificationCenter:
NotificationCenter {
logger: [OptimizelyLogger],
errorHandler: NoopErrorHandler {},
__notificationListeners: [Object],
__listenerId: 1 },
eventProcessor:
LogTierV1EventProcessor {
dispatcher: [Object],
queue: [DefaultEventQueue],
notificationCenter: [NotificationCenter] },
__readyTimeouts: { '0': [Object] },
__nextReadyTimeoutId: 1 },
userPromise: Promise { <pending> },
dataReadyPromise: Promise { <pending> } }