Fronteers meetup at TransIP

Fronteers and its members frequently organize informal meetups to encourage front-end developers to share and insipre, promoting everything from best practices to the newest technologies. Last wednesday we gathered at TransIP in Leiden for two sessions; Johan Schuyt on Google Closure Compiler, and yours truly on CSS transformations with a bit of math and Javascript.

Johan Schuyt
TransIP hosts a great number of websites, and requires a dependable Javascript framework to run its various client-side services on, Johan explained. Google’s closure not only compiles your scripts in the most optimal way – completely rewriting your code for optimal size and performance – it also provides in a thoroughly tested library that does everything from basic crossbrowser manipulation of the DOM to complex interface components.

Johad admits that taking the step from (for instance) using jQuery to using closure in combination with separate development and production environments, unit testing, build-scripts, and very strict programming conventions may pose a bit of a challenge – even to an experienced team of Javascript developers. The benefits with respect to code quality, performance, size and maintainability however make it totally worth the investment.

Peter Nederlof
My own talk was on CSS transformations, and the benefits of adding a bit of math and Javascript to the mix. After a quick overview of the various transformation and transition properties that modern browsers support, I showed a few examples of triggering transitions with class names, triggering them with events and finally by applying transformations directly to elements with Javascript.

The presentation can be found right here (it’s in Dutch, and a CSS 3D capable browser is advised), and the matrix implementation can be found on github. Enjoy!

Posted in Blog, Knowledge, News, Presentations | Tagged , , , | Comment

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>