Sunday, January 5, 2014

Cannot Minify Polymer.dart


I very much want to put a working example of <ice-code-editor> up for public consumption. This is the Polymer version of the ICE Code Editor. After the work of the past few days, I could do so—especially after figuring out how to swap out the debugging libraries for minified versions upon deployment. But deployment on the web usually means codebases that are south of the 2.5MB range.

And, unfortunately for me, that is where my Polymer currently resides:
ls -lh build/polymer.html*
-rw-r--r-- 1 chris chris  797 Jan  5 12:11 build/polymer.html
-rw-r--r-- 1 chris chris 2.6M Jan  5 22:12 build/polymer.html_bootstrap.dart.js
Although I might prefer to fix the root of the problem, that might take me more time than I have at my disposal. Since I am getting rather adept at writing Dart deployment transformers, I thought I might have a go at transforming that polymer.html_bootstrap.dart.js file. Its problem is that it contains the entire Dart core in JavaScript form. Since I have no need of web audio, web sql, svg, etc., I try manually removing their definitions from polymer.html_bootstrap.dart.js. Sadly, that gets me nowhere. Even if my code is not directly using these libraries, other parts of the JavaScript are using them. It was worth a go.

If I cannot treat the symptoms, let's see about the root cause of the problem. I start by upgrading the various “any” version dependencies that are present:
➜  ice-code-editor git:(polymer) ✗ pub upgrade
Resolving dependencies...............................................
Downloading js 0.2.1 from hosted...
Downloading browser 0.9.1 from hosted...
Dependencies upgraded!
That actually seems promising. I know, for instance, that the js-interop package recently closed a bug that was causing excessive dart2js code sizes.

So I pub build my Polymer to find:
➜  ice-code-editor git:(polymer) ✗ pub build
...
[Warning in Dart2JS]:
web/polymer.html_bootstrap.dart:1:1: Hint: 449 methods retained for use by dart:mirrors out of 2399 total methods (19%).
...
[Info in Dart2JS]:
Generated ice_code_editor|web/polymer.html_bootstrap.dart.js (416281 characters) in 0:00:09.092775
That is an improvement. Not only the in size, which really is less:
➜  ice-code-editor git:(polymer) ✗ ls -lh build/polymer.html*
-rw-r--r-- 1 chris chris  797 Jan  5 22:52 build/polymer.html
-rw-r--r-- 1 chris chris 407K Jan  5 22:52 build/polymer.html_bootstrap.dart.js
The build time is also less than half what it was. Great!

Except that now the Polymer will not run. Instead, I get:
Uncaught Error: NoSuchMethodError : method not found: 'Symbol("giR")'
Receiver: Instance of 'pk'
Arguments: [] polymer.html_bootstrap.dart.js:1846
Stack Trace: 
Error
    at Object.b (http://localhost:8000/polymer.html_bootstrap.dart.js:1117:3)
    at pk.a.T (http://localhost:8000/polymer.html_bootstrap.dart.js:6138:25)
    at pk.T (http://localhost:8000/polymer.html_bootstrap.dart.js:8671:22)
    at pk.giR (http://localhost:8000/polymer.html_bootstrap.dart.js:13237:59)
    at cz.A0 (http://localhost:8000/polymer.html_bootstrap.dart.js:8376:8)
    at Fv.call$1 (http://localhost:8000/polymer.html_bootstrap.dart.js:8508:34)
    at vs.GP (http://localhost:8000/polymer.html_bootstrap.dart.js:3505:34)
    at jb.call$0 (http://localhost:8000/polymer.html_bootstrap.dart.js:3653:25)
    at Object.T8 (http://localhost:8000/polymer.html_bootstrap.dart.js:3272:26)
    at R8.Gr (http://localhost:8000/polymer.html_bootstrap.dart.js:4595:25)
 polymer.html_bootstrap.dart.js:1846
It seems that this error has been seen once before. Only once, as best I can tell. By me.

I always love it when that happens. It seems that I am doing something wrong in a way that is uniquely me. No one else is wrongheaded in quite the same way as me. I could definitely use a pair at this point, but failing that, I try my solution from back then: building the code without minifying it. But how to do that?

The pub build page suggests using the --mode=debug option. That does not seem to work:
➜  ice-code-editor git:(polymer) ✗ pub build --mode=debug         
Could not find an option named "mode".
Run "pub help" to see available options.
And, sadly, I cannot figure this out. I know there must be a way to get this working in debug (non-minified) mode, but I cannot find it.

Update: I was able to finally get this working. The option is --no-minify, not --mode=debug. The end result is that I am less than half of what I started with, but am still uncomfortably large:
➜  ice-code-editor git:(polymer) ✗ ls -lh build/polymer.html*
-rw-r--r-- 1 chris chris  801 Jan  6 00:07 build/polymer.html
-rw-r--r-- 1 chris chris 945K Jan  6 00:07 build/polymer.html_bootstrap.dart.js
I may have a go at tweaking some of the JavaScript interoperability code in the ICE Code Editor tomorrow to see if that might fix my minified version of the code.



Day #987

No comments:

Post a Comment