ESM output contains many duplicated helpers

[rschristian]

Description

As @docsearch/react compiles each of its files in isolation for the ESM output, the module as a whole ends up with a dozen duplicated helpers even in the most simple demonstration.

Edit: This applies for all dependencies of @docsearch/react too.

This heavily bloats the bundles of applications which use it, and bloats them needlessly.

Steps to reproduce

1. Start a Vite (though every bundler would be impacted similarly) React project, pasting the following into src/main.jsx:

import React from 'react';
import ReactDOM from 'react-dom/client';
import { DocSearch } from '@docsearch/react';

function App() {
  return (
    <DocSearch
      appId="YOUR_APP_ID"
      indexName="YOUR_INDEX_NAME"
      apiKey="YOUR_SEARCH_API_KEY"
    />
  );
}

ReactDOM.createRoot(document.getElementById('root')).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
)

3. npm run build
4. Open built JS
5. See 10 copies of the iterator helper ("Invalid attempt to destructure non-iterable instance....")

Expected behavior

That there aren't heavily duplicated helpers throughout the bundles.

This likely means moving to better build tooling, as compiling each module in isolation isn't really viable, nor has it ever been. The asset quality takes a pretty big hit when doing so.

Environment

• OS: N/A
• Browser: N/A
• DocSearch version: 3.6.0

[levimichael]

@rschristian thanks for reporting this. We just released a fix, let me know if it looks good on your end now.

[rschristian]

Marginally improved, but still a very large amount of duplication.

Looking at the bundle, there's now only 2 copies of the iterator helper ("Invalid attempt to destructure...") down from 10, but 5 copies of the spread helper ("Invalid attempt to spread..."), 14 copies of the toPrimitive helper ("@@toPrimitive must return..."), and 30 copies of the object spread polyfill (Object.getOwnPropertyDescriptors ? ... :).

Modern compression being a marvel means this isn't too egregious over the web but it does still have a large & needless impact on parse times. I wouldn't be surprised if 20%+ of the minified bundle is just duplicated helpers.

[levimichael]

Ah, I was just looking at helpers that were duplicated in the bundling of @docsearch/react itself. It appears that we are importing dependencies that also have these helpers duplicated in their bundles as well. Will require further investigation. Thanks for following up.