Optimising the RSPB website (2011)

32
Optimising www.rspb.org.uk

Transcript of Optimising the RSPB website (2011)

Page 1: Optimising the RSPB website (2011)

Optimisingwww.rspb.org.uk

Page 2: Optimising the RSPB website (2011)

Where are we?• Very nearly came a cropper over BGBW weekend

• Homepage intermittently unavailable

• ASP queue overwhelmed

• Content Broker overstretched

• Community very slow

• Website design has it’s roots in 2002

• Hardware at least 6 years old

Page 3: Optimising the RSPB website (2011)

How did we get here?• Traffic increasing year on year

• Resource-hungry functionality more prevalent

• No time set aside for maintenance

• No understanding of real-world performance (until late 2009)

Page 4: Optimising the RSPB website (2011)

Visits: 2002 to present

300000

600000

900000

1200000

1500000

1800000

2100000

2004

2005

2006

2007

2009

2010

2008

7xNew

servers

January2004

May2010

Page 5: Optimising the RSPB website (2011)

Does it really matter?• Increased user frustration = brand damage

• Higher exit rates = users dissatisfied

• Fewer page views = ineffective engagement

• Lower conversion rates = wasted ad spend

• No spare capacity = can’t capitalise on unexpected traffic

• Google now including speed in results algorithm (April 2010)

Page 6: Optimising the RSPB website (2011)

Best practice• Follow W3C standards

• Use Cascading Style Sheets

• Optimise images

• Make as few requests as possible

• Reduce size of response as much as possible

• Optimise render time

Page 7: Optimising the RSPB website (2011)

Best practice today• Zip plain text elements

• Cache binaries

• CSS Sprites

• Optimise server config

• Minify Javascript & CSS

• Compile Javascript

• Rendering more efficient

• Load Javascript last

• Pre-fetch elements

• Reduce cookie size

• Simplify HTML structure

• and plenty more...

Page 8: Optimising the RSPB website (2011)

Says who?• Google and Yahoo publish guidelines

• The faster your site, the faster they can index it

• Some rules apply only to high-traffic sites

• Test with Firefox extensions - YSlow and Google Page Speed

Page 9: Optimising the RSPB website (2011)

YSlow

Page 10: Optimising the RSPB website (2011)

YSlow

Page 11: Optimising the RSPB website (2011)

YSlow

Page 12: Optimising the RSPB website (2011)

Our homepage E

HTTP requests 66

Requests on repeat visits 63

Total size 451Kb

Compression None

Domains 17

Javascript files 11

Page 13: Optimising the RSPB website (2011)

YSlow comparison

0

25

50

75

100

Nat Trust RSPB BT BTO WWF WT BBC YouTube Yahoo Tesco Amazon Google

87828080777474

6867605956

Scores collected in April 2010

Page 14: Optimising the RSPB website (2011)

We’re due a service

Page 15: Optimising the RSPB website (2011)

What can we improve?

Rendercomplete

Response time

Connectedto server

First bytereturned

Downloadcomplete

DNS resolved

SERVER-SIDE CLIENT-SIDE

Page 16: Optimising the RSPB website (2011)

Reduce number of requests• Cache as much as possible (= no request at all)

• Combine multiple scripts into one request

• Combine multiple CSS files into one request

• Combine multiple images into one using CSS sprites

• Use CSS3 properties instead of images

Page 17: Optimising the RSPB website (2011)

Reduce size of response• Zip plain text elements (shrinks files by 70%)

• Minify CSS

• Compile Javascript with Google Closure

• Reduce size of HTML DOM

• Use shorter IDs and Class names

• Re-use cached Javascript libraries to keep scripts lean (JQuery)

Page 18: Optimising the RSPB website (2011)

Improve render time• Put CSS in the <head>

• Use <link> instead of @import

• Put Javascript at bottom (or delay scripts until onload)

• Smaller HTML DOM

• Avoid tables for layout

• Use CSS3 properties instead of images

Page 19: Optimising the RSPB website (2011)

Server-side changes• All pages cached for 1 hour by default

• Redirects managed by IIRF instead of Content Broker

• Content Broker Event queries using new trigger table

• Minimise objects initialised

• Turn off ViewState

• Functions compiled into RSPB.Tridion.dll

Page 20: Optimising the RSPB website (2011)

Where are we now?• Number of requests per page down 75% on average

(down 95% for repeat visitors)

• Average size of response down 30% (down 98% for repeat visitors)

• Render time as optimised as we can make it

• Response times dramatically improved

• But applications remain untouched

• ...and we still need new hardware

Page 21: Optimising the RSPB website (2011)

0

10

20

30

40

Bittern pageLo

ad t

ime

in s

eco

nd

s

Page 22: Optimising the RSPB website (2011)

0

12.5

25.0

37.5

50.0

Vacancies pageLo

ad t

ime

in s

eco

nd

s

Page 23: Optimising the RSPB website (2011)

0

15

30

45

60

Events pageLo

ad t

ime

in s

eco

nd

s

Page 24: Optimising the RSPB website (2011)

0

7.5

15.0

22.5

30.0

HomepageLo

ad t

ime

in s

eco

nd

s

Page 25: Optimising the RSPB website (2011)

Our homepage C

HTTP requests 66 31

Requests on second visit 63 10

Total size 451Kb 196Kb

Compression Partial

Domains 17 11

Javascript files 11 5

Page 26: Optimising the RSPB website (2011)

YSlow scores

0

25

50

75

100

Nat Trust RSPB BT BTO WWF WT BBC YouTube Yahoo Tesco Amazon Google

87828080777474

6867605956

Page 27: Optimising the RSPB website (2011)

YSlow scores

0

25

50

75

100

Nat Trust RSPB BT BTO WWF WT BBC YouTube Yahoo Tesco Amazon Google

87828080777474

686760

79

56

Page 28: Optimising the RSPB website (2011)

YSlow scores

0

25

50

75

100

Nat Trust RSPB BT BTO WWF WT BBC YouTube Yahoo Tesco Amazon Google

87828080777474

686760

91

56

Page 29: Optimising the RSPB website (2011)

Vacancies homepage A

HTTP requests 16

Requests on second visit 4

Total size 113Kb (6Kb)

Compression Yes

Domains 2

Javascript files 3

Page 30: Optimising the RSPB website (2011)

What else can we do?• Optimise IS-built applications

• Reserve hardware for www.rspb.org.uk only

• Use pre-fetching for predictable journeys

• Create development standards

• Creative Services Web Team and IS Web Developers should work more closely - not in silos

Page 31: Optimising the RSPB website (2011)

References

• High Performance Websitesby Steve Souders

• Let’s make the web fasterhttp://code.google.com/speed

• Exceptional Performancehttp://developer.yahoo.com/performance

Page 32: Optimising the RSPB website (2011)

Any questions?

If you think of anything afterwards:

[email protected]

Extension 3248