loge.hixie.ch

Hixie's Natural Log

2016-08-02 17:12 UTC Flutter: Hot reload

The big thing we're testing in Flutter land right now is Hot Reload. This is a feature from the Dart team that's going to make Flutter development massively easier. Instead of having to restart your app each time you make a change, you just have your IDE signal your device that the source code has changed, and we load the new code straight into the actively running VM without losing any of your state! Your app could be in the middle of an animation, and boom, half-way through we upload the new code and the animation continues running but with the new settings, without interrupting the animation or anything.

I've been using this feature to write code for a few days now and it is astounding what a difference it makes. You can try it today if you're using the master branch, just use "flutter run --hot". It's still a bit buggy (we don't yet support loading assets in this mode, for example, which is obviously a bit limiting) but that should get shaken out in a few days and then we'll land it on the alpha branch.

Conveniently, our framework really fits the hot reload model well. When you trigger a hot reload, we just mark every widget as needing to be rebuilt, and the whole app gets the new code applied, without losing state. This means you can tweak build functions, theme settings, and so on, and when you reload, the code takes effect. It would have been much harder to do this if our framework used a more retained-mode model like traditional UI frameworks, where once you've described the UI it stays in memory.

In other news, we now have a real logo! We've started deploying it, you can see it on our Web site and our G+ page and so on. I've been writing a widget that renders the logo, so that you can fly our colours if you want to. The logo is a heavily stylised blue wing in the shape of a sideways F. By the way, using hot reload makes writing canvas code, like this logo drawing code, so much easier. You just edit the coordinates, hit a key to save your changes, look at the device, and repeat.

The past few weeks I've been making sure our licensing story is nice and straight, including adding an AboutDialog widget and corresponding license screen. (Nothing drives home quite how many shoulders Flutter is standing on than paging through all the licenses of third-party packages Flutter uses. It really is a testament to the power of open source development.) Anyway, that's why I'm writing a FlutterLogo widget: my plan is, by default, to include it at the top of the license screen.

Pingbacks: 1 2 3 4 5