The Responsibilities Of A Front End Operations Engineer

Slide 1

Slide 1 text

The Responsibilities of a Front-End Operations Engineer Rodney Rehm - @rodneyrehm Front End Ops Conf 2014 Samstag, 26. April 14

Slide 2

Slide 2 text

The Non-Development Parts of FEOPS Rodney Rehm - @rodneyrehm Front End Ops Conf 2014 Samstag, 26. April 14

Slide 3

Slide 3 text

Hey, I’m Rod Photo by @stn1978 Samstag, 26. April 14

Slide 4

Slide 4 text

Samstag, 26. April 14

Slide 5

Slide 5 text

Samstag, 26. April 14

Slide 6

Slide 6 text

Not exactly a Start Up Samstag, 26. April 14

Slide 7

Slide 7 text

https://www.qivicon.com Samstag, 26. April 14

Slide 8

Slide 8 text

https://www.qivicon.com Home Automation Samstag, 26. April 14

Slide 9

Slide 9 text

Not exactly Corporate Samstag, 26. April 14

Slide 10

Slide 10 text

http://ladyalora.deviantart.com/art/Stupid-Unicorns-180198455 Samstag, 26. April 14

Slide 11

Slide 11 text

What have we seen so far? Samstag, 26. April 14

Slide 12

Slide 12 text

•Analysis Tools •Test Tools •Build Tools •Development Tools Samstag, 26. April 14

Slide 13

Slide 13 text

Similar, Yet So Diﬀerent Samstag, 26. April 14

Slide 14

Slide 14 text

Development Build Test Analysis Developer User Samstag, 26. April 14

Slide 15

Slide 15 text

https://www.ﬂickr.com/photos/67538764@N04/8486023159 Samstag, 26. April 14

Slide 16

Slide 16 text

Where do we go from here? Samstag, 26. April 14

Slide 17

Slide 17 text

… I don’t know?! Samstag, 26. April 14

Slide 18

Slide 18 text

I've come up with a set of rules that describe our reactions to technologies: 1. Anything that is in the world when you’re born is normal and ordinary and is just a natural part of the way the world works. 2. Anything that's invented between when you’re fifteen and thirty-five is new and exciting and revolutionary and you can probably get a career in it. 3. Anything invented after you're thirty-five is against the natural order of things. ― Douglas Adams, The Salmon of Doubt Samstag, 26. April 14

Slide 19

Slide 19 text

Slide 20

Slide 20 text

Slide 21

Slide 21 text

Slide 22

Slide 22 text

Know your goals before starting negotiations Samstag, 26. April 14

Slide 23

Slide 23 text

Start with something small, but something with impact Samstag, 26. April 14

Slide 24

Slide 24 text

Convincing the Team Samstag, 26. April 14

Slide 25

Slide 25 text

whose turf? • Graphic designers • UX designers • QA engineers • Ops, DevOps Samstag, 26. April 14

Slide 26

Slide 26 text

https://www.ﬂickr.com/photos/sunnyuk/2390099471 Samstag, 26. April 14

Slide 27

Slide 27 text

https://www.ﬂickr.com/photos/criminalintent/2744040362/ Samstag, 26. April 14

Slide 28

Slide 28 text

https://www.ﬂickr.com/photos/51035610542@N01/2597900487/ Samstag, 26. April 14

Slide 29

Slide 29 text

… when your team is on the same page … Samstag, 26. April 14

Slide 30

Slide 30 text

Convincing the boss is hard Samstag, 26. April 14

Slide 31

Slide 31 text

https://www.ﬂickr.com/photos/bilal-kamoon/6773383766 Samstag, 26. April 14

Slide 32

Slide 32 text

https://www.ﬂickr.com/photos/ratterrell/413624395 Samstag, 26. April 14

Slide 33

Slide 33 text

Request Rendering Render Spinner Fetch Data Render Data Samstag, 26. April 14

Slide 34

Slide 34 text

Request Rendering Render Spinner Fetch Data Render Data oh god, this app is sooooo slow Samstag, 26. April 14

Slide 35

Slide 35 text

Request Rendering Render spinner Fetch Data Render Data I can use some components already Render Cached Data Update Cache Samstag, 26. April 14

Slide 36

Slide 36 text

ﬁrst render at < 1 second, partly usable fully functional at 1 second + backend + network + model update + render (median around 7 seconds) Samstag, 26. April 14

Slide 37

Slide 37 text

https://www.ﬂickr.com/photos/ratterrell/413624395 Samstag, 26. April 14

Slide 38

Slide 38 text

Blind Refactoring is not your friend Samstag, 26. April 14

Slide 39

Slide 39 text

131 files in one app 55 files in shared modules 52KB of CSS 400KB of images 186 files less to think about 500KB less to serve to client Samstag, 26. April 14

Slide 40

Slide 40 text

131 files in one app 55 files in shared modules 52KB of CSS 400KB of images 186 files less to think about 500KB less to serve to client BLOAT BLOAT Samstag, 26. April 14

Slide 41

Slide 41 text

(Sorry Paul) Samstag, 26. April 14

Slide 42

Slide 42 text

how to avoid this in the future? Samstag, 26. April 14

Slide 43

Slide 43 text

Keeping things running is bothersome Samstag, 26. April 14

Slide 44

Slide 44 text

Samstag, 26. April 14

Slide 45

Slide 45 text

Things we’ve failed at Samstag, 26. April 14

Slide 46

Slide 46 text

Code Metrics Samstag, 26. April 14

Slide 47

Slide 47 text

Samstag, 26. April 14

Slide 48

Slide 48 text

Code Coverage Samstag, 26. April 14

Slide 49

Slide 49 text

Samstag, 26. April 14

Slide 50

Slide 50 text

Samstag, 26. April 14

Slide 51

Slide 51 text

Testing User Interaction Samstag, 26. April 14

Slide 52

Slide 52 text

Chrome Firefox Chrome Firefox Internet Explorer Internet Explorer Samstag, 26. April 14

Slide 53

Slide 53 text

http://dalekjs.com Samstag, 26. April 14

Slide 54

Slide 54 text

Ah, one last thing Samstag, 26. April 14

Slide 55

Slide 55 text

Non-US businesses may not be able to run US cloud services (even before PRISM) Samstag, 26. April 14

Slide 56

Slide 56 text

It’s OK if that doesn’t matter to you Samstag, 26. April 14

Slide 57

Slide 57 text

start small, build prototypes, follow through. Samstag, 26. April 14

Slide 58

Slide 58 text

Thank you Rodney Rehm - @rodneyrehm Front End Ops Conf 2014 Samstag, 26. April 14