Introduction

Flutter2js is an experimental project that investigates feasibility of making Flutter apps run in browser using drawing primitives (canvas, CSS and SVG).

Licensed under the BSD 3-Clause License.

Implications of the approach

If the project gets drawing working, the approach taken by this project ("drawing, no HTML elements") has the following implications:

• All Flutter widgets will work.
• Apps look (more or less) identical to iOS/Android.
• Scrolling/animation performance is bad compared to web apps (but possibly acceptable).
• Code size and accessibility are inevitably poor compared to normal web apps.

Status

Ready

• [X] Flutter SDK and sample apps compile

Next

• [ ] "Hello world"-like examples draw correctly
• [ ] Mouse/tap handling

You can help!

Notes for developers

• The project uses dart2js. Unfortunately dartdevc seems to have issues with Flutter SDK packages.

Getting started

Hello world

Clone Git repository

git clone https://github.com/flutter2js/flutter2js

Try "Hello world"

cd examples/hello_world-browser
pub get
pub run webdev serve

Open browser at: http://localhost:8080/main.html

Technical details

Libraries from original Flutter SDK

Flutter SDK libraries are derived from the original Flutter SDK.

These include:

• dart:ui (original, docs)
  • Because Pub doesn't allow overriding "dart:something" packages, it's exposed as "package:flutter/ui.dart".
• package:flutter (original, docs)
• package:flutter_localization (original, docs)
• package:flutter_test (original, docs)

The modifications include:

• Many classes in dart:ui such as Canvas delegate implementation to package:flutter2js or expose previously private/external fields.
• Eliminated usage of language features not supported by dart2js:
  • Assertions in initializers. After dart2js started to support them, this became unnecessary.
  • Some mixins (issue #23770)