T HIR D

PART Y C O N T E N T T HIR D

PART Y C O N T E N T T H E W E AK L IN K IN YO U R C H AIN ? T H E W E AK L IN K IN YO U R C H AIN ? S i m o n

H e a rn e

P ri n c i p l e

E n g i n e e r

@

A k a m a i

p e r f m a t t e r s

c o n f

2 0 1 8 @ S i m o n H e a r n e

AKA AKA BAD PE O PL E BAD PE O PL E

D O IN G H O R R IBL E T H IN G S D O IN G H O R R IBL E T H IN G S

T O G O O D S IT E S T O G O O D S IT E S @ S i m o n H e a r n e

T H E M O D E R N W E B W O R K F L O W 10 1 T H E M O D E R N W E B W O R K F L O W 10 1 m a k e

s om e t hin g

� t e s t

it

� s hip

it

� . . .   p ut

t a g s

on it

� @ S i m o n H e a r n e

AM P G O T S O M E T H IN G R IG H T

� AM P G O T S O M E T H IN G R IG H T

� @ S i m o n H e a r n e

tim kad le c.c o m /re mem bers /2 018-0 3-1 9-h ow -fa st- is -a m p-r e ally /

W H A T I' V E L E AR N E D IN

5 YE AR S W H A T I' V E L E AR N E D IN

5 YE AR S w e

s e e m

t o ha v e

le s s

c ont r o l t h a n

e v e r @ S i m o n H e a r n e

@ S i m o n H e a r n e T H E " BU S IN E S S "

� T H E " BU S IN E S S "

�

@ S i m o n H e a r n e T AGS SERVE BUSINESS GOALS T AGS SERVE BUSINESS GOALS Me a s ur e m e nt

&

An a ly t ic s Ad s

&

R e t a r g e t in g " O p t im iz a t ion "

&

T e s t in g Com m e nt s

&

L i v e

C h a t T a g

Ma na g e m e nt

@ S i m o n H e a r n e THE THE MONEY MONEY   �   � “ W e

k n o w

t h a t

O p t i m i z e l y

s l o w s

d o w n

t h e s i t e ,

b u t

i t

w i l l

g e t

u s

$ 7 5 0 k

i n c r e a s e d r e v e n u e

t h i s

y e a r ” H o lid a y

w e b s it e ,

U K

@ S i m o n H e a r n e THE THE IT'S NO T MY JOB IT'S NO T MY JOB   �   � “ W e

s u s p e c t

i t

s l o w s

t h e

s i t e

d o w n ,

w e h a v e n ’ t

t e s t e d

i t .

M a r k e t i n g

s a y s

i t ’ s c r i t i c a l

t o

t h e i r

l a t e s t

T V

c a m p a i g n

s o t h e r e ’ s

n o

p o i n t

a r g u i n g ” B u d g e t

a ir lin e ,

U K

@ S i m o n H e a r n e THE THE T AG MANAGER T AG MANAGER   �   � “ A l l

t h e

t a g s

g o

t h r o u g h

t h e

t a g

m a n a g e r , s o

t h e y

s h o u l d

b e

� n e . ” C lic k s

a n d

m o r t a r

s t o r e ,

U K

@ S i m o n H e a r n e BUT WHA T ABOUT THE BUT WHA T ABOUT THE R ISK? R ISK? � �

@ S i m o n H e a r n e PS: A VAIL ABILITY HEURISTIC 101 � PS: A VAIL ABILITY HEURISTIC 101 �

@ S i m o n H e a r n e PS: A VAIL ABILITY HEURISTIC 101 � PS: A VAIL ABILITY HEURISTIC 101 � R e m e m b e r

w he n

F a c e b o o k

w e n t

d o w n ? R e m e m b e r

w he n

D is q u s

w e n t

d o w n ? R e m e m b e r

w he n

M a x y m is e r

w e n t

d o w n ? R e m e m b e r

w he n

D y n

w e nt

d ow n? le f t

p a d

�

@ S i m o n H e a r n e RISK 1: RISK 1: M AL IC IO U S C O D E IN J E C T IO N

� M AL IC IO U S C O D E IN J E C T IO N

�

@ S i m o n H e a r n e HOW MUCH OF YOUR CODE HA S VULNERABILITIES? HOW MUCH OF YOUR CODE HA S VULNERABILITIES?

beta .h ttp arc h iv e.o rg /r e p o rts /s ta te -o f- t h e-w eb # pctV uln

@ S i m o n H e a r n e CRYPTOJACKING CRYPTOJACKING

www.t h eve rg e .c o m /2 018/3 /2 2/1 7147320/c ry p to ja ck in g-8 500-p erc e n ta g e -p o in ts -b it co in -m onero -s p ik e- sy m an te c-s e cu rit y-m ining

@ S i m o n H e a r n e IT HAPPENS TO THE BIGGEST PL A YERS IT HAPPENS TO THE BIGGEST PL A YERS

tw itte r.c o m /n ytim es/s ta tu s/3 95 8547840

@ S i m o n H e a r n e INTERNET 'SERVICE' PROVIDERS INTERNET 'SERVICE' PROVIDERS

blo g.r y an ke arn ey.c o m /2 013/0 1/c o m ca st-c a u gh t-in te rc e p tin g-a n d -a lt erin g-y o ur-w eb -t r a f� c/

@ S i m o n H e a r n e CONTENT DELIVERY NETWORKS CONTENT DELIVERY NETWORKS

git hub .c o m /a m ppro je ct/a m ph tm l/is su es/2 380

@ S i m o n H e a r n e CONTENT DELIVERY NETWORKS CONTENT DELIVERY NETWORKS

@ S i m o n H e a r n e UNINTENTIONAL DA T A COLLECTION UNINTENTIONAL DA T A COLLECTION w e b s i t e

t r a c k i n g

i s

a

" s e c u r i t y

d i s a s t e r w a i t i n g

t o

h a p p e n " fr e ed om -t o -t in ke r.c o m /2 018/0 2/2 6/n o -b ound arie s-fo r-c re d en tia ls-p assw ord -le ak s-t o -m ixpan el- an d -s e ssio n- re p la y-c o m pan ie s/

@ S i m o n H e a r n e RISK 2: RISK 2: A V AIL ABILITY � A V AIL ABILITY �

@ S i m o n H e a r n e DO THEY FAIL GRACEFULL Y? DO THEY FAIL GRACEFULL Y? 0 : 0 0 /

0 : 0 6

@ S i m o n H e a r n e DO THEY FAIL GRACEFULL Y? DO THEY FAIL GRACEFULL Y? 0 : 0 0 /

0 : 2 4

@ S i m o n H e a r n e ARE THEY USING A CDN? ARE THEY USING A CDN? (& IS IT A S GOOD A S YOURS?) (& IS IT A S GOOD A S YOURS?)

@ S i m o n H e a r n e WHA T IS THEIR SL A FOR A VAIL ABILITY? WHA T IS THEIR SL A FOR A VAIL ABILITY? (& IS IT A S GOOD A S YOURS?) (& IS IT A S GOOD A S YOURS?)

help .o pti m iz e ly .c o m /A cco u nt_ Setti ngs/O pti m iz e ly s u ppo rt p la n s

@ S i m o n H e a r n e A VAIL ABILITY TO THE USER A VAIL ABILITY TO THE USER G o v e r nm e nt

/

g e o

b lo c k in g Ad

b lock ing T r a c k e r

b lock in g R a nd om

c r a p

@ S i m o n H e a r n e RISK 3: RISK 3: C O D E Q U AL IT Y � C O D E Q U AL IT Y �

@ S i m o n H e a r n e XSS VULNERABILITES XSS VULNERABILITES

ra n d yw este rg re n .c o m /w id esp re ad -x ss-v u ln era b ilit ies/

@ S i m o n H e a r n e XSS VULNERABILITES XSS VULNERABILITES

d o c u m e n t . w r i t e ( " < d i v

c l a s s

' v d b _ p l a y e r

v d b _ 5 6 5 e c 7 7 5 e 4 b 0 9 2 e b c 9 6 8 5 c e 8 5 3 1 8 0 f 5 d e 4 b 0 6 6 2 0 8 a 6 3 2 7 9 a '

v d b _ p a r a m s

' m . p u b _ i d

6 0 6 4 1 3 & m . u r l

h t t p : / / n y p o s t . c o m /

1 '

a l e r t ( 1 )

'

a l e

< / d i v

" ) ;

ra n d yw este rg re n .c o m /w id esp re ad -x ss-v u ln era b ilit ies/

@ S i m o n H e a r n e DIFFERENT RELE A SE SCHEDULES DIFFERENT RELE A SE SCHEDULES HOW DO YOU KNOW WHEN IT CHANGES? HOW DO YOU KNOW WHEN IT CHANGES?

< script

src

"//s7.addthis.com/addthis_widget.js"

async

</ script

www.a d dth is .c o m

@ S i m o n H e a r n e JUST PL AIN THOUGHTLESS JUST PL AIN THOUGHTLESS

@ S i m o n H e a r n e RISK 4: RISK 4: PE R F O R M AN C E

� PE R F O R M AN C E

�

@ S i m o n H e a r n e SELF-POLICING ISN'T GOOD ENOUGH SELF-POLICING ISN'T GOOD ENOUGH . . .

t h e

X

W e b

R e f e r e n c e

S n i p p e t

w a s a v a i l a b l e

. . .

a n d

t h e

d o w n l o a d

t i m e

o v e r H T T P

d i d

n o t

e x c e e d

5 0 0

m s . S n i p p e t

i s

s a m p l e d

e v e r y

m i n u t e

f r o m

a v a r i e t y

o f

U .S.

l o c a t i o n s . s t a t u s . o p t im iz e ly . c o m

@ S i m o n H e a r n e TOOLS AREN'T EQUAL TOOLS AREN'T EQUAL

ora n gevalle y.n l/en /b lo g/9 -a b -t e stin g-t o ols -c o m pare d -o n -s it e-s p eed -im pact/

@ S i m o n H e a r n e THE WEB IS VARIABLE THE WEB IS VARIABLE T o p

2 5 0

re s o u rc e s

f ro m

H T T P

A r c h i v e

@ S i m o n H e a r n e THE WEB IS VARIABLE THE WEB IS VARIABLE T o p

2 5 0

re s o u rc e s

f ro m

A k a m a i

m P u l s e

@ S i m o n H e a r n e RESOURCE TIMING IS THE HERO WE NEED RESOURCE TIMING IS THE HERO WE NEED h ttp s : / /w w w . w 3 . o rg /TR / r e s o u r c e

ti m i n g

1 /

@ S i m o n H e a r n e RESOURCE TIMING IS THE HERO WE NEED RESOURCE TIMING IS THE HERO WE NEED NO T WITHOUT TIMING-ALLOW-ORIGIN � NO T WITHOUT TIMING-ALLOW-ORIGIN �

nic j.n et/ re so urc eti m in g-v is ib ility -th ir d -p arty -s c rip ts -a d s-a n d -p ag e -w eig h t/

@ S i m o n H e a r n e RESOURCE TIMING WON'T SA VE US RESOURCE TIMING WON'T SA VE US �

no r e d ir e c t

inf o r m a t io n �

lim it e d

d a t a

on

7 2 %

of

t hir d

p a r t y

c o n t e n t �

only t he

� r s t

1 5 0

r e q u e s t s

�

no d a t a

on old

iD e v ic e s �

no d a t a

f or

c r o s s

o r ig in

if r a m e s

• l im it ca n b e i n cre ase d p er p ag evie w d eve lo per.a k am ai.c o m /b lo g/2 017/0 7/2 6/m easu rin g-p erfo rm an ce -t h ir d -p arty -c o ntr ib uto rs /

@ S i m o n H e a r n e RISK 4: RISK 4: PE R F O R M AN C E

� PE R F O R M AN C E

� (FOR RE AL THIS TIME) (FOR RE AL THIS TIME)

@ S i m o n H e a r n e CPU IS OUR BIGGEST BO T TLENECK ⏳ CPU IS OUR BIGGEST BO T TLENECK ⏳

@ S i m o n H e a r n e WHO'S POLICING THE THIRD-PARTIES? WHO'S POLICING THE THIRD-PARTIES?

gith ub .c o m /jpvin ce n t/3 rd-p arty -c p u -a b use r

@ S i m o n H e a r n e VARIABLE CPU TIME VARIABLE CPU TIME ON SYNTHETIC AGENTS! ON SYNTHETIC AGENTS!

@ S i m o n H e a r n e THE MOST FRUSTRA TING PERF BUG, EVER THE MOST FRUSTRA TING PERF BUG, EVER

@ S i m o n H e a r n e WHO WA TCHES THE WA TCHMEN? WHO WA TCHES THE WA TCHMEN?

ca le n d ar.p erf pla n et. co m /2 017/a n -a u d it- of- b oom era n gs-p erfo rm an ce /

@ S i m o n H e a r n e RISK 4: RISK 4: PE R F O R M AN C E

� PE R F O R M AN C E

� (PART III) (PART III)

@ S i m o n H e a r n e DEL A YING ONLOAD DEL A YING ONLOAD

@ S i m o n H e a r n e KEEPING THE RADIO A WAKE KEEPING THE RADIO A WAKE

W E H A V E L IT T L E C O N T R O L W E H A V E L IT T L E C O N T R O L

O V E R W H IC H AR E U S E D O V E R W H IC H AR E U S E D But

t he r e

a r e

t h in g s

w e

c a n

d o . . . @ S i m o n H e a r n e

@ S i m o n H e a r n e ST AGE 1: ST AGE 1: F IN D O U T W H A T ' S T H E R E F IN D O U T W H A T ' S T H E R E

fo rtu ne.c o m /2 015/0 7/0 8/a d b lo ck -d ata /

@ S i m o n H e a r n e SYNTHETIC TESTING (WEBPAGETEST) SYNTHETIC TESTING (WEBPAGETEST)

web pag e te st. org /

@ S i m o n H e a r n e SYNTHETIC TESTING (WEBPAGETEST) SYNTHETIC TESTING (WEBPAGETEST)

@ S i m o n H e a r n e

@ S i m o n H e a r n e BONUS: THIRD-PARTY CA TEGORIZA TION BONUS: THIRD-PARTY CA TEGORIZA TION | g ith ub .c o m /s im onhearn e/th ir d party db th ird party db.a p psp o t. co m

@ S i m o n H e a r n e RE AL USER MONITORING � RE AL USER MONITORING � 0 : 0 0 /

0 : 2 2 A k a m a i

m P u l s e

@ S i m o n H e a r n e ST AGE 2: ST AGE 2: D E T E R M IN E T H E IM PAC T D E T E R M IN E T H E IM PAC T

@ S i m o n H e a r n e SYNTHETIC TESTING (WEBPAGETEST) SYNTHETIC TESTING (WEBPAGETEST)

@ S i m o n H e a r n e SYNTHETIC TESTING (MADE E A SY) SYNTHETIC TESTING (MADE E A SY)

@ S i m o n H e a r n e SYNTHETIC TESTING (MADE E A SY) SYNTHETIC TESTING (MADE E A SY)

gith ub .c o m /s im onhearn e/th ir d -p arty -im pact/

@ S i m o n H e a r n e RESOURCE IMPACT FROM SYNTHETICS � RESOURCE IMPACT FROM SYNTHETICS �

blo g.c a tc hpo in t. co m /2 018 /0 1/1 0/u sin g-c a tc hpo in t-t o -a n aly ze -t h ir d -p arty -im pact/

@ S i m o n H e a r n e RESOURCE IMPACT FROM SYNTHETICS � RESOURCE IMPACT FROM SYNTHETICS �

sp eed cu rv e.c o m /b lo g/u x-fo cu s-fo r-w ate rfa lls -a n d -t h ir d -p artie s/

@ S i m o n H e a r n e RESOURCE IMPACT FROM RUM RESOURCE IMPACT FROM RUM

@ S i m o n H e a r n e ADVERTISING PARTNERS ADVERTISING PARTNERS P a r t ne r

1

=

~ 4 0 0 m s

s l o we r

t ha n p a r t ne r

2 Mig r a t ing

a ll a d s

=

2 2 0 m s

f a s t e r

p a g e

loa d Ad d it iona l r e v e n u e

~

$ 1 2 ,000 p e r

m o n t h L a rg e

U S

p u b l i s h i n g

c o m p a n y

@ S i m o n H e a r n e LONGT A SKS API LONGT A SKS API

@ S i m o n H e a r n e BONUS: DETERMINE THE VALUE! BONUS: DETERMINE THE VALUE!

blo g.s u m all.c o m /journ al/ o pti m iz e ly -g o t- m e-� re d .h tm l

@ S i m o n H e a r n e " E v e ry t h i n g

s h o u l d

h a v e

a

v a l u e , b e c a u s e

e v e ry t h i n g

h a s

a

c o s t " T i m

K a dl e c

f r e e l a n c e

w e b p e r f

g o d

@ S i m o n H e a r n e ST AGE 3: ST AGE 3: M E A S U R E T H E M AN D R E PO R T O N T H E M M E A S U R E T H E M AN D R E PO R T O N T H E M

@ S i m o n H e a r n e CONTENT SECURITY POLICY � CONTENT SECURITY POLICY � (REPORT-ONL Y) (REPORT-ONL Y)

{

" c s p

r e p o r t " :

{

" d o c u m e n t

u r i " :

" h t t p s : / / y o u r w e b s i t e . c o m / " ,

" r e f e r r e r " :

" " ,

" v i o l a t e d

d i r e c t i v e " :

" s t y l e

s r c " ,

" e f f e c t i v e

d i r e c t i v e " :

" s t y l e

s r c " ,

" o r i g i n a l

p o l i c y " :

" " ,

" d i s p o s i t i o n " :

" e n f o r c e " ,

" b l o c k e d

u r i " :

" i n l i n e " ,

" l i n e

n u m b e r " :

4 ,

" c o l u m n

n u m b e r " :

3 ,

" s o u r c e

f i l e " :

" h t t p s : / / s t a t i c . h o t j a r . c o m / c / h o t j a r

7 3 0 7 1 6 . j s ? s v

6 "

" s t a t u s

c o d e " :

0 ,

" s c r i p t

s a m p l e " :

" "

}

repo rt- uri .c o m

@ S i m o n H e a r n e SYNTHETIC TESTING � SYNTHETIC TESTING �

@ S i m o n H e a r n e RUM � RUM � T he

b e s t

w a y

t o m onit or

r e s o u r c e s ,

e v e n w it h it s

lim it a t io n s

@ S i m o n H e a r n e � WA TERFALLS � WA TERFALLS 0 : 0 0 /

0 : 4 5 A k a m a i

m P u l s e

@ S i m o n H e a r n e ST AGE 4: ST AGE 4: D E F E N D O U R S E L V E S

� D E F E N D O U R S E L V E S

�

@ S i m o n H e a r n e CONTENT SECURITY POLICY � CONTENT SECURITY POLICY �

ca n iu se .c o m /# fe at= co nte n ts e cu rit yp o lic y2

@ S i m o n H e a r n e CONTENT SECURITY POLICY � CONTENT SECURITY POLICY �

repo rt- uri .c o m

@ S i m o n H e a r n e CSP STRICT-DYNAMIC CSP STRICT-DYNAMIC

@ S i m o n H e a r n e CONTENT SECURITY POLICY � CONTENT SECURITY POLICY � �

Cr y p t oJ a c k in g �

X S S �

Ma int e na nce

@ S i m o n H e a r n e SUB-RESOURCE INTEGRITY � SUB-RESOURCE INTEGRITY � < link

rel

"stylesheet"

href

"//maxcdn.bootstrapcdn.com/.../bootstrap.min.css"

integrity

"

sha256-8EtRe6XWoFEEhWiaPkLaw...=

sha512-/5KWJw2mvMO2ZM5fndVxU...=

"

crossorigin

"anonymous"

< script

src

"//ajax.googleapis.com/.../jquery.min.js"

integrity

"

sha256-ivk71nXhz9nsyFDoYoGf2...=

sha512-7aMbXH03HUs6zO1R+pLye...=

"

crossorigin

"anonymous"

</ script

@ S i m o n H e a r n e SUB-RESOURCE INTEGRITY � SUB-RESOURCE INTEGRITY � �

Ma licious Co d e �

U nt e s t e d

Cha n g e s �

Ma int e na nce ⭐

S ig na t ur e

b a s e d

R e s t r ic t io n s . . . *

git hub .c o m /m ikew est/s ig natu re -b ase d -s ri

@ S i m o n H e a r n e SERVICE WORKER � SERVICE WORKER �

f u n c t i o n

t i m e o u t ( d e l a y )

{

r e t u r n

n e w

P r o m i s e ( f u n c t i o n ( r e s o l v e ,

r e j e c t )

{

s e t T i m e o u t ( f u n c t i o n ( ) {

r e s o l v e ( n e w

R e s p o n s e ( ' ' ,

{

s t a t u s :

4 0 8 ,

s t a t u s T e x t :

' R e q u e s t

t i m e d

o u t . '

} ) ) ;

} ,

d e l a y ) ;

} ) ;

}

s e l f . a d d E v e n t L i s t e n e r ( ' f e t c h ' ,

f u n c t i o n ( e v e n t )

{

/ /

O n l y

f e t c h

J a v a S c r i p t

f i l e s

f o r

n o w

i f

( /
. j s $ / . t e s t ( e v e n t . r e q u e s t . u r l ) )

{

e v e n t . r e s p o n d W i t h ( P r o m i s e . r a c e ( [ t i m e o u t ( 2 0 0 0 ) ,

f e t c h ( e v e n t . r e q u e s t . u r l ) ] ) ) ;

}

e l s e

{

e v e n t . r e s p o n d W i t h ( f e t c h ( e v e n t . r e q u e s t ) ) ;

}

} ) ;

ca le n d ar.p erf pla n et. co m /2 015/r e d ucin g-s in gle -p o in t-o f- fa ilu re -u sin g-s e rv ic e -w ork e rs /

@ S i m o n H e a r n e SERVICE WORKER � SERVICE WORKER � �

CD N

/

N e t w o r k

o u t a g e s �

N ot

on � r s t

p a g e v ie w �

Ma int e na nce �

Y ou c a n b r e a k

y o u r

s it e

@ S i m o n H e a r n e SELF-HOSTING / PROXYING ☔ SELF-HOSTING / PROXYING ☔

go ogle -w eb fo nts -h elp er.h ero ku ap p.c o m /fo n ts

@ S i m o n H e a r n e SELF-HOSTING / PROXYING ☔ SELF-HOSTING / PROXYING ☔

vw o.c o m /k now le d ge /h ost-v w o-ja v asc rip t- �le s-o n-y o ur-s e rv e r/

@ S i m o n H e a r n e SELF-HOSTING / PROXYING ☔ SELF-HOSTING / PROXYING ☔

co m munit y.a k am ai.c o m /c o m mun it y/w eb -p erfo rm an ce /b lo g/2 016/0 1/1 3/5 -w ay s-t o -p re ve n t-s lo w-3 rd -p arty - fr o nt-e n d -s e rv ic es

@ S i m o n H e a r n e SELF-HOSTING / PROXYING ☔ SELF-HOSTING / PROXYING ☔ �

CD N

/

N e t w o r k

o u t a g e s �

S ha r e d

T CP

c o n n e c t io n �

Ma int e na nce

@ S i m o n H e a r n e ST AGE 5: ST AGE 5: H A V E A T H IR D

PAR T Y PO L IC Y � H A V E A T H IR D

PAR T Y PO L IC Y � W ha t

d oe s

it

d o ? W ho use s

it ? W ha t ’ s

t he

r is k

t o

t h e

s it e ? H ow

d o y ou r e m o v e

it ?

@ S i m o n H e a r n e SHARE WITH O THER TE AMS! � SHARE WITH O THER TE AMS! �

sp eed cu rv e .c o m /d em o/t h ir dparty /

@ S i m o n H e a r n e THIRD-PARTY CONTENT MA Y BE A WE AK LINK THIRD-PARTY CONTENT MA Y BE A WE AK LINK BU T IT ' S H E R E T O S T A Y BU T IT ' S H E R E T O S T A Y

@ S i m o n H e a r n e FIVE THINGS YOU CAN DO TODA Y: FIVE THINGS YOU CAN DO TODA Y: K now w ha t ' s

t h e r e Me a s ur e

t he m H a v e

a

s olid

d e f e n s e S ha r e

t he

d a t a H a v e

t hir d

p a r t y

p o lic y

@ S i m o n H e a r n e F U R T H E R R E AD IN G F U R T H E R R E AD IN G

T HANK YO U ,

T HANK YO U ,

G O O D L U C K ! G O O D L U C K ! �

@S im onH e a r n e �

w e b p e r f . ninja / t o o ls �

s im onhe a r ne . g it h u b . io / w e a k

lin k s @ S i m o n H e a r n e