Loading presentation...

Present Remotely

Send the link below via email or IM


Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.


20100419 - Gesellschaft für Informatik - High Performance Websites

Prezi on High Performance Websites and Performance Optimization by Tobias Baldauf

Tobias Baldauf

on 11 May 2013

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of 20100419 - Gesellschaft für Informatik - High Performance Websites

Websites Tobias Baldauf
Web-Developer seit 1999
Performance-Optimization seit 2009 tobias-baldauf.de
twitter.com/tbaldauf + 100ms = - 1% Sales + 400ms = - 9% FullPageLoad + 500ms = - 20% Queries - 3500ms = + 12% Sales Performance-Optimization = - 50% Outbound Traffic Performance-Optimization = + 10.000.000 Downloads HTML JS CSS XML 0.5t FullPageLoad Event Website ca. 60 HTTP-Requests 256 Minify EXPIRE HEADER STATIC image23.png?v=42 Cache 2/6 2/6 4 6 8
Browser-Limits HTTP-Requests Load Sharing Domains / Servers - Static Content, HTTP 1.0
- Images, HTTP 1.0
- AJAX, HTTP 1.1 think BIG
CDN Google AJAX Libraries API !
! HTML Grid-Patterns

KISS, !table hot hot hot hot <!DOCTYPE html> HTML5 + 5% Performance CSS # / . * / > / + / . classes. ftw. OOCSS @import Javascript "defer" / JS eval() string img PunyPNG, YSlow moddims optiPNG via cron CSS-Sprites Repaints / Reflows wikipedia.jp google.jp Repaint: Visibility-Check !inline-JS
Animations: position:fixed / absolute
!tables outline, visibility, background-color Reflow: Position-Check display, padding, margin, font, position, top, left, etc. https /server/folder/css/styles.css 1.4 id & class vs. advanced selectors 3rd Party Content !document.write
!iFrames ? ! Steve Souders http://stevesouders.com/ http://twitter.com/souders Stoyan Stefanov http://www.phpied.com/ http://twitter.com/stoyanstefanov Nicole Sullivan http://www.stubbornella.org/ http://twitter.com/stubbornella Browserscope, P3PC, SpriteMe etc. High Performance Javascript etc. CSS-Performance, Repaints & Reflows etc. YSlow http://developer.yahoo.com/yslow/ webpagetest.org http://pagetest.sourceforge.net/ http://blog.patrickmeenan.com/ Tobias Baldauf http://www.tobias-baldauf.de http://twitter.com/tbaldauf http://developer.yahoo.com/performance/rules.html, http://t3n.de/magazin/praxistipps-steigerung-website-performance-224077/ DANKE!
Full transcript