Your SlideShare is downloading. ×
0
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Developer  Tools And  Page  Speed
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Developer Tools And Page Speed

152

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
152
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. © 2010 GTUG Gaza All Rights Reserved
  • 2. Agenda • Introduction • Developer Tools • Page Speed • Closure Library • Discussion Dev. Mohammed S Shurrab www.orient.ps 0599300163
  • 3. 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
  • 4. Developer Tools
  • 5. Developer Tools, Elements Elements Panel • Inspect HTML elements • Show and modify HTML elements & CSS style
  • 6. Developer Tools, Resources Resources Panel • Tracking All of your Resources • Classify them and Sort them by (Size/Time)
  • 7. Developer Tools, Script Script Panel • Tracking your Script • Allow you to debug your Script using break points • Handel XHR, Events, and Workers
  • 8. 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)
  • 9. Developer Tools, Profile Profile Panel • Recording the internal process in the CPU • Allow you to get a head snapshots
  • 10. Developer Tools, Storage Storage Panel • Allow you to easily manage any storage data • DB, Local, Session, Cookies, Application.
  • 11. Developer Tools, Console Console Panel • Show you the Errors, Warnings, and Logs. • Allow you to run any JavaScript code on the page.
  • 12. Developer Tools, Console Console Panel • Show you the Errors, Warnings, and Logs. • Allow you to run any JavaScript code on the page.
  • 13. Page Speed
  • 14. Page Speed, the surf story Server • Processing time Transition • Bandwidth • Round-trip time • Parse • Resource fetches • Layout and Render • JavaScript
  • 15. 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++
  • 16. 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
  • 17. Closure Library
  • 18. 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

×