Treating Framework Fatigue With JavaScript

A talk I gave at JSConf Last Call, December 6, 2015

Transcript

1. Treating Framework Fatigue With JavaScript Tim Doherty Software Architect TimCDoherty timdoherty.net /in/timdoherty
2. TimCDoherty
3. ??? TimCDoherty
4. Hey, this one looks cool! TimCDoherty
5. You May Suffer From Framework Fatigue TimCDoherty
6. Symptoms TimCDoherty
7. Confusion TimCDoherty
8. • One-way reactive data flow • Two-way data binding • Micro-frameworks • Virtual DOM • Extensible HTML • Decoupled, event-driven architecture • MVC, MVP, MVW, MVVM, MV??? TimCDoherty
9. Ambivalence TimCDoherty
10. https://twitter.com/jesterxl/status/598885321808424960 TimCDoherty
11. • Another framework? Seriously? • Mine’s The Right Framework™, who cares? • My framework does the job, why do I need The Right Framework™? • Do I even need a framework? TimCDoherty
12. Skepticism TimCDoherty
13. • “3x to 5x faster on initial render and re-render scenarios” • “More powerful than Backbone and faster or more flexible than React, Meteor, and AngularJS” • “…faster than you ever thought possible.” • “…a simpler programming model and better performance.” • “More productive out of the box” • “The most powerful, flexible and forward-looking JavaScript client framework in the world" TimCDoherty
14. Reduced Capacity for Hype and Marketing Lingo TimCDoherty
15. • “A Javascript Framework for Building Brilliant Applications” • “Superheroic JavaScript MVW Framework” • “Designed with developer ergonomics in mind, its friendly APIs help you get your job done —fast” • “A next gen JavaScript client framework for mobile, desktop and web that leverages simple conventions to empower your creativity" • “Simplify dynamic JavaScript UIs with the Model-View-View Model (MVVM) pattern” • “Declarative component sugar for event-driven RequireJS apps” • “Intuitive, Fast and Composable MVVM for building interactive interfaces” • “A highly modular, loosely coupled, non-frameworky framework for building advanced JavaScript apps” TimCDoherty
16. TimCDoherty
17. Treatment TimCDoherty
18. Go Native TimCDoherty
19. Favor built-ins (standard library) over framework/library equivalents • Array: forEach(), find(), map(), every() • Object: defineProperty(), assign(), keys() • Function: bind() • String: startsWith(), includes(), endsWith() • Tagged Template Literals* TimCDoherty
20. If performance really matters, go native anyway: TimCDoherty
21. Go Deep TimCDoherty
22. Learn ES 5 • Everything in ES 5 is still valid JavaScript • ECMAScript 2015 (a.k.a. ES 6) is a superset of ES 5 • Much of the new ES 6 syntax is just terse, concise ES 5 TimCDoherty
23. Prototypal Inheritance • But… JavaScript has classes now, right? • Object.create • Differential vs. Concatenative (mixins) Functional Programming • First-class and higher order functions • Pure functions TimCDoherty
24. Closures, IIFEs, module pattern Type coercion Lexical scope and hoisting Equality and strict equality Asynchrony and callbacks Function call(), apply(), and bind() What in the hell “this” is? TimCDoherty
25. Learn ES 6 (and beyond) New syntax • Let/const, rest/spread, destructuring, arrow functions… Enhanced standard library • Object, array, string, math, number, regex… Entirely new features • Iterators/generators, proxies, map/set, promises, symbols… TimCDoherty
26. (shameless plug) • ECMAScript 6 In Depth: Part I - Tim Doherty • ECMAScript 6 In Depth: Part II - Tim Doherty • ECMAScript 6 In Depth: Part III - Tim Doherty TimCDoherty
27. Use the Source! TimCDoherty
28. Ember TimCDoherty
29. Angular TimCDoherty
30. Lodash TimCDoherty
31. • Original jQuery annotated source • Underscore annotated source • Backbone annotated source • 10 Things I Learned From the jQuery Source - Paul Irish TimCDoherty
32. Learn what is and isn’t JavaScript http://i.stack.imgur.com/SeCUb.jpg TimCDoherty
33. • Language vs. environment • Browser, server, database, OS • Host-provided APIs (DOM, XMLHttpRequest, etc.) • Complimentary technologies (CSS) • Go deep with the language first • Then go deep with supporting technologies (DOM, CSS, etc.) http://i.stack.imgur.com/SeCUb.jpg TimCDoherty
34. Learn How to Learn TimCDoherty
35. • Change is the only constant • Even The Right Framework™’s days will be numbered • You cannot know everything about everything • Learn enough to be productive, then improve by immersion • Develop a strategy for focused knowledge gathering TimCDoherty
36. Side Effects • Language-level skills • Increased confidence • Better problem solving ability • Knowing what “this” is **Occasionally, JavaScript users have reported a desire to write their own framework, or abandon frameworks altogether, although this is rare TimCDoherty
37. Thanks! Tim Doherty Software Architect TimCDoherty timdoherty.net /in/timdoherty