Slide 1

Slide 1 text

BARE METAL CODING OPTIMISING YOUR JAVASCRIPT FOR LEANER, MEANER PERFORMANCE

Slide 2

Slide 2 text

HI.

Slide 3

Slide 3 text

I MAKE PRODUCTS THAT SELL PRODUCTS.

Slide 4

Slide 4 text

I MAKE STUFF WORK.

Slide 5

Slide 5 text

I MAKE STUFF GO FAST.

Slide 6

Slide 6 text

THE RULES.

Slide 7

Slide 7 text

RULE #1

Slide 8

Slide 8 text

RULE #2

Slide 9

Slide 9 text

RULE #3

Slide 10

Slide 10 text

RULE #4

Slide 11

Slide 11 text

RULE #5

Slide 12

Slide 12 text

RULE #6

Slide 13

Slide 13 text

RULE #7 function Person(firstName, lastName) { this.firstName = firstName; this.lastName = lastName; } Person.prototype.sayHello = function() { alert("Hello, I'm " + this.firstName); }; var jack = new Person('Jack', 'Sparrow'); jack.sayHello();

Slide 14

Slide 14 text

RULE #7 (CONTINUED)

Slide 15

Slide 15 text

RULE #8

Slide 16

Slide 16 text

RULE #8 (CONTINUED) // immutable vector implementation function Vec2d(x, y) { this.x = x; this.y = y; } Vec2d.prototype.add = function(x, y) { if (x instanceof Vec2d) { y = x.y; x = x.x; } return new Vec2d(this.x + x, this.y + y); }; var a = new Vec2d(1,2), b = new Vec2d(3,4); for (var i = 0; i < 1e7; i++) a = a.add(b);

Slide 17

Slide 17 text

RULE #8 (CONTINUED)

Slide 18

Slide 18 text

RULE #9

Slide 19

Slide 19 text

RULE #9 (CONTINUED)

Slide 20

Slide 20 text

RULE #9 (CONTINUED)

Slide 21

Slide 21 text

RULE #10 elm.addEventListener('touchmove', function(ev) { elm.style.webkitTransform = 'translateX(' + ev.pageX + 'px)'; });

Slide 22

Slide 22 text

RULE #10 (CONTINUED)

Slide 23

Slide 23 text

RULE #11

Slide 24

Slide 24 text

RULE #12

Slide 25

Slide 25 text

THAT'S IT.

Slide 26

Slide 26 text

PHOTO CREDITS