FlutterJS – Run Flutter code, get semantic HTML output
The Problem: Flutter Web is great for building apps, but terrible for websites. It renders everything to Canvas/WASM, which means:
2-5 MB bundles (slow on mobile)
Zero SEO – Google can't index canvas pixels
Poor accessibility (no semantic HTML for screen readers)
3-8 second initial load times
If you've ever tried to build a marketing site or blog with Flutter Web, you've hit this wall.
The Solution: FlutterJS compiles your Flutter/Dart code to semantic HTML + CSS + JavaScript instead of Canvas. Same Flutter syntax you already know, but the output is:
~50-100 KB bundles (50x smaller)
Full SEO support (real HTML elements)
Sub-1-second first paint
Accessible by default
How it works:
You write normal Flutter/Dart code
Our Dart CLI analyzes your AST and generates an Intermediate Representation (IR)
The IR gets transpiled to JavaScript with a lightweight runtime
Output is semantic HTML that search engines can index
Current Status: Beta (v0.9.x). We support the most common Material widgets (Scaffold, AppBar, Text, Button, Row, Column, StatefulWidget, etc.). Animation support and full Material 3 are on the roadmap.
Known Limitations:
Not all Flutter widgets are implemented yet (see compatibility matrix in README)
Method tear-offs need wrapping in lambdas for now
Complex animations aren't supported yet
This is best for content-heavy sites, not graphics-intensive apps
Why I built this: I kept running into clients who loved Flutter's DX but needed their sites to rank on Google. Flutter Web couldn't do that. I wanted the best of both worlds.
I'd love your feedback, especially:
Have you hit this SEO wall with Flutter Web?
What widgets would you need for your use case?
Any concerns about the approach?
Happy to answer questions about the architecture, performance claims, or roadmap!