I'm currently developing a large JavaScript web SDK and I'm focused on optimizing its load speed and minimizing the bundle size. Since this SDK will be embedded by clients, I can't use ESM (which requires the module to be hosted on the same domain as the client). Therefore, I have to work with a single bundle that should function universally. I've already upgraded to Node v18, enabled tree-shaking, and attempted to create a flame graph, but given the complexity of the project, it was difficult to interpret. I'm looking for any tips or best practices to make it blazingly fast and further shrink the bundle size. Any advice would be greatly appreciated!
2 Answers
It's a bit hard to give specific advice without knowing more about your project. I recommend checking for unnecessary dependencies, reusing repetitive code, and perhaps upgrading to a newer Node version or trying out Deno or Bun for better performance.
Have you considered creating a dual build? You could ship an ESM bundle by using ``. This way, modern websites can use the leaner ESM, allowing for lazy-loading of chunks on demand. Legacy systems can stick with the traditional UMD format. This can help with both speed and size!
I'll give that a shot and get back to you! Thanks for the tip!
What kind of details do you need? I can provide a list if that helps. Thanks!