Unifying Flutter’s Web Presence: Migrating to a Dart-Based Stack with Jaspr

Introduction

Flutter’s official websites—dart.dev, flutter.dev, and docs.flutter.dev—have long served as critical resources for developers. Yet until recently, they were built on a disjointed set of technologies that made maintenance and innovation unnecessarily complex. That era has ended. The team has migrated all three sites to Jaspr, an open-source web framework built entirely with Dart. This transformation delivers a unified technical stack, reduces onboarding friction, and opens the door to richer interactivity—all while keeping the language that Flutter developers already know at the core.

This article explores why the old approach became unsustainable, how Jaspr solved the key pain points, and what the migration means for contributors and visitors alike.

The Fragmented Landscape of the Old Websites

Before the migration, the Flutter and Dart documentation sites ran on Eleventy, a Node.js-based static-site generator. Meanwhile, the main flutter.dev site relied on Wagtail, a content management system built with Python and Django. This split created a fragmented developer experience: any contributor who wanted to improve the sites had to be comfortable with both Node.js and Python tooling, on top of understanding the Dart and Flutter internals that powered interactive components.

The situation grew more complicated over time. A small amount of Dart code already existed for interactive elements—like code samples and in-browser editors—but those pieces were isolated. Sharing logic between the two site stacks was nearly impossible. Each new interactive feature required custom, imperative DOM manipulation, which was hard to maintain and inconsistent across pages. The team’s ambitions for richer tutorials, quizzes, and live examples only highlighted the limits of the old setup.

The Cost of Fragmentation

• Higher setup overhead: New contributors had to install and configure Node.js or Python environments depending on which site they wanted to modify.
• Inconsistent code sharing: Common UI patterns or data transformations had to be reimplemented in multiple languages.
• Slow iteration: Adding a new interactive widget meant writing low-level JavaScript, without the benefits of Dart’s type system or Flutter’s component model.
• Steeper learning curve: Developers had to learn Eleventy’s templating, Wagtail’s CMS logic, and Python’s ecosystem, even if they were Flutter experts.

Goals for the Migration

The team set out to find a replacement that would:

1. Unify all three websites under a single, Dart-based framework.
2. Eliminate the need for Node.js or Python expertise to contribute content or components.
3. Enable richer interactive features without resorting to imperative DOM code.
4. Maintain excellent performance for static pages while supporting dynamic elements where needed.

After evaluating several options, Jaspr emerged as the clear winner.

Why Jaspr? A Dart Web Framework That Feels Like Flutter

Jaspr is a versatile Dart framework that supports server-side rendering (SSR), client-side rendering (CSR), and static site generation (SSG). It was designed to be familiar to any Flutter developer, while remaining fully compatible with the DOM-based web model. Here are the key reasons Jaspr was chosen:

Familiar Component Model

Jaspr’s component API mirrors Flutter’s StatelessWidget and StatefulWidget patterns. A developer who has written a Flutter widget can immediately understand a Jaspr component. For example, a simple feature card looks like this:

class FeatureCard extends StatelessComponent {
  const FeatureCard({
    required this.title,
    required this.description,
    super.key,
  });

  final String title;
  final String description;

  @override
  Component build(BuildContext context) {
    return div(classes: 'feature-card', [
      h3([text(title)]),
      p([text(description)]),
    ]);
  }
}

This code is nearly identical to a Flutter widget, but it generates real HTML elements. The reuse of BuildContext, super.key, and the build pattern means contributors can apply their existing Flutter expertise directly to website development.

Unified Ecosystem

Because Jaspr is written in Dart and runs on the same runtime, all three websites now share a single language and toolchain. Developers can write reusable components once and use them across dart.dev, flutter.dev, and docs.flutter.dev. There’s no need to switch between package managers or language ecosystems.

Flexible Rendering Modes

Jaspr’s support for SSG is perfect for documentation pages that are mostly static. For interactive sections—such as live code editors or quizzes—CSR can be enabled on specific components without sacrificing the rest of the page’s performance. SSR is also available for content that needs to be indexed by search engines but still have dynamic data.

Implementation and Results

The migration was carried out incrementally. The team first rebuilt the documentation sites under Jaspr’s SSG mode, then ported the flutter.dev CMS content into Jaspr’s component system. Throughout the process, they reused existing Dart libraries for syntax highlighting, markdown rendering, and analytics.

Developer experience improved dramatically. New contributors only need Dart installed to work on any of the sites. The component model encourages modular, testable code. Interactive features that once required messy JavaScript are now cleanly implemented as Jaspr components with state management and lifecycle hooks.

Performance stayed on par or improved. Static pages are pre-rendered to HTML, so load times remain fast. The framework’s small JavaScript footprint for interactive parts keeps page weight low.

Conclusion: A Future Built on Dart

By adopting Jaspr, the Flutter team has eliminated the fragmented toolchain that hampered progress. The three flagship websites now share a modern, Dart-powered foundation that encourages contributions, simplifies maintenance, and supports richer user experiences. For developers interested in building web interfaces with Dart (beyond standard Flutter web apps), Jaspr provides a seamless path forward—one that feels like writing Flutter but produces real HTML and CSS.

The migration proves that a unified stack isn’t just a luxury; it’s a strategic advantage. When your tools speak the same language, innovation becomes simpler, faster, and more inclusive.