1. Look Up Javascript on Mobile var context = context || {} //
wrong! for(var i=index;i
2. Hi! I am Dron Rathore NodeJS & Front End Automation Lead
at housing.com About me
3. var name = Dron Rathore var designation = "NodeJS
Automation".replace(/(s+|$)/g, function(match){ return
parseInt(match.charCodeAt(0))?" Lead, ":" Lead }) var myTask =
Pursue everyone to move to JS var interest = Benchmark! Optimise!
Repeat! var knowsAbout = Anything that JS does and wherever it
does! @heavenhackers About me dron.rathore
4. D.R. If you dont start respecting the Web, it will be
doomed!
5. Less Memory Less CPU Less Interaction Area More Events
Sensors & WebAPIs Mobile Web Javascript Perspective
8. Optimise Javascript Compile Generate binary OpCodes
Interpret Initialise context, stack and variables Execute Here Here
And Here
9. Why you use Javascript? Templating Animations Events/XHR To
show that you are a rockstar!
10. Templating Less Memory, More throughput
11. Mobile Templating Sept-2013 Less Respect, Less
Performance
12. Previously Send API Request JSON Parse the data Pass it to
the template Get the DOM String Attach it to the DOM Required?
13. Solution
14. Feb-2014 More Respect, Better Performance
15. Events Trust me, they are heavy!
16. Concept: Event Propagation
17. Canvas(skia) = Channel DOM Vars init() init Event Prop()
_resolveTargets() _bailoutHandlers() Handler Called
18. Problem? Yeah! Event has to do complete cycle Too many
events slow down things Wait for event to reach target
19. Workaround Event Handling Mechanism Do not let it bubble
Capture it at the first place Top hierarchy event handling Stop
Propagation
20. capture=true Tree Path Targets
21. But..Inline Events were fast?
22. ttps://github.com/DronRathore/eventMan Listen on body tag
Assign Unique ID to each Node Access the ID, and look into the map
listeners Execute the callback and stop event propagation
24. What is wrong? Write my own Bubbling concept Event
Delegation is hard Maintaining a sequence of eventFlow
25. JS Performance Cheat Sheet!
26. .call() vs apply()
27. Out of Scope Access Bailout with ref pointer New CTX to
compile/eval
28. Accessing Key * Do in global context return as 1st
statement* * = Optimised By default
29. Ternary Operators Ternary Operators are easy to parse at
compile time
30. Dont Block, Please ;(
31. Miscellaneous Less timers setIntervals, setTimeouts Use of
WebWorkers for heavy tasks documentFragment is a Lie!
32. Animation = CSS, Period.
33. You dont want to get Roasted, do you?
34. 200%+ Performance Optimised
35. Tips of the Day Never bind scroll Events, use touchstart
and touchend Listen on top most hierarchy1 Do not Bind too many
handlers! Its Heavy! Javascript is Single Threaded, have some
respect!