Optimizing jQueryAnd Other Front-End Trinkets

1Sunday, 3 March, 13

A lil’ about me

Twitter: @tylersavery

CURRENTLY: Co-founder & Creative Engineer @ The Young Astronauts

PREVIOUSLY: Partner & Dev @ Playground Inc.

Dinosaur FactoryRyerson Student + RUtv

2Sunday, 3 March, 13

My Scripting Experience

HTML/CSS

JavaScript + jQuery

PHP + MySQL

NodeJS + MongoDB

Python + Django + PostgreSQL

C# + Unity3D

Objective C + iOS SDK

3Sunday, 3 March, 13

How I Prepared for this Talk

4Sunday, 3 March, 13

My First Impressions of jQuery

The Pros

Selecting Dom ObjectsAjaxAnimationPluginsCallbacksFlexibilityCommunity / DocsCDN Hosting

The Cons

There were no cons. This was perfect. This solved everything.

5Sunday, 3 March, 13

jQuery is an intuitive and simple interface, welcoming to new front-end developers. Being so simple, it's easy to make something work but if you don't know what's going on at the lower javascript level its very easy to hack something inefficient together.

Thesis

6Sunday, 3 March, 13

Some JavaScript Gotchas

Multi-Selector Callbacks

7Sunday, 3 March, 13

Some JavaScript Gotchas

Scope

8Sunday, 3 March, 13

Some JavaScript Gotchas

Sizzle

9Sunday, 3 March, 13

Some JavaScript Gotchas

Declaring Functions

10Sunday, 3 March, 13

Some JavaScript Gotchas

“this”

11Sunday, 3 March, 13

Some JavaScript Gotchas

Adding vs. Subtracting Strings

12Sunday, 3 March, 13

My App Structure

Let’s look at some examples!-Basic Site-Kropr-Playfight Website-2D Slider

13Sunday, 3 March, 13

Demos...

-Basic Site-Kropr-Playfight Website-2D Slider-Space Invaders (if time)

14Sunday, 3 March, 13

Tips and Tricks

-ReCSS / Less + Watch-Testing Mobile (Edge / Simulator / Virtual Host)-Bash Scripts /.profile / command line

-color coding / aliases / custom prompt, git integration-buildsite script-python -m SimpleHTTPServer 8008-ctrl+a shortcut-bc / python calc-localtunnel-retina batch script with imagemagick

15Sunday, 3 March, 13

In Conclusion...

@tylersavery

jQuery is an intuitive and simple interface, welcoming to new front-end developers. Being so simple, it's easy to make something work but if you don't know what's going on at the lower javascript level its very easy to hack something inefficient together.

theyoungastronauts.comWe Are Hiring!

16Sunday, 3 March, 13

And finally my Paul Irish Contribution

Paul Irish InceptionPaul doing a presentation about him doing a presentation on a presentation screen, on this presentation screen, while (hopefully) he is watching my presentation.

17Sunday, 3 March, 13