Dart2js producing large javascript files, even with little code?

Question

I'm new to dart, and am using Dart Editor on Windows.

I noticed that my compiled javascript is huge, so I kept removing more and more code to see what was causing it, but I don't think I'm getting anywhere. Here's my program right now:

import 'dart:html';

void main() {
  var video = querySelector("#vid");
}

That's literally it. I've stripped out everything but one instruction.

And this is the produced javascript (it won't fit inline):

https://gist.github.com/DSteve595/504887a19a05614bcc94

What am I doing wrong? This program's practically empty!

Answer 1

The file you linked to in the gist is 48k. If you ran dart2js with the --minify option, you could bring the size down quite a bit.

Your code may be trivial, but dart2js has to load a significant number of libraries by default, and it has to load the dart:html library that you import as well. For perspective, how big do you think your file would be if you wrote your program in JavaScript and imported all of jQuery?

You can read more about dart2js at https://www.dartlang.org/docs/dart-up-and-running/contents/ch04-tools-dart2js.html.

Answer 2

dart2js needs to generate a significant amount of code to emulate Dart behaviour in JavaScript. Types, error checking, math, etc. all need to be emulated in JavaScript. This results in a lot of extra code and a trivial "Hello World" app will look monstrously large.

You can reduce the size of the delivered JavaScript by minifying it and gzipping it.

dart2js has been getting better over time, but there will always be a size cost to emulating Dart behaviour in JavaScript.