Incuna at jQuery UK 2013 - part 2

April 23, 2013, 1:15 p.m. in Web Design

White October cupcake
Amazing cupcakes from White October

This continues on from my first post - Incuna at jQuery UK 2013 - part 1, I wanted to finish up discussing a few of the other talks from the day and what I took away from them. :)

Following on from where I left off, the final talk before lunch was Douglas Neiner talking about Machina.js, a framework for Finite State Machines in Javascript. I’ll be honest, I’d never heard of a “Finite State Machine” before, so at first I was worried it was going to be something over my head. But not at all, and this was one of my favourite talks because of the clear and concise way it was presented. The basic idea was that Machina.js provides a cleaner way to deal with situations where your code may otherwise end up with a nest of if/else statements. I’m quite a visual person, and I think I find it easier to understand certain bits of code or concepts if I can see how they would be applied to a real situation. So, I definitely felt engaged in the talk when Doug provided some interesting, visual, real-world demos, the main example being a router. As well as being a great, simple example of what Machina.js was actually doing and how it can help you manage those different states, it was also a great example of some lovely CSS transitions/animations and attractive front-end work (something I’m a big fan of :) I’m not sure of any exact situations we may want to use this right now at Incuna, but it’s definitely something I’ll remember thanks to the excellent talk and demo.

After lunch (which included the delicious cupcake above!), Garann Means gave a talk on using events to glue full-stack frameworks together. Unfortunately I didn’t have a good view for this talk and couldn’t see the code examples very well and the rest went over my head a little :( Following her talk, my Incunauts and I did take a look at Marionette, the library she was using for Backbone, as we use Backbone in our projects at Incuna. So I’m interested to learn about that a bit more, also because the website is so pretty.. (there I go with the visual stuff again! :)

The next talk was Ilya Grigorik and was entitled “Wait, Chrome Devtools can do that?”. This was probably the most useful of the talks for me in terms of concrete information that I knew I could go away and look into, and hopefully use to improve some of our workflow processes and testing/debugging. The main thing to take from the talk is download Chrome Canary now! I hadn’t realised how far ahead Chrome Canary was in terms of the devtools, so that was useful to know. He also talked about some really useful and interesting features such as:

  • Better use of the timeline, including saving timeline traces as HAR files so others can recreate it, to see where something is loading slowly for example.
  • How frames per second apply to webpages as well as games, and how slow paints or costly CSS effects can affect this and cause (as Chrome puts it) “jank”, and how you can use the devtools to diagnose this.
  • How if you change CSS in devtools, Canary can actually give you a diff of your changes (yay)
  • How you can add custom panels to Devtools, the ones that sounded particularly interesting of these were jQuery Debugger and PageSpeed Insights. One of the coolest things mentioned about PageSpeed Insights was that it would suggest compressing an image for further reduction and at the same time offer you a download of that image at the reduced size! Oooh..

Finally, it was very useful to hear that Canary has remote debugging, for Android at least, with the ability to use all the same DevTools features whilst debugging on the device. Remote debugging is something we sometimes still have issues with at Incuna, so anything we can do to improve this process is great. There was a lot more useful information, you can read it in Ilya’s slides, there’s also a super useful Chrome Devtools course on Code School and it was interesting to hear about a weekly Chrome Youtube show The Breakpoint.

After Ilya, John Bender gave a talk about faster DOM manipulation with category theory, and he had some great slides, but it was admittedly a little maths-heavy for me. So, uh, moving on..!

I enjoyed the final two talks - it was interesting to hear Joe Petterson talking about his experience of still having to develop for older versions of IE, also as it the talk was around a pharmaceutical site, similar to the things we work on at Incuna. He gave some good thoughts on using IE VMs for testing (which we currently do), but also how you might use Selenium or an external service like Saucelabs to be able to test accurately on the VMs. Front-end testing is still something we need to do more of and look into more at Incuna, so this felt pretty relevant to recent work conversations.

Finally Jason Scott from Blackberry talked about building “an experience, not just another framework”. I was interested to hear a talk from this perspective, as ultimately, the reason we’re all writing jQuery, and the end point of all of our sites and apps is the user. He talked about using jQuery Mobile and customising the theme for your user. This was quite familiar to me, having used jQuery Mobile a few times at Incuna when working on Phonegap mobile applications, and I found myself agreeing when he pointed out how it doesn’t make sense to try and replicate all native functionality with things that just don’t work as well in a webview - for example transitions that require a a heavy amount of rendering. He also mentioned Grunt JS as a build tool for minifying and uglifying files. We have scripts for doing this on our projects at Incuna but it still sounds like it could be a useful thing to look into.

Overall, it was a great day with a really interesting range of content and it was nice to meet some new people in the jQuery community. It definitely left me feeling inspired. Yay!