Effective JavaScript

Effective JavaScript

• 2. Effective JavaScript Justin Tulloss Sr. Software Engineer April 24, 2010
• 3. Overview • JavaScript language properties • Effective closures • Effective objects • Interacting with the DOM • ECMAScript 5 • v8 optimizations
• 4. Prototypes
• 5. Assigning to a Prototype
• 6. Altering a Prototype
• 7. Altering a Prototype Faster
• 8. Deriving an Object from Another Object
• 9. Deriving an Object with Object.create
• 10. Scope Resolution
• 11. What Is in the Resolution Chain? Functions dictate scope (with a few exceptions) • Local variables • Arguments • Enclosing function scopes • With Statement • Global
• 12. Each Step Is Like a Property Access locals.arguments.scope1Locals.scope1Args.globals
• 13. Example
• 14. Don’t Use with
• 15. Effective Closures
• 16. The Power of Closures With great power comes great responsibility • Reduce typing • Make code cleaner • Provide some privacy • Sometimes they make things fast • Magic (AKA functional)
• 17. Building Objects with Closures
• 18. Same Thing Works for Constructors
• 19. Avoiding bind in Asynchronous Operations
• 20. Avoiding Unnecessary Methods
• 21. Memoization
• 22. Effective Objects
• 23. Using Objects Effectively • First, do what makes sense—don’t over-optimize • Every property access is slow • Breadth not depth • Use object literals • Make shortcuts • Inspectable
• 24. Use Object Literals Bad Good
• 25. Interacting with the DOM
• 26. Don’t
• 27. DOM Tips • Watch out for closures referencing nodes • These can leak • Reference nodes anyway • Using a reference is much faster than looking up a node • innerHTML is generally faster than the DOM API
• 28. ECMAScript 5
• 29. Exciting New Features • Function.prototype.bind • Object.create • Getters/setters • String.prototype.trim
• 30. Getters and Setters
• 31. v8 Optimizations
• 32. v8 Optimizations • Don’t use delete • Use object literals • Avoid altering objects after creating them • Don’t use eval
• 33. If it’s hard in C, it’s slow in
• 34. Q &A