feat: add ability to bootstrap flags on server and populate clients#475
feat: add ability to bootstrap flags on server and populate clients#475
Conversation
roncohen
left a comment
There was a problem hiding this comment.
would be nice with examples of how to use boostrapped flags in the browser, react and vue READMEs. Tip for next time: when building libraries like these it often makes sense to start with the README examples before writing the code to make sure the DX drives the implementation instead of the other way around.
There was a problem hiding this comment.
Pull Request Overview
This pull request introduces comprehensive support for bootstrapping the Reflag browser SDK with pre-fetched flag data, enabling faster initialization for server-side rendered applications. It also refactors context management for improved efficiency, adds SDK lifecycle methods, and updates documentation and tooling.
- Adds
ReflagBootstrappedProviderandReflagClientProvidercomponents for Vue and React SDKs - Implements deep equality checks to prevent unnecessary context updates and API calls
- Introduces SDK state management with lifecycle methods (
initialize,stop,getState)
Reviewed Changes
Copilot reviewed 71 out of 77 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/vue-sdk/src/ReflagBootstrappedProvider.vue | New component for bootstrapping Vue apps with pre-fetched flags |
| packages/vue-sdk/src/ReflagClientProvider.vue | New component for using pre-initialized clients in Vue apps |
| packages/vue-sdk/src/hooks.ts | Refactored hooks with new useReflagClient and useClientEvent composables |
| packages/react-sdk/src/index.tsx | Major refactor adding bootstrap providers and improving context handling |
| packages/browser-sdk/src/client.ts | Enhanced client with state management, deep equality checks, and bootstrap support |
| packages/node-sdk/src/client.ts | Added getFlagsForBootstrap method for server-side flag pre-fetching |
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
- fix cloning of context object due to vue proxy - updated readme with new sections - renamed useClientEvent to useOnEvent
This pull request introduces support for bootstrapping the Reflag browser SDK with pre-fetched flag data, enabling faster initialization for server-side rendered applications. It also refactors context management for improved efficiency, adds SDK lifecycle methods, and updates documentation and tooling. The most important changes are grouped below.
Bootstrapping and SSR support:
bootstrappedFlags, allowing applications to avoid the initial network request for flags and improve performance in server-side rendering scenarios. This includes updates toInitOptions,Config, and initialization logic inReflagClient. [1] [2] [3] [4] [5]README.md) with clear instructions and examples for using bootstrapped flags in SSR setups.Context and state management improvements:
updateUser,updateCompany,updateOtherContext,updateContext) to use deep equality checks and avoid unnecessary updates, improving efficiency and reducing redundant network calls.getContext,updateContext) and to update flags directly (updateFlags). [1] [2]SDK lifecycle management:
idle,initializing,initialized,stopped) and corresponding methods (initialize,stop,getState). [1] [2]Tooling and dependencies:
fast-equalsdependency for deep equality checks and updated scripts inpackage.jsonfor improved test and build workflows. [1] [2].vscode/settings.jsonfor consistent formatting and improved search excludes. [1] [2]Examples and documentation:
These changes collectively enhance SDK performance, developer experience, and maintainability.