The Secret Weapons of the AOL Optimization Team Dave Artz Secret - - PowerPoint PPT Presentation

▶
the secret weapons of the aol optimization team
SMART_READER_LITE
LIVE PREVIEW

The Secret Weapons of the AOL Optimization Team Dave Artz Secret - - PowerPoint PPT Presentation

Apr 03, 2024 374 likes •829 views

The Secret Weapons of the AOL Optimization Team Dave Artz Secret Weapon #1: Apache Mods 4 sec. 2.5 sec. modconcat http://code.google.com/p/modconcat/ Once installed, lets you reference any CSS or JS file on your server like this:

slide-1
SLIDE 1

The Secret Weapons of the AOL Optimization Team

Dave Artz

slide-2
SLIDE 2

Secret Weapon #1:

Apache Mods

slide-3
SLIDE 3

2.5

sec.

4

sec.

slide-4
SLIDE 4

modconcat

http://code.google.com/p/modconcat/

Once installed, lets you reference any CSS or JS file on your server like this:

http://www.yourdomain.com/optional/path/?? filename1.js,subdirectory/filename2.js,filename3.js

Honors the cache headers of the youngest file

slide-5
SLIDE 5

modjsmin

http://code.google.com/p/modjsmin/

Once installed, all JS files are minified on demand, leaving commented source intact Ported from Doug Crockford’s C library

slide-6
SLIDE 6

292 KB

slide-7
SLIDE 7

40 KB

slide-8
SLIDE 8

86% smaller 1.5 sec. faster

Original

slide-9
SLIDE 9

moddims

http://code.google.com/p/moddims/

Once installed, lets you reference any image on your server like this:

http://www.yourdomain.com/dims/resize/320x240/quality/90/ http://www.yourdomain.com/images/full-quality-image.jpg

Manipulate image compression levels on the fly Resize large full quality images to thumbnails

slide-10
SLIDE 10

Secret Weapon #2:

Friendly Iframes

slide-11
SLIDE 11
slide-12
SLIDE 12

The Friendly Iframe

Quarantines blocking JS ads in their own little bubble so content can continue rendering When finished loading, text ads are copied to the parent and pick up CSS styles Ad creatives can expand out of the frame without any cross-domain issues Simple demo of the technique: http://www.artzstudio.com/files/fif-demo/

slide-13
SLIDE 13

Secret Weapon #3:

“On Demand” Solutions

slide-14
SLIDE 14
slide-15
SLIDE 15
slide-16
SLIDE 16
slide-17
SLIDE 17

“Morphing”

môrf·ing verb

  • 1. Using placeholder HTML elements that have

all the data necessary to transform into another HTML element (typically heavier in byte size) on demand

slide-18
SLIDE 18

ClickTale found that 78% of user page views do not reach the bottom of the page

Source: ClickTale Blog, Unfolding the Fold

http://blog.clicktale.com/2006/12/23/unfolding-the-fold/

slide-19
SLIDE 19

Keep your eyes on the Net panel...

slide-20
SLIDE 20
slide-21
SLIDE 21

Sonar

Solution for detecting if an object is visible (on

  • r near) the screen, and then doing something

Example usage: sonar.add({obj:”obj_id”, px : 200, callback : function(){...}});

See http://www.artzstudio.com/files/sonar/

slide-22
SLIDE 22

Secret Weapon #4:

ESR

(Executive Speed Report)

slide-23
SLIDE 23
slide-24
SLIDE 24
slide-25
SLIDE 25
slide-26
SLIDE 26
slide-27
SLIDE 27
slide-28
SLIDE 28

Executive Speed Report

Provides full transparency on the performance

  • f AOL websites with a competitive focus

Products and pages are “taggable” so people can get a view of what they care about “Self serve” lets anyone manage the URL sets, ensuring the right pages get measured

slide-29
SLIDE 29

Secret Weapon #5:

Auditron

slide-30
SLIDE 30

“This is wrong.”

  • Lucius Fox, The Dark Knight
slide-31
SLIDE 31
slide-32
SLIDE 32
slide-33
SLIDE 33
slide-34
SLIDE 34
slide-35
SLIDE 35

Our Secret Weapons

Apache Mods (dims, concat, jsmin) Friendly Iframe “On Demand” Solutions (morphing, sonar) ESR (Executive Speed Report) Auditron

slide-36
SLIDE 36

Top Secret Weapon:

Beacon

slide-37
SLIDE 37

Beacon

Loads asynchronously as the first JS object on the page; small unobtrusive library (2K) Internally used to track page view, visit, clicks, time spent, etc. Sends load time of the page back on clicks (window.onload time - beacon initialization time) Currently does not include server response times; purely front end load time measurement

slide-38
SLIDE 38

Our First Experiment

Take a sample of visits For each visit, compute the average load time across the pages viewed Break the visits into 10 groups (percentiles) based on the average load time Examine page views per visit of each group, from fastest to slowest

slide-39
SLIDE 39

AOL Autos

4 5 6 7 8 10th 20th 30th 40th 50th 60th 70th 80th 90th 100th Visit Load Time Percentile* Average Page Views per Visit

*10th is fastest 10% of the visit sample, 100th is slowest 10%

slide-40
SLIDE 40

AOL Money & Finance

2 3 4 5 6 7 8 9 10th 20th 30th 40th 50th 60th 70th 80th 90th 100th Visit Load Time Percentile* Average Page Views per Visit

*10th is fastest 10% of the visit sample, 100th is slowest 10%

slide-41
SLIDE 41

AOL Shopping

3 3.5 4 4.5 10th 20th 30th 40th 50th 60th 70th 80th 90th 100th Visit Load Time Percentile* Average Page Views per Visit

*10th is fastest 10% of the visit sample, 100th is slowest 10%

slide-42
SLIDE 42

Moviefone

3.5 4.5 5.5 6.5 7.5 10th 20th 30th 40th 50th 60th 70th 80th 90th 100th Visit Load Time Percentile* Average Page Views per Visit

*10th is fastest 10% of the visit sample, 100th is slowest 10%

slide-43
SLIDE 43

Conclusions

Visits experiencing the fastest load times delivered us the most page views per visit More study is needed to determine why one site’s “profile” differs from the other Dave needs feedback on the methodology, and

  • ther studies to do with this data
slide-44
SLIDE 44

Done.

AOL e-mail: david.artz@corp.aol.com Personal e-mail: dave@artzstudio.com Twitter & AIM: artzstudio Blog: artzstudio.com