Aug 30Bundler Design Trade-offs: The Rationale Behind Creating RspackBefore embarking on the development of Rspack, we explored various build tools and frameworks, including extensive use of Webpack, Vite, esbuild, and Rollup in real-world production environments. To provide some context, our team, known as the Web Infra Team, is responsible for overseeing the company’s suite of front-end build tools…Programming17 min readProgramming17 min read
Aug 29Understanding Module Federation: A Deep DiveIntroduction Module Federation is an advanced feature in Webpack (and soon Rspack) that provides a way for a JavaScript application to dynamically load code from another application. This feature allows for efficient code sharing and dependency management. …Rspack13 min readRspack13 min read
Aug 25Rspack 0.3 Release AnnouncementSince the launch of Rspack 0.2, we’ve been meticulously gathering community feedback and iterating on our offering. We’re thrilled to unveil Rspack 0.3 — a significant upgrade that amplifies flexibility, compatibility, and performance. This new release brings a series of breaking changes, major feature rollouts, and finer-grained controls, all aligned…Webpack4 min readWebpack4 min read
Aug 25The Future of Module FederationOver the past 4 years, I have encountered my fair share of limitations in Module Federation. It did the job it was built to do, import code from other bundles. …Rust10 min readRust10 min read
Published inITNEXT·Aug 24A Comprehensive Exploration of Modern Bundling Technologies and TechniquesLynx, our company’s (ByteDance) self-developed cross-platform framework (similar to React Native), has a compilation tool that diverges significantly from traditional web compilation tool chains. Unlike conventional tools, it doesn’t support dynamic styles or scripts, essentially eliminating bundleless and code splitting. …Module Bundler18 min readModule Bundler18 min read
Published inStackademic·Aug 24Rust Port of Webpack? Rspack, the New Kid on the BlockCreated by the ByteDance Web Infra team, Rspack is a Rust-based bundler. It’s known for fast performance, interoperability with the Webpack ecosystem, strong customization abilities, and defaults — letting users hit the ground running without needing to configure much. …Javascript Bundler6 min readJavascript Bundler6 min read
Mar 25, 2022Member-onlyModule Federation, Hot Prod Reloading, SSR & Next.js, for real this time.Jacob Ebey and I created the first “server-side rendering” technique for Federated Applications almost a year ago. We went with the tried and true POST-request-based network communication to load HTML, convert it into react, then replace the children in the newly minted “react” code. This approach technically worked. But as…Nextjs12 min readNextjs12 min read
Feb 2, 2022Member-onlyWhen should you leverage Module Federation, and how?Critical thinking and patterns on when, why, where, to leverage Module Federation from the creator of the technology. Webpack’s Federation is immensely useful if used properly. The tricky part is there's not much information on how and where to leverage the technology. Leading to a bit of a wild west scenario. I've been working with the technology for…Webpack11 min readWebpack11 min read
Oct 15, 2021Member-onlyNext.js and Lazy Hydration. Keep the HTML but drop the JavascriptCode splitting can only get us so far, and how it works means you end up loading a lot of JS you don't really need right then and there. Why download the footer code when I'm looking at the header? Code splitting has served us well, its lets us eliminate…Nextjs5 min readNextjs5 min read
Aug 23, 2021Member-onlyDistributed Logging in Federated Applications, with SentryWhen it comes to distributed applications, Javascript logging gets tricky. What happens when you have multiple teams owning multiple parts of a single page or component? How can you use multiple DSNs in Sentry to send logs to the owning team, not the consuming team where the error occurred? These…Distributed Systems8 min readDistributed Systems8 min read
