Slide

Very High PerformanceWebsitesThe Next Competitive Advantage*

Slide

Me

_Software Developer at SinnerSchrader_JavaScript Victim Extraordinair_http://nonblocking.io_@cramforce

2

Slide 3

Faster,more responsiveWebsitesperform significantly better

Slide 4

Higher Conversion

Slide 5

Longer, Yes LongerDuration on Site

Slide 6

More Page Impressions

Slide

Load time now a≠ects Search Ranking

7

Go watchhttp://www.youtube.com/watch?v=nCgQDjiotG0

Proof

Slide 10

500 ms slower20% drop in tra∞c

Slide 11

100 ms slower1% drop in sales

Slide 12

1000 ms fasterDownload Page2,7% better conversion

Slide 13

5000 ms faster12% better conversion

Potential

Slide 15

8300 ms load time6000 ms timewasted

Slide 16

2900 ms load time2200 ms timewasted

What‘s a girl to do?

Slide 19

Win the Warin the Frontend

Slide 20

FrontendBackend

Slide 21

Now Some Very Easy Rules

Slide 22

Make fewer HTTP requestsUse a Content Delivery Network (CDN)Add Expires headersCompress components with gzipPut CSS at topPut JavaScript at bottomAvoid CSS expressionsMake JavaScript and CSS externalReduce DNS lookupsMinify JavaScript and CSSAvoid URL redirectsRemove duplicate JavaScript and CSSConfigure entity tags (ETags)Make AJAX cacheableUse GET for AJAX requestsReduce the number of DOM elementsAvoid HTTP 404 (Not Found) errorReduce cookie sizeUse cookie-free domainsAvoid AlphaImageLoader filterDo not scale images in HTMLMake favicon small and cacheable

If it is so Great,why doesn‘t Everybody do it?

Slide 24

Because it isHARD

Slide 25

Slide 26

Web DevelopmentFinally isHard again

Slide 27

Hard =Hard to Copy

Slide 28

Hard to Copy =Potential USP

Slide 29

You can build a better Website than your Competitor!

Slide 30

Faster

CostRevenue

Slower

Slide 31

20% of the possible optimizations get you 50% of the way

Not everything is a pareto distribution

Take Aways

Slide 33

Performance is hard,hire the right People!

Slide 34

3 Quick Wins to ask your „Webmaster“

Slide 35

1. Do we do Domain-Sharding?

2. Do we load all JavaScript at the bottom of the page?

3. Do we minimize the JavaScript?

Slide 36

Faster Websites =_ More PIs_ Higher Conversion_ Better SEO_ Better Karma

Slide 37

Steve Soudershttp://stevesouders.com/

Fast by Defaulthttp://www.slideshare.net/hashc0de/fast-by-default-2400000

Stoyan Stefanovhttp://www.phpied.com/

High Performance Web Pages - 20 new best practiceshttp://www.slideshare.net/stoyan/high-performance-web-pages-20-new-best-practices

Don‘t make me waithttp://www.slideshare.net/stoyan/dont-make-me-wait-or-building-highperformance-web-applications

The Performance Business Pitchhttp://www.phpied.com/the-performance-business-pitch/

Nicole Sullivanhttp://www.stubbornella.org

Designing fast Websiteshttp://www.slideshare.net/stubbornella/designing-fast-websites-presentation

Slide 38

http://en.oreilly.com/velocity2009/public/schedule/detail/7709

http://blog.mozilla.com/metrics/2010/03/31/firefox-page-load-speed-part-i/

http://en.oreilly.com/velocity2009/public/schedule/detail/7579

http://googlewebmastercentral.blogspot.com/2010/04/using-site-speed-in-web-search-ranking.html

More Sources

http://nonblocking.io

@cramforce

Thank You for Listening!