Herding Code 196: Matias Niemela on ngAnimate

The guys talk to AngularJS committer Matias Niemela about AngularJS and Angular animations with ngAnimate.

Show Notes:

Hello. How’d you get started with AngularJS and ngAnimate?
- (01:00) K Scott notes a tweet from Matias that he liked Angular before it was popular and asks Matias about how he got started with Angular and how he became a contributor, primarily contributing to animation. He’s also contributed to angular-dart and forms. (03:17) K Scott asks about the history of Animations. Matias talks about how things evolved to working with CSS classes. K Scott talks about how he found the source code for animations was pretty interesting, and Matias agrees.
Dart and Google Material Design
- (04:47) K Scott asks about AngularDart relates to Angular. Matias explains that both are from Google, and they want to make sure that it’s easy to build Angular applications using Dart if you want to.
- (05:39) Jon asks is Matias is working in both the 1.x and 2.0 source. Matias says he’s mostly focused on the 1.2 and 1.3 release and lately incorporating Google’s new Material Design, especially with animations and components. Angular Material Design includes styles and animations, but is built to allow you hooks to add your own styles and animations, transparently syncing them together in a consistent way.
Animation internals

(08:14) K Scott asks for Matias’ thoughts on CSS Animations. Matias says the API is too isolated, so there’s no way to hook into the keyframe system. CSS Transitions do allow for that, but you can’t repeat transitions. Putting them together, it’s difficult to create a comprehensive system that’s guaranteed to always run. The Material Design animations work with the Web Animations API, which is a more robust animations API. Currently only Chrome support the .animate method, and the Web Animations API spec is still being written, but Polymer has a polyfill.
(10:16) Jon asks about browser support and whether Matias is able to write to standards or if he has to do a lot of special casing. Matias says that the Polymer polyfill and the animations API covers almost everything without special casing.
(11:11) K Scott asks what the most challenging part of Angular Matias has worked on so far. Matias says the challenge has been the animations, especially in refactoring over time.

(12:56) K Scott asks how Matias tests animations. He says that the tests are all mocked, so they’re not running against animation engines. He says it’s been difficult testing asynchronous code in a synchronous manner.
(14:38) Jon asks if Matias uses Javascript libraries to deal with asynchronous code. Matias says that’s all handled by Angular itself.

(15:15) K Scott asks for Matias’ thoughts on ECMAScript 6. Matias says that Angular 2 is built with ECMAScript 6 using traceur for backward compatibility. He likes the classes and generators an syntactic features, but after working with Dart there are a lot of other features he’s missing. The problem is that JavaScript is non-blocking, so the code will always be a series of callbacks with variables to see if a callback has fired. Promises are great, but they’re just packaged callbacks in a way.

(16:50) Jon asks for pointers for someone who’s new to ngAnimate. Matias says he’s written documentation for 1.2, but some of it isn’t up to date. There’s a SitePoint article about it, and when 1.3 is out Matias will have an article out about it.
(17:38) K Scott asks about form validation. Matias talks about the work they’ve been doing with forms in 1.3.

(18:55) Twitter question from Steve Strong asked for news on Angular 2.0 and how important ECMAScript 6 is to it. Matias talks about how ES6+ (ES6 with annotations support) simplify dependency injection.
(21:13) K Scott asks if Matias liked using JavaScript back when he was doing more full stack development. Matias talks about how he used to write a lot of JavaScript to do things that Angular just handles.
(22:38) K Scott says that Matias’ blog and twitter names, Year Of Moo, made him thing that Matias might have been involved with Moo Tools. Matias says he used to be heavily invested in Moo Tools because it supported proper object oriented programming (as opposed to jQuery’s looser approach). He eventually switched to jQuery and then to Angular. He’d originally named his blog around an idea of writing a new Moo Tools plugin each month for a year, but kept the name because it’s unique.

(23:50) K Scott asks Matias when he became passionate about testing. He talks about how valuable tests have been to him.
(24:45) Jon asks if Matias has any recommendations on testing. His suggestion is to pay attention to what you’re after. Your tests are to make sure that the code you’ve written work, so test the main points of functionality. Look for friction points – things that will not change – and test those. Try to write some of your own unit tests first, and when you get frustrated look at how projects like Angular are writing their tests.

(26:12) K Scott asks Matias what he’s been looking to for inspiration. Matias has lately inspired by Clojure and books on software patterns and refactoring.
(26:51) Jon asks Matias about his site’s design and use of color. Matias says the cartoons on his site are by his girlfriend who is a graphic designer. He says that most technical bloggers are not focused on writing articles. His goal is to push the boundaries of technical blogging and to address the frustrations he’s had in reading other technical blogs.
(28:41) Jon says he really likes Matias’ use of multiple em classes with different colors. Matias discusses that, and says that he’s rewriting the website from Jeckyl to Hugo (which is built with Go).

(29:58) K Scott asks what Matias does for fun. He mentions travel (he’s from Finland), golf and going to the gym. But computers is a big passion of his, so it’s rare that he’s away from the computer.
(30:28) K Scott says he used to play golf a lot, but he’s been making an effort to get out golfing at least once a week. Matias says it’s definitely a challenge a lot of programmers face – most of us like what we do, and going outside requires intention. Jon talks about his friends in other professions who leave their work at work. Matias talks about the portability aspect of computing.
(32:24) K Scott asks Matias about what’s on the way for for him. He mentions some posts and upcoming speaking engagements, especially ngEurope in October in Paris, talking about what’s new with Angular and ngAnimate.

Show Links:

Sponsor

This show is brought to you by Runscope – find out more at http://runscope.com/herdingcode