"Buffer" polyfill bloats plugin bundles

[Dosant]

When Buffer is used in client or common code, webpack bundles a costly ~30kb polyfill. Looks like it does it per each plugin where Buffer is used. In some cases, it is possible to avoid using it in clientside code altogether, but probably we at least could share the Buffer polyfill across plugins.

Some clientside usages I found:

• Core

  kibana/src/core/public/utils/crypto/sha256.ts

  Line 164 in 3c30878

  data = Buffer.from(data, encoding);

• Canvas

  kibana/x-pack/plugins/canvas/common/lib/embeddable_dataurl.ts

  Lines 10 to 13 in 57a53db

  	export const encode = (input: Partial<EmbeddableInput>) =>
  	Buffer.from(JSON.stringify(input)).toString('base64');
  	export const decode = (serializedInput: string) =>
  	JSON.parse(Buffer.from(serializedInput, 'base64').toString());

• Enterprise Search

  kibana/x-pack/plugins/enterprise_search/public/applications/app_search/components/document_creation/document_creation_logic.ts

  Line 172 in 6f5cd00

  if (Buffer.byteLength(textInput) > MAX_UPLOAD_BYTES) {

• Fleet

  kibana/x-pack/plugins/fleet/common/services/decode_cloud_id.ts

  Line 29 in 4681a80

  decoded = Buffer.from(id, 'base64').toString('utf8');

• Fleet (should use global.Buffer to avoid webpack from polyfilling it)

  kibana/x-pack/plugins/fleet/common/services/is_valid_namespace.ts

  Line 39 in 4584a8b

  (typeof Buffer === 'function' && Buffer.from(namespace).length > 100)

• Lists (it's in the common dir. Is it actually used in the Browser?)

  kibana/x-pack/plugins/lists/common/schemas/request/import_list_item_schema.mock.ts

  Lines 19 to 21 in 9bf488e

  	export const getImportListItemAsBuffer = (input: string[]): Buffer => {
  	return Buffer.from(input.join('\r\n'));
  	};

• Maps

  kibana/x-pack/plugins/maps/public/routes/map_page/saved_map/saved_map.ts

  Line 58 in 3730dd0

  return { ...icon, svg: Buffer.from(icon.svg, 'base64').toString('utf-8') };

• Maps

  kibana/x-pack/plugins/maps/public/routes/map_page/saved_map/saved_map.ts

  Line 472 in 3730dd0

  return { ...icon, svg: Buffer.from(icon.svg).toString('base64') };

• Synthetics

  kibana/x-pack/plugins/synthetics/public/components/monitor_management/action_bar/action_bar.tsx

  Line 68 in 80a2aa1

  id: monitorId ? Buffer.from(monitorId, 'base64').toString('utf8') : undefined,

• Synthetics

  kibana/x-pack/plugins/synthetics/public/components/monitor_management/monitor_list/actions.tsx

  Line 48 in 80a2aa1

  href={`${basePath}/app/uptime/edit-monitor/${Buffer.from(id, 'utf8').toString('base64')}`}

• Synthetics

  kibana/x-pack/plugins/synthetics/public/pages/monitor_management/edit_monitor.tsx

  Line 34 in a4a0822

  return getMonitor({ id: Buffer.from(monitorId, 'base64').toString('utf8') });

• [ ]
• Data (should be easy to remove. Trying now) [data][bfetch] Avoid using Buffer in client code #107278 (review)

  kibana/src/plugins/data/common/field_formats/converters/string.ts

  Line 98 in 3c30878

  return Buffer.from(val, 'base64').toString('utf8');

• Bfetch (should be easy to remove. Trying now) [data][bfetch] Avoid using Buffer in client code #107278 (review)
  

  kibana/src/plugins/bfetch/public/streaming/inflate_response.ts

  Line 12 in 3c30878

  const buff = Buffer.from(response, 'base64');

• Possibly other

[elasticmachine]

Pinging @elastic/kibana-operations (Team:Operations)

[elasticmachine]

Pinging @elastic/kibana-core (Team:Core)

[elasticmachine]

Pinging @elastic/kibana-app-services (Team:AppServices)

[afharo]

While I agree that we should avoid using it, I created #130877 to move those polyfills to the UI Shared Deps.

[pgayvallet]

@afharo with the polyfills being included in the shared deps, should we close this issue?

[afharo]

I wonder if we should keep it open to actually avoid using them and remove them from the shared deps. What do you think?

[elasticmachine]

Pinging @elastic/kibana-presentation (Team:Presentation)

[elasticmachine]

Pinging @elastic/fleet (Team:Fleet)

[elasticmachine]

Pinging @elastic/security-solution (Team: SecuritySolution)

[elasticmachine]

Pinging @elastic/uptime (Team:uptime)

[elasticmachine]

Pinging @elastic/kibana-gis (Team:Geo)

[afharo]

@pgayvallet I just ran an audit of all the places where it's used and pinged all the teams. If we think the effort is not worth it for reducing 40kB of page bundle load. I'd vote for closing the issue. @elastic/kibana-operations what do you think?

[spalger]

If we can get the work done to remove the buffer usage we could prevent it from being re-added with some basic Webpack config changed.

[pgayvallet]

@afharo agreed, let's close this.