mip-analytics
MIP 提供了性能数据以帮助开发者了解自己当前自己的 MIP 页面的性能情况，可以通过 <mip-analytics> 组件发日志到自己的统计服务端进行统计。并且开发者可以通过定制配置信息对一些 DOM 元素或者组件的交互（目前支持点击事件）进行统计。而且还可以进行轮询（setInterval 机制）的日志发送，实时了解页面的交互状态。
示例
基本用法
每种事件可以配置多个
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889<div class="className1">
<button data-click="{button: 1}"> BUTTON 1</button>
<button data-click="{button: 2}"> BUTTON 2</button>
</div>
<div class="className2" data-click="{div: 'className2'}">
<button>BUTTON 3</button>
</div>
<mip-analytics>
<script type="application/json">
{
"hosts" : {
"className1": "https://some-log-host.com/some-log-path/div1?",
"disp": "https://some-log-host.com/${disp}?",
"className2" : "https://some-log-host.com/_${div2}.gif?"
},
"setting" : {
"click" : [
{
"selector" : ".className1",
"tag": "button",
"host" : "className1",
"queryString" : {
"name" : "className1",
"mipstart" : "${MIPStart}",
"list": {
"age":"123"
}
}
},
{
"selector" : ".className2",
"host" : "className2",
"queryString" : {
"name" : "className2",
"mipstart" : "${MIPStart}",
"list": {
"age":"45"
}
}
},
{
"selector" : ".className3",
"host" : "className3",
"queryString" : {},
"vars" : {
"div2" : "divfdsf"
}
}
],
"disp" : [
{
"host" : "disp",
"queryString" : {
"MIPStart" : "${MIPStart}",
"MIPPageShow" : "${MIPPageShow}",
"MIPDomContentLoaded" : "${MIPDomContentLoaded}",
"MIPFirstScreen" : "${MIPFirstScreen}"
},
"vars" : {
"disp" : "displog"
}
}
],
"timer" : [
{
"host" : "className2",
"queryString" : {
"timer" : "timer"
},
"vars" : {
"div2" : "div2"
},
"option" : {
"interval" : 2000
}
}
],
"scroll" : []
}
}
</script>
</mip-analytics>配置参数
hosts
说明：指定用到的 log server 地址，用以后面配置复用
必选项：是
类型：键值对
取值范围：HTTPS
setting
说明：配置日志发送
必选项：是
类型：键值对
setting.click
说明：配置点击事件
必选项：否
类型：Array
setting.click.selector
说明：指定触发点击的选择器
必选项：是
类型：CSS 选择器
setting.click.tag
说明：指定触发点击的选择器，有此属性时，setting.click.selector 为选择器父节点，点击事件绑定在父节点上
必选项：是
类型：CSS 选择器
setting.click.host
说明：指定日志发送的 log server，可以使用插值变量占位，${varName}，在 vars 中指定真实值。 插件使用图片伪装请求。host 应该是一个图片地址，一般是 GIF。如 https://logserver.com/mylog.gif?
必选项：是
类型：hosts 参数中的 key
setting.click.queryString
说明：指定 host 的 querystring，一级属性序列化为 & 链接的参数，二级对象属性会被序列化为 JSON 字符串。可以支持一些内建变量，目前支持 MIP 速度信息以及 performance API 的一些信息，以下 MIP 性能内建变量会返回时间戳。
"${MIPStart}""${MIPPageShow}""${MIPDomContentLoaded}""${MIPFirstScreen}"
必选项：否
类型：键值对
setting.click.vars
说明：指定 host 的插值变量的真实值，替换格式为 ${varName}，如果是内建变量可以不用指定值，会自行替换。
必选项：否
类型：键值对
setting.touchstart
说明：完全同 click
setting.timer
说明：定时发送日志设置
必选项：否
类型：Array
setting.timer.host
说明：同click.host
setting.timer.data
说明：同click.data
setting.timer.option.interval
说明：指定定时器间隔
必选项：否
类型：数字
单位：ms
默认值：4000ms
注意事项
注意是标准 JSON，属性名，属性值都要用双引号。
统计框架会默认传入一级参数
t，为发送日志的时间。host 地址需要是 HTTPS 的。
vars 和 queryString 是为了方便使用方重复利用变量并且保证灵活性，最好是 vars 用于 host 部分，queryString 用于参数部分，或者只选择其一。重叠使用时需要注意图们之间是否有交叉。框架会先替换 vars 再拼接 queryStirng。
vars 只支持简单数据类型，复合数据类型会返回空字符串。
queryString 内建变量只支持一级参数替换，2 级对象中有内建变量，会被直接序列化为字符串，不会替换。