Friday, July 19, 2013

Compiling Dart for GitHub Pages: The Revenge

Thanks to Jon Kirkman, who took last night's #pairwithme slot, we have the first keyboard shortcuts in the ICE Code Editor.

As the last feature that was slated for the Dart version of ICE, I think it is time to promote it to production at For the past month, the beta version has resided at and performed quite well by all accounts. I would like to push the keyboard shortcut commit to beta and will move to production tomorrow. But first…

I am going to revisit how I deploy the application. Nothing major here, there are two nagging problems that I hope to address. First, when I first pushed the Dart version out, I found that the minify option on the dart2js tool did not work with my code (I suspect it could not work with the js-interop code). The other problem is that I may be packing too much in my application cache manifest file.

I start with dart2js. I grab the most recent SDK from the Dart homepage:
➜  ice-code-editor git:(master) dart --version
Dart VM version: (Mon Jul 15 15:01:03 2013) on "linux_x64"
In my github repository, which is a GitHub pages repository, I update the package dependencies with Pub:
➜  ice-beta git:(gh-pages) ✗ pub update
Resolving dependencies...........
Downloading ice_code_editor 0.0.9 from hosted...
Dependencies updated!
Since this is going to be installed on GitHub pages, the normal symbolic links in Pub's packages directory are not going to work:
➜  ice-beta git:(gh-pages) ✗ cd packages
➜  packages git:(gh-pages) ✗ ls -l
total 24
lrwxrwxrwx 1 chris chris 64 Jul 19 22:01 browser -> /home/chris/.pub-cache/hosted/
lrwxrwxrwx 1 chris chris 63 Jul 19 22:01 crypto -> /home/chris/.pub-cache/hosted/
lrwxrwxrwx 1 chris chris 72 Jul 19 22:01 ice_code_editor -> /home/chris/.pub-cache/hosted/
lrwxrwxrwx 1 chris chris 60 Jul 19 22:01 js -> /home/chris/.pub-cache/hosted/
lrwxrwxrwx 1 chris chris 61 Jul 19 22:01 meta -> /home/chris/.pub-cache/hosted/
lrwxrwxrwx 1 chris chris 65 Jul 19 22:01 unittest -> /home/chris/.pub-cache/hosted/
I use my editor (Emacs) to convert that listing to a list of cp commands needed to convert then to real files:
➜  packages git:(gh-pages) ✗ rm *
➜  packages git:(gh-pages) ✗ cp -r /home/chris/.pub-cache/hosted/ browser
➜  packages git:(gh-pages) ✗ cp -r /home/chris/.pub-cache/hosted/ crypto
➜  packages git:(gh-pages) ✗ cp -r /home/chris/.pub-cache/hosted/ ice_code_editor
➜  packages git:(gh-pages) ✗ cp -r /home/chris/.pub-cache/hosted/ js
➜  packages git:(gh-pages) ✗ cp -r /home/chris/.pub-cache/hosted/ meta
➜  packages git:(gh-pages) ✗ cp -r /home/chris/.pub-cache/hosted/ unittest
I really need to write a tool to do this, but I will leave that for another day.

For now, I compile the ICE application down into JavaScript using the --minify option:
➜  ice-beta git:(gh-pages) ✗ dart2js --minify -omain.dart.js main.dart
I fire up a Jekyll server in my GitHub pages repository root:
➜  gamingjs git:(gh-pages) ✗ jekyll --auto --server
Configuration from /home/chris/repos/gamingjs/_config.yml
Auto-regenerating enabled: /home/chris/repos/gamingjs -> /home/chris/repos/gamingjs/_site
[2013-07-19 22:14:41] regeneration: 474 files changed
[2013-07-19 22:14:41] INFO  WEBrick 1.3.1
[2013-07-19 22:14:41] INFO  ruby 1.9.3 (2012-04-20) [x86_64-linux]
[2013-07-19 22:14:41] WARN  TCPServer Error: Address already in use - bind(2)
[2013-07-19 22:14:41] INFO  WEBrick::HTTPServer#start: pid=18249 port=4000
Then I fire up a non-Dart enabled browser (Chrome) to find...

It works!

There are no errors and the editor is working (keyboard shortcuts and all). It really does seem that, if something in the Dart world is not working properly, the best strategy is to wait a day or two.

Not only is it working, but the compiled main.dart.js file has gone from 910 KB to 312 KB. Obviously, that could be better, but it is much better than before. Plus it will be served with gzip encoding and will be app-cached so this is really exciting.

This seems a good stopping point for tonight. I will pick back up with improving my application cache deployment strategy (and possibly start tackling the automation of these things) tomorrow. For now, I can go to bed happy. Yay!

Day #817

No comments:

Post a Comment