ngEurope: Famo.us and some other interesting things

In my series of posts on ngEurope, I've covered quite a bit by now. It's testament to the volume covered at ngEurope. There are some smaller things I'll cover in this one post. This doesn't mean they are less significant. Just that they resonated less with me, but they are interesting enough to mention.

After this one, there are still some posts coming where I focus on a single subject. At the end, I'll post an overview of everything I covered.

Famo.us Users are spoilt when it comes to animations and interactivity on mobile devices. This points to a reason why the web hasn't taken over the mobile world. Javascript sacrifices performance, while CSS doesn't offer all possibilities.

Yes, CSS now has animations, but they are complex to build, and even harder to refactor. This is what's called the declarative ceiling.

You could use javascript, and it certainly has come a long way. But its performance is still not up to par with native code, especially on mobile devices.

This is what Famo.us tries to solve: the performance of javascript animations. Famo.us doesn't use the DOM. Instead, it has its own render tree, and outputs the result to CSS Matrix3D properties.

To use this in an existing Angular app, check out Famo.us/Angular.

Sheets Up until now, you had to put your Famo.us attributes inline, much like inline CSS (because the were Angular bindings). So what if you could put javascript in your CSS files? Kind of ugly, no?

Sheets tries to solve this. You can define your own fields and the logic for handling that field for a given element. It separates the template from its logic, with selectors as the link. It also allows you to use media queries.

Other interesting stuff

  • Restangular: A cleaner API to talk to REST services, although a bit Active-Record-like (objects know of their URL and can get their child objects, whether you like this or not is up to you).
  • Traceur: Compiles ES6 (and more) to ES5 (javascript of tomorrow to javascript of today). Most modern browsers are working hard on supporting ES6, but there's still a lot of work. Traceur allows you to code in ES6, but run your code in ES5. The result works in all modern browsers. It is highly modular and extensible.
  • ngAnimate: Enables animations in Angular in an easy way.
  • Firebase: Backend-as-a-service. Definitely worth looking at if you want to get up and running quickly. To learn more about BaaS, I recommend episode 129 of Javascript Jabber.
  • JSON Web Tokens: Cookies don't flow between apps or servers. JSON Web Tokens can. Also checkout jwt.io to encode/decode a JSON Web Token.