MDN moves from React to Lit
MDN’s frontend overhaul is shifting away from React toward Lit Web Components and a Design System Documentation approach intended for server-side rendering. The change has sparked discussion about framework evolution and standards in frontend teams. (x.com) (x.com)
MDN says it rebuilt its frontend around Lit web components and server-rendered HTML after years of maintaining a React codebase it described as painful to change. (developer.mozilla.org) In an April 8, 2026 engineering post, MDN said the previous site frontend, called Yari, was a React app that had grown out of a Create React App setup into an “extremely complicated” Webpack build with “hacky” scripts and tangled Sass and CSS. (developer.mozilla.org) MDN said its content pipeline already starts with Markdown, converts pages into HTML and JSON metadata, and then assembles finished pages on the server before shipping HTML, CSS, and JavaScript from cloud buckets. (developer.mozilla.org) A web component is a custom HTML element with its own behavior and styling, packaged so it can be reused without colliding with the rest of a page. MDN defines the model as custom elements, shadow DOM, and HTML templates working together. (developer.mozilla.org) Lit is one way to build those components. The project describes itself as a lightweight library for web components, and its repository had about 21,400 GitHub stars when checked this week. (github.com) Server-side rendering means a site sends finished HTML first, instead of waiting for browser JavaScript to build the page after load. Lit’s documentation says that approach can improve performance, robustness, and crawler support, and that Lit SSR renders templates in Node. (lit.dev) MDN said that fit its own architecture better than keeping React as a wrapper around mostly static content. The new stack lets MDN render server components such as navigation alongside web components such as its search controls, then emit HTML in Node.js. (developer.mozilla.org) The shift also lines up with MDN’s role in documenting the web platform itself. MDN describes its mission as helping developers build on open web technologies, and web components are part of that platform rather than a framework-specific abstraction. (developer.mozilla.org)