1. user
behavior
system http://www.matmotu.com
work @ youa WED team
http://t.sina.com/rank

2. user
behavior
system
marmot you
http://www.matmotu.com
work @ youa WED team
http://t.sina.com/rank

8. marmot

18. 100

20. flash
V.S
php
clickheat canvas

21. DOM
cpu dom
flash
dom
php clickheat
dom
canvas html5
DOM

23. referer+url
client js marmot server
marmotID
Sid+Mid url match
sessionID
client log
seq=0
server log
seq=n
processor API

24. mousemove mousedown target
mouseup click event type
dblclick focus timestamp
scroll keydown custom data

25. •
•
•
• API
•

27. O=(0,0)
1024*768 1280*800
O=(document.documentElement.scrollWidth/2|0,0)
align = middle
relative coordinate

28. DOM path
MDP
Marmot DOM Path

29. body
div#container(HTMLElement)
div(HTMLElement) div(HTMLElement)
Marmot.getPath
path=[div.container, ~1div]
path.replace(/~(d+)([^~]+)/gi,
'~$2:nth-of-type($1)')
.replace(/~/gi, '>')
.replace(/./gi, '#');
selector=’div#container>div:nth-of-type(1)’

31. • marmot.log.js click
• hover MDP •
• selector MDP •
•
• HDFS/
•

32. target
event type
timestamp
custom data

33. move
start
mouse mouse delta
move - move = hover
mouse mouse
down + up = click
mouse mouse mouse delta
down + move + up = select

39. body
x=300
div#container(HTMLElement)
y=100
div(HTMLElement) div(HTMLElement)
mdp selector = ‘div#container>div:nth-of-type(1)’
relative coordinate x = event.x; //300
relative coordinate y = event.y; //100
var el = document.querySelector(mdp selector); //
var xy = Dom.getXY(el);
var corrective x = xy[0] + relative coordinate x;
var corrective y = xy[1] + relative coordinate y;

41. 1024px
1px*1px
768px
Math.floor(document.documentElement.scrollWidth/n)
9px*9px

42. ...

43. ...

44. AB test

46. •A a->b->c->d->...
•B c->b->d->a->...
•C a->b->c->a->...
•D a->c->b->a->...
a->b->c->a

47. key path
['', 'input.rd_fv_30', 'input.phone_number', 'button.btn-charge']
similar path
['', 'input.phone_number', 'button.btn-charge', 'input.PassInputPassword0']
['', 'input.rd_fv_30', 'input.phone_number', 'button.btn-charge', 'input.PassInputUsername0',
'input.PassInputPassword0']
['', 'input.phone_number', 'button.btn-charge', 'input.PassInputPassword0']
['', 'input.rd_ct_slow', 'input.phone_number', 'button.btn-charge', 'div.pdc-
wrap~2div~1div~1div~1a', '']
['', 'input.phone_number']
['', 'input.phone_number', 'button.btn-charge', 'div.user_register_ctn~1h4',
'button.user_register_btn']
['', 'input.rd_fv_50', 'input.phone_number', 'input.phone_number', 'input.phone_number',
'button.btn-charge']
['', 'input.phone_number', 'button.btn-charge', 'input.PassInputPassword0',
'form.PassFormlogin~1fieldset~1p~1button', 'form.PassFormlogin~1fieldset~1p~1button']

48. PV

49. Q: ,

51. •
•
•
• 80

52. marmot v2 design UDC

56. ABtest
hadoop
framework
(HDFS)
beta
publish
marmot
WPO

57. thanks