Your SlideShare is downloading. ×
Client Side Performance In Web Applications   Resources
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

Client Side Performance In Web Applications Resources

474
views

Published on

Used Resources.

Used Resources.

Published in: Education, Technology

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

  • Be the first to like this

No Downloads
Views
Total Views
474
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
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. Client‐side performance in web  applications ‐ Resources  Files:  1.CSS file example “shiny.css”:  .easytabletitle {  background: url(./shinyimages/shinyheader.gif) #FFF;  background: repeat‑x scroll center left;  font: normal normal normal;  font‑size: 11px;  font‑family: Verdana, Geneva, Arial, Helvetica,sans‑serif;  padding‑left: 5px;  padding‑right: 5px;  padding‑top: 5px;  padding‑bottom: 5px;  border: 1px solid;  border‑color:  #CCC;  text‑align: left;  }  .easytableheader {  background: url(./shinyimages/shinyheader.gif) #FFF repeat‑x scroll center left;  font: normal normal normal 11px Verdana, Geneva, Arial, Helvetica,  sans‑serif;  padding: 5px;  border: 1px solid #CCC;  text‑align: left;  }  2.CSS file example “shini1.css”:  .easytabletitle{font:11px verdana,geneva,arial,helvetica,sans‑  serif;padding:5pxbackground:url(./shinyimages/shinyheader.gif) #FFF;background:repeat‑x scroll  center left;font:normal normal normal;border:1px solid;border‑  color:#CCC}.easytabletitle,.easytableheader{text‑  align:left}.easytableheader{background:url(./shinyimages/shinyheader.gif) #FFF repeat‑x scroll  center left;font:normal normal normal 11px Verdana,Geneva,Arial,Helvetica,sans‑  serif;padding:5px;border:1px solid #CCC}  3.CSS file example “shiny2.css”:  .easytabletitle{background:repeat‑x scroll center left;font:normal normal normal;font‑size:11px;font‑  family:Verdana, Geneva, Arial, Helvetica,sans‑serif;border:1px solid;text‑align:left;border‑  color:#CCC;padding:5px;}.easytableheader{background:url(./shinyimages/shinyheader.gif) #FFF  repeat‑x scroll center left;font:normal normal normal 11px Verdana, Geneva, Arial, Helvetica, sans‑  serif;border:1px solid #CCC;text‑align:left;padding:5px;}
  • 2. 4.CSS file example “example.css”:  h2 {  font‑size: 1.5em;  padding: 10px 10px 10px 25px;  margin: 10px 0;  border: 1px solid #ddd;  background: #f0f0f0 url(crown.gif) no‑repeat 5px 10px;  }  p2 {  font‑size: 1.5em;  padding: 10px 10px 10px 25px;  margin: 10px 0;  border: 1px solid #ddd;  background: #f0f0f0 url(crown.gif) no‑repeat 5px 10px;  }  .block {  font‑size: 1.5em;  padding: 10px 10px 10px 25px;  margin: 10px 0;  border: 1px solid #ddd;  background: #f0f0f0 url(crown.gif) no‑repeat 5px 10px;
  • 3. Images:  1. Firebug Net Panel  2. Firebug HTTP headers for request and response  3. Firebug HTML/CSS Inspector
  • 4. 4. Firebug JavaScript Debugger  5. Y!Slow Weight Graphs