正文
上个月玩了两张前端数据的监控展示图如下
能直接看到一周会话统计，环比； 一周uv统计环比及趋势； 一周LCP趋势及环比； 一周报错趋势及环比； 一周卡顿汇总及趋势； 配置文件如下
{ "dashboardBindSet": [], "dashboardExtend": {}, "dashboardMapping": [], "dashboardOwnerType": "node", "dashboardType": "CUSTOM", "iconSet": {}, "main": { "charts": [ { "extend": { "fixedTime": { "key": "7d", "text": "最近7天" }, "settings": { "bgColor": "#E8EDCC", "colors": [], "compareTitle": "环比", "compareType": "circleCompare", "currentChartType": "singlestat", "downsample": "last", "fixedTime": "7d", "fontColor": "#2D8CF0", "isTimeInterval": false, "levels": [], "lineColor": "#3AB8FF", "mappings": [], "openCompare": true, "precision": "2", "showFieldMapping": false, "showLine": true, "showLineAxis": false, "showTitle": true, "timeInterval": "default", "titleDesc": "", "units": [] } }, "group": { "name": null }, "name": "一周会话统计", "pos": { "h": 12, "w": 13, "x": 0, "y": 0 }, "queries": [ { "color": "", "datasource": "dataflux", "name": "", "qtype": "dql", "query": { "alias": "", "code": "A", "dataSource": "session", "field": "*", "fieldFunc": "count", "fieldType": "", "fill": "", "filters": [], "funcList": [], "groupBy": [ "userid" ], "groupByTime": "", "namespace": "rum", "q": "R::`session`:(COUNT(`*`)) BY `userid`", "queryFuncs": [], "search": "", "type": "simple" }, "type": "singlestat", "unit": "" } ], "type": "singlestat" }, { "extend": { "fixedTime": { "key": "7d", "text": "最近7天" }, "settings": { "bgColor": "#EEEBDE", "colors": [], "compareTitle": "环比", "compareType": "circleCompare", "currentChartType": "singlestat", "downsample": "last", "fixedTime": "7d", "fontColor": "#CD8282", "isTimeInterval": false, "levels": [], "lineColor": "#3AB8FF", "mappings": [], "openCompare": true, "precision": "2", "showFieldMapping": false, "showLine": true, "showLineAxis": false, "showTitle": true, "timeInterval": "default", "titleDesc": "", "units": [] } }, "group": { "name": null }, "name": "一周UV统计及趋势", "pos": { "h": 12, "w": 11, "x": 13, "y": 0 }, "queries": [ { "color": "", "datasource": "dataflux", "name": "", "qtype": "dql", "query": { "alias": "UV", "code": "A", "dataSource": "view", "field": "userid", "fieldFunc": "count", "fieldType": "keyword", "fill": null, "fillNum": null, "filters": [], "funcList": [], "groupBy": [], "groupByTime": "", "namespace": "rum", "q": "R::`view`:(COUNT(`userid`) AS `UV`)", "queryFuncs": [], "type": "simple", "withLabels": [] }, "type": "singlestat", "unit": "" } ], "type": "singlestat" }, { "extend": { "fixedTime": { "key": "7d", "text": "最近7天" }, "settings": { "bgColor": "#FFFFFF", "colors": [], "compareTitle": "环比", "compareType": "circleCompare", "currentChartType": "singlestat", "downsample": "last", "fixedTime": "7d", "fontColor": "#F40F57", "isTimeInterval": false, "levels": [], "lineColor": "#E81457", "mappings": [], "openCompare": true, "precision": "2", "showFieldMapping": false, "showLine": true, "showLineAxis": false, "showTitle": true, "timeInterval": "default", "titleDesc": "", "units": [] } }, "group": { "name": null }, "name": "一周报错统计及趋势", "pos": { "h": 10, "w": 13, "x": 0, "y": 23 }, "queries": [ { "color": "", "datasource": "dataflux", "name": "", "qtype": "dql", "query": { "alias": "", "code": "A", "dataSource": "error", "field": "error_handling", "fieldFunc": "count", "fieldType": "keyword", "fill": "", "filters": [], "funcList": [], "groupBy": [], "groupByTime": "", "namespace": "rum", "q": "R::`error`:(COUNT(`error_handling`))", "queryFuncs": [], "search": "", "type": "simple" }, "type": "singlestat", "unit": "" } ], "type": "singlestat" }, { "extend": { "fixedTime": { "key": "7d", "text": "最近7天" }, "settings": { "bgColor": "", "colors": [], "compareTitle": "环比", "compareType": "circleCompare", "currentChartType": "singlestat", "downsample": "last", "fixedTime": "7d", "fontColor": "#A6A0A0", "isTimeInterval": false, "levels": [], "lineColor": "#8B8585", "mappings": [], "openCompare": true, "precision": "2", "showFieldMapping": false, "showLine": true, "showLineAxis": false, "showTitle": true, "timeInterval": "default", "titleDesc": "", "units": [] } }, "group": { "name": null }, "name": "一周卡顿汇总及趋势", "pos": { "h": 10, "w": 13, "x": 0, "y": 33 }, "queries": [ { "color": "", "datasource": "dataflux", "name": "", "qtype": "dql", "query": { "alias": "", "code": "A", "dataSource": "long_task", "field": "*", "fieldFunc": "count", "fieldType": "", "fill": "", "filters": [], "funcList": [], "groupBy": [], "groupByTime": "", "namespace": "rum", "q": "R::`long_task`:(COUNT(`*`))", "queryFuncs": [], "search": "", "type": "simple" }, "type": "singlestat", "unit": "" } ], "type": "singlestat" }, { "extend": { "fixedTime": { "key": "7d", "text": "最近7天" }, "links": [ { "alias": "跳转到 [性能分析]", "open": "curWin", "type": "custom", "url": "/rum/detail/#{V.appid}?time=#{TR}&tabKey=性能分析&variable={\"appid\":\"#{V.appid}\",\"env\":\"#{V.env}\",\"version\":\"#{V.version}\",\"view_loading_type\":\"re(`.*`)\",\"view_path_group\":\"re(`.*`)\",\"browser\":\"re(`.*`)\",\"country\":\"re(`.*`)\"}" } ], "settings": { "chartType": "areaLine", "colors": [], "compareTitle": "环比", "compareType": "circleCompare", "currentChartType": "sequence", "density": "lower", "fixedTime": "7d", "isPercent": false, "isTimeInterval": true, "levels": [ { "bgColor": "#F10D31", "title": "页面基线", "value": 2000000000 } ], "openCompare": true, "openStack": false, "showFieldMapping": true, "showLine": false, "showTitle": true, "stackType": "time", "tableSortMetricName": "P75(LCP)", "timeInterval": "default", "titleDesc": "页面渲染", "units": [ { "key": "last(first_contentful_paint)", "name": "last(first_contentful_paint)", "unit": "", "units": [ "time", "ns" ] } ], "xAxisShowType": "time" } }, "group": { "name": null }, "name": "一周LCP趋势统计及环比", "pos": { "h": 11, "w": 13, "x": 0, "y": 12 }, "queries": [ { "color": "", "datasource": "dataflux", "disabled": false, "name": "", "qtype": "dql", "query": { "alias": "", "code": "A", "dataSource": "view", "field": "first_contentful_paint", "fieldFunc": "last", "fieldType": "float", "fill": null, "fillNum": null, "filters": [], "funcList": [], "groupBy": [ "app_id" ], "groupByTime": "", "namespace": "rum", "q": "R::`view`:(LAST(`first_contentful_paint`)) BY `app_id`", "queryFuncs": [], "type": "simple", "withLabels": [] }, "type": "sequence", "unit": "" } ], "type": "sequence" }, { "extend": { "fixedGroupByTime": null, "fixedTime": { "key": "7d", "text": "最近 7 天" }, "isRefresh": false, "settings": { "alias": [], "chartType": "line", "colors": [], "compareTitle": "", "compareType": "", "currentChartType": "sequence", "density": "medium", "fixedTime": "7d", "isPercent": false, "isTimeInterval": true, "legendPostion": "none", "legendValues": "", "levels": [], "openCompare": false, "openStack": false, "showFieldMapping": false, "showLine": false, "showTitle": true, "stackType": "time", "timeInterval": "default", "titleDesc": "", "units": [], "xAxisShowType": "time" } }, "group": { "name": null }, "name": "应用点击趋势图", "pos": { "h": 10, "w": 13, "x": 0, "y": 43 }, "queries": [ { "color": "", "datasource": "dataflux", "name": "", "qtype": "dql", "query": { "alias": "", "code": "A", "dataSource": "action", "field": "*", "fieldFunc": "count", "fieldType": "", "fill": "", "filters": [], "funcList": [], "groupBy": [ "action_name", "app_id" ], "groupByTime": "", "namespace": "rum", "q": "R::`action`:(COUNT(`*`)) BY `action_name`, `app_id`", "queryFuncs": [], "search": "", "type": "simple" }, "type": "sequence", "unit": "" } ], "type": "sequence" }, { "extend": { "fixedTime": { "key": "30d", "text": "最近 30 天" }, "settings": { "alias": [], "bar": { "direction": "horizontal", "xAxisShowType": "groupBy" }, "chartType": "bar", "color": "#498BFE", "colors": [ { "color": "#498BFE", "key": "last(resource_size){\"resource_url\": \"https://mcs.volceapplog.com/list\"}", "name": "last(resource_size){\"resource_url\": \"https://mcs.volceapplog.com/list\"}" } ], "compareTitle": "", "compareType": "", "fixedTime": "30d", "isTimeInterval": false, "levels": [], "openCompare": false, "showFieldMapping": false, "showTableHead": true, "showTitle": true, "showTopSize": true, "table": { "queryMode": "toGroupColumn" }, "tableSortMetricName": "", "tableSortType": "top", "timeInterval": "default", "titleDesc": "", "topSize": 10, "units": [] } }, "group": { "name": null }, "name": "资源加载排行榜", "pos": { "h": 21, "w": 11, "x": 13, "y": 12 }, "queries": [ { "color": "", "datasource": "dataflux", "name": "", "qtype": "dql", "query": { "code": "A", "dataSource": "resource", "field": "resource_size", "fieldFunc": "last", "fill": null, "fillNum": null, "filters": [], "funcList": [ "last", "top:10" ], "groupBy": [ "resource_url" ], "groupByTime": "", "namespace": "rum", "q": "R::`resource`:(LAST(`resource_size`)) BY `resource_url`", "queryFuncs": [], "type": "dql", "withLabels": [] }, "type": "toplist", "unit": "" } ], "type": "toplist" }, { "extend": { "fixedTime": { "key": "7d", "text": "最近 7 天" }, "settings": { "alias": [], "bar": { "direction": "horizontal", "xAxisShowType": "groupBy" }, "chartType": "bar", "color": "#498BFE", "colors": [ { "color": "#498BFE", "key": "count(action_long_task_count){\"action_name\": \"红潭酱酒 1 瓶\", \"action_type\": \"click\", \"view_url\": \"https://sts.test.tanjiu.cn/portal/stock/stockDetail?tabName=%E8%BF%9B%E8%B4%A7\"}", "name": "count(action_long_task_count){\"action_name\": \"红潭酱酒 1 瓶\", \"action_type\": \"click\", \"view_url\": \"https://sts.test.tanjiu.cn/portal/stock/stockDetail?tabName=%E8%BF%9B%E8%B4%A7\"}" } ], "compareTitle": "", "compareType": "", "fixedTime": "7d", "isTimeInterval": false, "levels": [], "openCompare": false, "showFieldMapping": false, "showTableHead": true, "showTitle": true, "showTopSize": true, "table": { "queryMode": "toGroupColumn" }, "tableSortMetricName": "", "tableSortType": "top", "timeInterval": "default", "titleDesc": "", "topSize": 10, "units": [] } }, "group": { "name": null }, "name": "页面动作和长耗时排行榜", "pos": { "h": 19, "w": 11, "x": 13, "y": 33 }, "queries": [ { "color": "", "datasource": "dataflux", "name": "", "qtype": "dql", "query": { "alias": "", "code": "A", "dataSource": "action", "field": "action_long_task_count", "fieldFunc": "count", "fieldType": "float", "fill": null, "fillNum": null, "filters": [], "funcList": [ "last", "top:10" ], "groupBy": [ "action_name", "view_url", "action_type" ], "groupByTime": "", "namespace": "rum", "q": "R::`action`:(COUNT(`action_long_task_count`)) BY `action_name`, `view_url`, `action_type`", "queryFuncs": [], "type": "simple", "withLabels": [] }, "type": "toplist", "unit": "" } ], "type": "toplist" } ], "groups": [], "type": "template", "vars": [] }, "summary": "", "tagInfo": [], "tags": [], "thumbnail": "", "title": "前端监控周报" }
