web-fragments
Advanced tools
Web Fragments are a radically new approach to Web micro-frontends which is framework, tooling, and platform agnostic.
New to micro-frontends? Check out https://microfrontend.dev
[!NOTE] The project is in beta, but is already being used in production by teams at Cloudflare. We are looking for teams and companies interested in providing early feedback that can help us shape the feature set and APIs.
The main goal of Web Fragments is to enable teams operating enterprise web frontends so they can:
Unlike other micro-frontend technologies, Web Fragments focuses on isolating individual micro-frontends from each other by executing their client-side JavaScript in separate JavaScript context, while enabling them to share the same DOM document, browser navigation and history.
Just like Docker enables containerization of applications, Web Fragments enable containerization of web frontends on the client-side, and by extension also on the server-side.
This JavaScript execution context isolation and low-overhead virtualization enables large monolithic web frontends to be broken up into smaller, independently developed and released web applications, that in production are composed into a single cohesive UI. In this way Web Fragments enable scaling and incremental modernization of the frontend tech stack.
The best way to learn more is going to our official documentation.
You can also check out the demos present in this repository where you can find examples e2e/pierced-react/README.md for platforms supporting Web Fetch API like Cloudflare or Netlify, or e2e/node-servers/README.md for platforms supporting Node.js runtimes.
We blogged about the philosophy of our approach and published some early research on the Cloudflare blog. You can check out a post introducing the previous generation of Web Fragments: https://blog.cloudflare.com/better-micro-frontends.
We also blogged about how Web Fragments can enable incremental adoption of micro-frontends: https://blog.cloudflare.com/fragment-piercing
Incremental adoption of micro-frontends with Cloudflare Workers
Large frontend applications are often hard to improve without major investments. With Cloudflare Workers, our fragment-based micro-frontend architecture, and fragment piercing technique, engineering teams can incrementally improve large frontends in a fraction of the time, yielding significant user and developer experience gains.
This research and development is sponsored by Cloudflare:
FAQs
<!-- prettier-ignore -->
The npm package web-fragments receives a total of 525 weekly downloads. As such, web-fragments popularity was classified as not popular.
We found that web-fragments demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 5 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Socket CEO Feross Aboukhadijeh joins Insecure Agents to discuss CVE remediation and why supply chain attacks require a different security approach.
Security News
Tailwind Labs laid off 75% of its engineering team after revenue dropped 80%, as LLMs redirect traffic away from documentation where developers discover paid products.
Security News
The planned feature introduces a review step before releases go live, following the Shai-Hulud attacks and a rocky migration off classic tokens that disrupted maintainer workflows.
