Option to bundle-split pega-component-map

[wimbarelds]

Is your feature request related to a problem? Please describe. I am using react-sdk-components to embed Pega views inside a non-pega Portal, but when importing from either react_pconnect.jsx or sdk_component_map.js, my bundle-size balloons to over 1.5 MB (Minified). From what I can tell, this is because sdk-pega-component-map.js and all components on that map are loaded unconditionally- whether a given component is or is not available on the sdk-content-server, or on the local component map.

Am I doing something wrong here? If not, can either alternate options be made available?

Describe the solution you'd like

This is not strictly what I want to happen, but merely one way to solve this issue. If in sdk-pega-component-map.js, the following:

import SomeComponent from './SomePath/SomeComponent.jsx';
const pegaSdkComponentMap = {
  'SomeComponent': SomeComponent,
  ...,
}

Were changed to something like:

import { lazy } from 'react';

const pegaSdkComponentMap = {
  'SomeComponent': lazy(() => import('./SomePath/SomeComponent.jsx')),
  ...,
}

Only components that are not available from the SDK content server and the local component map would be loaded.

Describe alternatives you've considered Outside of not using the sdk-component-map and react_pconnect, I dont think there are any alternatives(?).

A colleague of mine did notice that the (not embedded) Portal does not have this same issue, and instead appears to load components as needed.

Additional context Add any other context or screenshots about the feature request here.

[wimbarelds]

I just got done updating to all the latest versions, and the issue has gotten worse.

When I npx @pega/dx-component-builder-sdk create a Text-Input component, the custom-sdk version of that component uses import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';, which in turn imports all other components through the component map, causing the bundles generated for this, and other custom components to be >= 1.5 MiB in filesize.

[niallriddell]

Thanks for using our react sdk components. We're reviewing your feedback within the team and we will revert back as soon as we've completed this.

[wimbarelds]

Thanks for responding! With regards to the issue of all compponents being included in individual component bundles; it seems to me like using some kind of context provider for the component map would be ideal.

Though, this itself doesn't resolve that the base-bundle when importing PConnect also already has this issue.

A good solution would be to have the PConnect Component also use useContext(ComponentMapContext), and to separate generating of the sdk component map (also allowing developers to provide their own implementation for the component map).