How Flutter’s Websites Got a Unified Makeover with Dart and Jaspr
In a major shift, the Flutter team has migrated its three primary websites—dart.dev, flutter.dev, and docs.flutter.dev—from a fragmented mix of technologies to a single, Dart-powered stack built on the open-source framework Jaspr. This move simplifies contributions, reduces tooling complexity, and unlocks richer interactivity. Below, we answer your burning questions about the migration.
Why did Flutter rebuild its websites using Jaspr?
The main motivation was to eliminate the fragmented and unfamiliar technical stack that previously powered the sites. The documentation sites (dart.dev and docs.flutter.dev) were built with Eleventy, a Node.js-based static-site generator, while flutter.dev relied on Wagtail, a Python-based CMS. This meant contributors needed expertise in both Node.js and Python, outside the Dart ecosystem. The team wanted a unified, consistent developer experience where only Dart knowledge was required. By migrating to Jaspr, a Dart web framework, they achieved exactly that—reducing setup friction and enabling code sharing across all three sites.
What was the previous technical stack for Flutter's websites?
Before the migration, the sites ran on two separate systems. The documentation websites (dart.dev and docs.flutter.dev) used Eleventy, a static-site generator built on Node.js. Meanwhile, the main flutter.dev site was powered by Wagtail, a content management system built with Python and Django. This fragmentation meant that any update or new feature required familiarity with multiple languages and tools. While some interactive components were already written in Dart, the overall stack prevented seamless reuse. The team found that maintaining these divergent setups grew increasingly complex and time-consuming, especially as they aimed to add richer interactivity like quizzes and advanced code samples.
How does Jaspr unify the development experience?
Jaspr is a versatile Dart web framework that supports client-side rendering, server-side rendering, and static site generation. By adopting Jaspr for all three websites, the team created a single, uniform stack that relies entirely on Dart. This means anyone contributing to any of the sites only needs to know Dart—no separate Node.js, Python, or other dependencies. The framework’s component model feels natural to Flutter developers, further lowering the learning curve. With Jaspr, interactive features like code samples and quizzes can be built using familiar Dart code rather than one-off imperative DOM logic. The result is a consistent developer workflow, easier onboarding, and more maintainable codebase across the entire Flutter web presence.
Why was Jaspr chosen over other Dart web frameworks?
Jaspr stood out for several reasons, especially its Flutter-friendly design. The framework’s component model mirrors Flutter widgets, making it instantly familiar to Flutter developers. It also offers multiple rendering options—client-side, server-side, and static site generation—giving the team flexibility. Additionally, Jaspr is open source and built with Dart, aligning with the team’s goal of a unified Dart stack. Unlike other frameworks, Jaspr allowed the team to leverage existing Flutter skills directly without learning a new paradigm. Its DOM-based approach (using HTML and CSS) ensures compatibility with standard web practices while still feeling natural to anyone who has written a Flutter widget. This combination of familiarity, flexibility, and simplicity made Jaspr the ideal choice.
How do Flutter developers benefit from Jaspr's component model?
Flutter developers will find Jaspr’s component model remarkably familiar. In Jaspr, components are written similarly to Flutter widgets—using a build method that returns a tree of UI elements. For example, a FeatureCard component in Jaspr looks almost identical to a Flutter stateless widget, but produces DOM elements like div and h3 instead of Flutter render objects. This means developers can apply their existing Flutter knowledge directly to web development without learning a new framework. It also allows for code reuse between Flutter mobile/web apps and Jaspr-built websites. The component model promotes a clean, declarative approach to building user interfaces, making it easy to create reusable, interactive elements like code samples, quizzes, and navigation components.
What are the main benefits of the new unified stack?
The migration to a unified Dart + Jaspr stack brings several key benefits. First, reduced tooling complexity: contributors only need Dart, eliminating the need for Node.js or Python environments. Second, consistent development experience across all three sites, making it easier for the team to maintain and extend features. Third, improved interactivity—Jaspr makes it straightforward to add dynamic elements like quizzes, interactive code samples, and richer documentation. Fourth, better code sharing; previously, each site had its own set of libraries, but now Dart code can be reused between sites and even with Flutter apps. Finally, the stack is future-proof: as the team’s needs grow, Jaspr’s support for different rendering modes (SSR, CSR, static) allows them to adapt without overhauling the entire architecture.