2. © 2010 GTUG Gaza All Rights Reserved

3. Agenda
• Introduction
• Developer Tools
• Page Speed
• Closure Library
• Discussion
Dev. Mohammed S Shurrab
www.orient.ps
0599300163

4. Introduction
Web Money
Faster
More
Stable
Developer
Tools
Page
Speed
Closure
Library
Happy
Users
Tools
Google: 400 ms latency increase a 0.6% search decrease
Yahoo!: 400 ms latency increase a 5-9% traffic decrease
Shopzilla: 5 sec latency decrease a 12% revenue increase

5. Developer Tools

6. Developer Tools, Elements
Elements Panel
• Inspect HTML elements
• Show and modify HTML elements & CSS style

7. Developer Tools, Resources
Resources Panel
• Tracking All of your Resources
• Classify them and Sort them by (Size/Time)

8. Developer Tools, Script
Script Panel
• Tracking your Script
• Allow you to debug your Script using break points
• Handel XHR, Events, and Workers

9. Developer Tools, Timeline
Timeline Panel
• Give you more information about resource loading
• Even about loading time or memory allocations
• Work even after the page loading (loading, Scripting, Rendering)

10. Developer Tools, Profile
Profile Panel
• Recording the internal process in the CPU
• Allow you to get a head snapshots

11. Developer Tools, Storage
Storage Panel
• Allow you to easily manage any storage data
• DB, Local, Session, Cookies, Application.

12. Developer Tools, Console
Console Panel
• Show you the Errors, Warnings, and Logs.
• Allow you to run any JavaScript code on the page.

13. Developer Tools, Console
Console Panel
• Show you the Errors, Warnings, and Logs.
• Allow you to run any JavaScript code on the page.

14. Page Speed

15. Page Speed, the surf story
Server
• Processing time
Transition
• Bandwidth
• Round-trip time
• Parse
• Resource fetches
• Layout and Render
• JavaScript

16. Page Speed, What does it do ?
• Predefine rules from Google and Community
• A speed score (??/100)
– High priority
– Medium priority
– Working fine or low priority
– Informational messages only
• every problem has a corresponding solution.
• Have a SDK written in C++

17. Page Speed, the FAST surf story
• Google Five Golden Rules
– Optimizing caching
• keeping your application's data and logic off the network
altogether
– Minimizing round-trip times
• reducing the number of serial request-response cycles
– Minimizing request overhead
• reducing upload size
– Minimizing payload size
• reducing the size of responses, downloads, and cached pages
– Optimizing browser rendering
• improving the browser's layout of a page

18. Closure Library

19. Closure, it’s all about JS
Compiler
• Smaller
• Efficient
• Checked
Library
• Well-tested
• Modular
• Cross-browser
Templates
• Dynamically
generating
HTML
Linter
• Checking
• Fixing
• Saves time