From 9197ae932b5b86753accc03311c0b44091668c66 Mon Sep 17 00:00:00 2001 From: Peter Hedenskog Date: Tue, 25 Jul 2023 20:57:47 +0200 Subject: [PATCH] Move dashboards to main repo https://github.com/sitespeedio/sitespeed.io/issues/3916 (#3917) --- docker/docker-compose.yml | 14 +- .../ChromeUserExperienceReport.json | 4391 ++++++ .../provisioning/dashboards/Leaderboard.json | 3217 +++++ .../provisioning/dashboards/PageMetrics.json | 11644 ++++++++++++++++ .../provisioning/dashboards/Plus1.json | 3268 +++++ .../provisioning/dashboards/Welcome.json | 166 + .../dashboards/WikipediaLogin.json | 2735 ++++ .../provisioning/dashboards/default.yaml | 24 + .../provisioning/datasources/graphite.yaml | 51 + .../provisioning/datasources/json.yaml | 18 + 10 files changed, 25520 insertions(+), 8 deletions(-) create mode 100644 docker/grafana/provisioning/dashboards/ChromeUserExperienceReport.json create mode 100644 docker/grafana/provisioning/dashboards/Leaderboard.json create mode 100644 docker/grafana/provisioning/dashboards/PageMetrics.json create mode 100644 docker/grafana/provisioning/dashboards/Plus1.json create mode 100644 docker/grafana/provisioning/dashboards/Welcome.json create mode 100644 docker/grafana/provisioning/dashboards/WikipediaLogin.json create mode 100644 docker/grafana/provisioning/dashboards/default.yaml create mode 100644 docker/grafana/provisioning/datasources/graphite.yaml create mode 100644 docker/grafana/provisioning/datasources/json.yaml diff --git a/docker/docker-compose.yml b/docker/docker-compose.yml index ef3cea0a14..9733ddde4c 100644 --- a/docker/docker-compose.yml +++ b/docker/docker-compose.yml @@ -1,7 +1,7 @@ version: '3' services: grafana: - image: grafana/grafana:10.0.1 + image: grafana/grafana:10.0.2 hostname: grafana depends_on: - graphite @@ -10,14 +10,19 @@ services: ports: - "3000:3000" environment: + # See https://grafana.com/docs/grafana/latest/setup-grafana/configure-grafana/ - GF_SECURITY_ADMIN_PASSWORD=hdeAga76VG6ga7plZ1 - GF_SECURITY_ADMIN_USER=sitespeedio - GF_AUTH_ANONYMOUS_ENABLED=true - GF_USERS_ALLOW_SIGN_UP=false - GF_USERS_ALLOW_ORG_CREATE=false - GF_INSTALL_PLUGINS=grafana-piechart-panel,marcusolsson-json-datasource,marcusolsson-dynamictext-panel + - GF_DASHBOARDS_DEFAULT_HOME_DASHBOARD_PATH=/var/lib/grafana/dashboards/Welcome.json volumes: - grafana:/var/lib/grafana + - ./grafana/provisioning/datasources:/etc/grafana/provisioning/datasources + - ./grafana/provisioning/dashboards:/etc/grafana/provisioning/dashboards + - ./grafana/provisioning/dashboards:/var/lib/grafana/dashboards restart: always graphite: image: sitespeedio/graphite:1.1.10-3 @@ -39,13 +44,6 @@ services: # - /absolute/path/to/graphite/conf/storage-schemas.conf:/opt/graphite/conf/storage-schemas.conf # - /absolute/path/to/graphite/conf/storage-aggregation.conf:/opt/graphite/conf/storage-aggregation.conf # - /absolute/path/to/graphite/conf/carbon.conf:/opt/graphite/conf/carbon.conf - grafana-setup: - image: sitespeedio/grafana-bootstrap:29.0.0 - links: - - grafana - environment: - - GF_PASSWORD=hdeAga76VG6ga7plZ1 - - GF_USER=sitespeedio volumes: grafana: whisper: diff --git a/docker/grafana/provisioning/dashboards/ChromeUserExperienceReport.json b/docker/grafana/provisioning/dashboards/ChromeUserExperienceReport.json new file mode 100644 index 0000000000..ad12f947ca --- /dev/null +++ b/docker/grafana/provisioning/dashboards/ChromeUserExperienceReport.json @@ -0,0 +1,4391 @@ +{ + "__inputs": [ + { + "name": "graphite", + "label": "graphite", + "description": "", + "type": "datasource", + "pluginId": "graphite", + "pluginName": "Graphite" + }, + { + "name": "VAR_BASE", + "type": "constant", + "label": "sitespeed_io", + "value": "sitespeed_io", + "description": "" + } + ], + "__elements": [], + "__requires": [ + { + "type": "grafana", + "id": "grafana", + "name": "Grafana", + "version": "8.5.1" + }, + { + "type": "panel", + "id": "grafana-piechart-panel", + "name": "Pie Chart (old)", + "version": "1.6.2" + }, + { + "type": "panel", + "id": "graph", + "name": "Graph (old)", + "version": "" + }, + { + "type": "datasource", + "id": "graphite", + "name": "Graphite", + "version": "1.0.0" + }, + { + "type": "panel", + "id": "stat", + "name": "Stat", + "version": "" + }, + { + "type": "panel", + "id": "timeseries", + "name": "Time series", + "version": "" + } + ], + "annotations": { + "list": [ + { + "builtIn": 1, + "datasource": { + "type": "datasource", + "uid": "grafana" + }, + "enable": true, + "hide": true, + "iconColor": "rgba(0, 211, 255, 1)", + "name": "Annotations & Alerts", + "target": { + "limit": 100, + "matchAny": false, + "tags": [], + "type": "dashboard" + }, + "type": "dashboard" + } + ] + }, + "editable": true, + "fiscalYearStartMonth": 0, + "graphTooltip": 0, + "id": null, + "iteration": 1651731137841, + "links": [], + "liveNow": false, + "panels": [ + { + "collapsed": false, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 0 + }, + "id": 2, + "panels": [], + "title": "CrUX data for page $group$page", + "type": "row" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "displayName": "First Contentful Paint", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1000 + }, + { + "color": "red", + "value": 3000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 0, + "y": 1 + }, + "id": 4, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.5.1", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.p75, 'First Contentful Paint')", + "textEditor": false, + "datasource": "graphite" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "displayName": "Largest Contentful Paint", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 2500 + }, + { + "color": "red", + "value": 4000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 8, + "y": 1 + }, + "id": 5, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.5.1", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.p75, 'Largest Contentful Paint')", + "textEditor": false, + "datasource": "graphite" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "displayName": "First Input Delay", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 100 + }, + { + "color": "red", + "value": 300 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 16, + "y": 1 + }, + "id": 6, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.5.1", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_INPUT_DELAY_MS.p75, 'First Input Delay')", + "textEditor": false, + "datasource": "graphite" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "displayName": "Cumulative Layout Shift", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 0.1 + }, + { + "color": "red", + "value": 0.25 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 8, + "x": 0, + "y": 7 + }, + "id": 7, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.5.1", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.p75, 'Cumulative Layout Shift')", + "textEditor": false, + "datasource": "graphite" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "displayName": "Interaction To Next Paint", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 200 + }, + { + "color": "red", + "value": 500 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 8, + "x": 8, + "y": 7 + }, + "id": 44, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.5.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.p75, 'Interaction to next paint')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "displayName": "Time To First Byte", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 800 + }, + { + "color": "red", + "value": 1800 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 8, + "x": 16, + "y": 7 + }, + "id": 45, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.5.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.p75, 'Time To First Byte')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 8, + "w": 8, + "x": 0, + "y": 14 + }, + "id": 23, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.fast, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.moderate, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.slow, 100), 10)", + "textEditor": false, + "datasource": "graphite" + } + ], + "title": "First Contentful Paint", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 8, + "w": 8, + "x": 8, + "y": 14 + }, + "id": 16, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.fast, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.moderate, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.slow, 100), 10)", + "textEditor": false, + "datasource": "graphite" + } + ], + "title": "Largest Contentful Paint", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 8, + "w": 8, + "x": 16, + "y": 14 + }, + "id": 25, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_INPUT_DELAY_MS.fast, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_INPUT_DELAY_MS, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_INPUT_DELAY_MS, 100), 10)", + "textEditor": false, + "datasource": "graphite" + } + ], + "title": "First Input Delay", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 8, + "w": 8, + "x": 0, + "y": 22 + }, + "id": 26, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.fast, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.moderate, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.slow, 100), 10)", + "textEditor": false, + "datasource": "graphite" + } + ], + "title": "Cumulative Layout Shift", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 8, + "w": 8, + "x": 8, + "y": 22 + }, + "id": 46, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.fast, 100), 10)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.moderate, 100), 10)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.slow, 100), 10)", + "textEditor": false + } + ], + "title": "Interaction To Next Paint", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 8, + "w": 8, + "x": 16, + "y": 22 + }, + "id": 47, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.fast, 100), 10)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.moderate, 100), 10)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.slow, 100), 10)", + "textEditor": false + } + ], + "title": "Time To First Byte", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 9, + "w": 8, + "x": 0, + "y": 30 + }, + "hiddenSeries": false, + "id": 15, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "8.5.1", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.fast, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.moderate, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.slow, 100), 10)", + "textEditor": false, + "datasource": "graphite" + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "title": "First Contentful Paint", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "mode": "time", + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "logBase": 1, + "show": true + } + ], + "yaxis": { + "align": false + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 9, + "w": 8, + "x": 8, + "y": 30 + }, + "hiddenSeries": false, + "id": 24, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "8.5.1", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.fast, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.moderate, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.slow, 100), 10)", + "textEditor": false, + "datasource": "graphite" + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "title": "Largest Contentful Paint", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "mode": "time", + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "logBase": 1, + "show": true + } + ], + "yaxis": { + "align": false + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 9, + "w": 8, + "x": 16, + "y": 30 + }, + "hiddenSeries": false, + "id": 17, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "8.5.1", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_INPUT_DELAY_MS.fast, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_INPUT_DELAY_MS, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_INPUT_DELAY_MS, 100), 10)", + "textEditor": false, + "datasource": "graphite" + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "title": "First Input Delay", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "mode": "time", + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "logBase": 1, + "show": true + } + ], + "yaxis": { + "align": false + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 10, + "w": 8, + "x": 0, + "y": 39 + }, + "hiddenSeries": false, + "id": 18, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "8.5.1", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.fast, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.moderate, 100), 10)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.slow, 100), 10)", + "textEditor": false, + "datasource": "graphite" + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "title": "Cumulative Layout Shift", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "mode": "time", + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "logBase": 1, + "show": true + } + ], + "yaxis": { + "align": false + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 10, + "w": 8, + "x": 8, + "y": 39 + }, + "hiddenSeries": false, + "id": 48, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "8.5.1", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.fast, 100), 10)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.moderate, 100), 10)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.slow, 100), 10)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "title": "Interaction To Next Paint", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "mode": "time", + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "logBase": 1, + "show": true + } + ], + "yaxis": { + "align": false + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 10, + "w": 8, + "x": 16, + "y": 39 + }, + "hiddenSeries": false, + "id": 49, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "8.5.1", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.fast, 100), 10)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.moderate, 100), 10)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.slow, 100), 10)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "title": "Time To First Byte", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "mode": "time", + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "logBase": 1, + "show": true + } + ], + "yaxis": { + "align": false + } + }, + { + "collapsed": false, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 49 + }, + "id": 32, + "panels": [], + "title": "History", + "type": "row" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "displayName": "First Contentful Paint", + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 8, + "x": 0, + "y": 50 + }, + "id": 33, + "maxDataPoints": "", + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.p75, 'First Contentful Paint')", + "textEditor": false, + "datasource": "graphite" + } + ], + "timeFrom": "30d", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "displayName": "Largest Contentful Paint", + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 8, + "x": 8, + "y": 50 + }, + "id": 34, + "maxDataPoints": "", + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.p75, 'Largest Contentful Paint')", + "textEditor": false, + "datasource": "graphite" + } + ], + "timeFrom": "30d", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "displayName": "First Input Delay", + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 8, + "x": 16, + "y": 50 + }, + "id": 35, + "maxDataPoints": "", + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.FIRST_INPUT_DELAY_MS.p75, 'First Input Delay')", + "textEditor": false, + "datasource": "graphite" + } + ], + "timeFrom": "30d", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "displayName": "Cumulative Layout Shift", + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 8, + "x": 0, + "y": 57 + }, + "id": 50, + "maxDataPoints": "", + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.p75, 'Cumulative Layout Shift')", + "textEditor": false, + "datasource": "graphite" + } + ], + "timeFrom": "30d", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "displayName": "Interaction To Next Paint", + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 8, + "x": 8, + "y": 57 + }, + "id": 36, + "maxDataPoints": "", + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.p75, 'Cumulative Layout Shift')", + "textEditor": false + } + ], + "timeFrom": "30d", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "displayName": "Time To Fist Byte", + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 8, + "x": 16, + "y": 57 + }, + "id": 51, + "maxDataPoints": "", + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.p75, 'Cumulative Layout Shift')", + "textEditor": false + } + ], + "timeFrom": "30d", + "type": "timeseries" + }, + { + "collapsed": false, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 64 + }, + "id": 9, + "panels": [], + "title": "CrUX data for origin $group", + "type": "row" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "displayName": "First Contentful Paint", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1000 + }, + { + "color": "red", + "value": 3000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 0, + "y": 65 + }, + "id": 10, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.5.1", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.p75, 'First Contentful Paint')", + "textEditor": false, + "datasource": "graphite" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "displayName": "Largest Contentful Paint", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 2500 + }, + { + "color": "red", + "value": 4000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 8, + "y": 65 + }, + "id": 11, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.5.1", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.p75, 'Largest Contentful Paint')", + "textEditor": false, + "datasource": "graphite" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "displayName": "First Input Delay", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 100 + }, + { + "color": "red", + "value": 300 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 16, + "y": 65 + }, + "id": 12, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.5.1", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_INPUT_DELAY_MS.p75, 'First Input Delay')", + "textEditor": true, + "datasource": "graphite" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "displayName": "Cumulative Layout Shift", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 0.1 + }, + { + "color": "red", + "value": 0.25 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 0, + "y": 71 + }, + "id": 13, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.5.1", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.p75, 'Cumulative Layout Shift')", + "textEditor": false, + "datasource": "graphite" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "displayName": "Interaction To Next Paint", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 200 + }, + { + "color": "red", + "value": 500 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 8, + "y": 71 + }, + "id": 52, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.5.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.p75, 'Cumulative Layout Shift')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "displayName": "Time To First Byte", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 800 + }, + { + "color": "red", + "value": 1800 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 16, + "y": 71 + }, + "id": 53, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.5.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.p75, 'Cumulative Layout Shift')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 7, + "w": 8, + "x": 0, + "y": 77 + }, + "id": 27, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.fast, 100), 9)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.moderate, 100), 9)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.slow, 100), 9)", + "textEditor": false, + "datasource": "graphite" + } + ], + "title": "First Contentful Paint", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 7, + "w": 8, + "x": 8, + "y": 77 + }, + "id": 43, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "pluginVersion": "7.0.3", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.fast, 100), 9)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.moderate, 100), 9)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.slow, 100), 9)", + "textEditor": false, + "datasource": "graphite" + } + ], + "title": "Largest Contentful Paint", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 7, + "w": 8, + "x": 16, + "y": 77 + }, + "id": 29, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_INPUT_DELAY_MS.fast, 100), 9)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_INPUT_DELAY_MS.moderate, 100), 9)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_INPUT_DELAY_MS, 100), 9)", + "textEditor": false, + "datasource": "graphite" + } + ], + "title": "First Input Delay", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 7, + "w": 8, + "x": 0, + "y": 84 + }, + "id": 30, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.fast, 100), 9)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.moderate, 100), 9)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.slow, 100), 9)", + "textEditor": false, + "datasource": "graphite" + } + ], + "title": "Cumulative Layout Shift", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 7, + "w": 8, + "x": 8, + "y": 84 + }, + "id": 54, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.fast, 100), 9)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.moderate, 100), 9)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.slow, 100), 9)", + "textEditor": false + } + ], + "title": "Interaction To Next Paint", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 7, + "w": 8, + "x": 16, + "y": 84 + }, + "id": 55, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.fast, 100), 9)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.moderate, 100), 9)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.slow, 100), 9)", + "textEditor": false + } + ], + "title": "Time To First Byte", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 9, + "w": 8, + "x": 0, + "y": 91 + }, + "hiddenSeries": false, + "id": 19, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "8.5.1", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.fast, 100), 9)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.moderate, 100), 9)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.slow, 100), 9)", + "textEditor": false, + "datasource": "graphite" + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "title": "First Contentful Paint", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "mode": "time", + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "logBase": 1, + "show": true + } + ], + "yaxis": { + "align": false + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 9, + "w": 8, + "x": 8, + "y": 91 + }, + "hiddenSeries": false, + "id": 20, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "8.5.1", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.fast, 100), 9)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.moderate, 100), 9)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.slow, 100), 9)", + "textEditor": false, + "datasource": "graphite" + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "title": "Largest Contentful Paint", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "mode": "time", + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "logBase": 1, + "show": true + } + ], + "yaxis": { + "align": false + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 9, + "w": 8, + "x": 16, + "y": 91 + }, + "hiddenSeries": false, + "id": 21, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "8.5.1", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_INPUT_DELAY_MS.fast, 100), 9)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_INPUT_DELAY_MS.moderate, 100), 9)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_INPUT_DELAY_MS, 100), 9)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "title": "First Input Delay", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "mode": "time", + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "logBase": 1, + "show": true + } + ], + "yaxis": { + "align": false + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 9, + "w": 8, + "x": 0, + "y": 100 + }, + "hiddenSeries": false, + "id": 22, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "8.5.1", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.fast, 100), 9)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.moderate, 100), 9)", + "textEditor": false, + "datasource": "graphite" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.slow, 100), 9)", + "textEditor": false, + "datasource": "graphite" + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "title": "Cumulative Layout Shift", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "mode": "time", + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "logBase": 1, + "show": true + } + ], + "yaxis": { + "align": false + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 9, + "w": 8, + "x": 8, + "y": 100 + }, + "hiddenSeries": false, + "id": 56, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "8.5.1", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.fast, 100), 9)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.moderate, 100), 9)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.slow, 100), 9)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "title": "Interaction To Next Paint", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "mode": "time", + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "logBase": 1, + "show": true + } + ], + "yaxis": { + "align": false + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 9, + "w": 8, + "x": 16, + "y": 100 + }, + "hiddenSeries": false, + "id": 57, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "8.5.1", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.fast, 100), 9)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.moderate, 100), 9)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.slow, 100), 9)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "title": "Time To First Byte", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "mode": "time", + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "logBase": 1, + "show": true + } + ], + "yaxis": { + "align": false + } + }, + { + "collapsed": false, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 109 + }, + "id": 38, + "panels": [], + "title": "History", + "type": "row" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "displayName": "First Contentful Paint", + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 0, + "y": 110 + }, + "id": 39, + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_CONTENTFUL_PAINT_MS.p75, 'First Contentful Paint')", + "textEditor": false, + "datasource": "graphite" + } + ], + "timeFrom": "30d", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "displayName": "Largest Contentful Paint", + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 8, + "y": 110 + }, + "id": 40, + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.LARGEST_CONTENTFUL_PAINT_MS.p75, 'Largest Contentful Paint')", + "textEditor": false, + "datasource": "graphite" + } + ], + "timeFrom": "30d", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "displayName": "First Input Delay", + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 16, + "y": 110 + }, + "id": 41, + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.FIRST_INPUT_DELAY_MS.p75, 'First Input Delay')", + "textEditor": false, + "datasource": "graphite" + } + ], + "timeFrom": "30d", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "displayName": "Cumulative Layout Shift", + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 0, + "y": 116 + }, + "id": 42, + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "alias($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.CUMULATIVE_LAYOUT_SHIFT_SCORE.p75, 'Cumulative Layout Shift')", + "textEditor": false, + "datasource": "graphite" + } + ], + "timeFrom": "30d", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "displayName": "Interaction To Next Paint", + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 8, + "y": 116 + }, + "id": 58, + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.INTERACTION_TO_NEXT_PAINT_MS.p75, 'Cumulative Layout Shift')", + "textEditor": false + } + ], + "timeFrom": "30d", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "displayName": "Time To First Byte", + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 8, + "x": 16, + "y": 116 + }, + "id": 59, + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "$base.$path.$testname.summary.$group.crux.originLoadingExperience.$formFactor.TIME_TO_FIRST_BYTE_MS.p75", + "textEditor": false + } + ], + "timeFrom": "30d", + "type": "timeseries" + } + ], + "schemaVersion": 36, + "style": "dark", + "tags": [], + "templating": { + "list": [ + { + "hide": 2, + "label": "sitespeed_io", + "name": "base", + "query": "sitespeed_io", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "sitespeed_io", + "text": "sitespeed_io", + "selected": false + }, + "options": [ + { + "value": "sitespeed_io", + "text": "sitespeed_io", + "selected": false + } + ] + }, + { + "current": {}, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "definition": "$base.*", + "hide": 0, + "includeAll": false, + "multi": false, + "name": "path", + "options": [], + "query": "$base.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "current": {}, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "definition": "$base.$path.*", + "hide": 0, + "includeAll": false, + "multi": false, + "name": "testname", + "options": [], + "query": "$base.$path.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "current": {}, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "definition": "$base.$path.$testname.pageSummary.*", + "hide": 0, + "includeAll": false, + "label": "domain", + "multi": false, + "name": "group", + "options": [], + "query": "$base.$path.$testname.pageSummary.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "current": {}, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "definition": "$base.$path.$testname.pageSummary.$group.*", + "hide": 0, + "includeAll": false, + "multi": false, + "name": "page", + "options": [], + "query": "$base.$path.$testname.pageSummary.$group.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "current": {}, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "definition": "$base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.*", + "hide": 0, + "includeAll": false, + "label": "Form Factor", + "multi": false, + "name": "formFactor", + "options": [], + "query": "$base.$path.$testname.pageSummary.$group.$page.crux.loadingExperience.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tagsQuery": "", + "type": "query", + "useTags": false + } + ] + }, + "time": { + "from": "now-2d", + "to": "now" + }, + "timepicker": { + "refresh_intervals": [ + "10s", + "30s", + "1m", + "5m", + "15m", + "30m", + "1h", + "2h", + "1d" + ] + }, + "timezone": "", + "title": "Chrome User Experience Report", + "uid": "t_bhsNGMk", + "version": 17, + "weekStart": "" +} \ No newline at end of file diff --git a/docker/grafana/provisioning/dashboards/Leaderboard.json b/docker/grafana/provisioning/dashboards/Leaderboard.json new file mode 100644 index 0000000000..a8566388a2 --- /dev/null +++ b/docker/grafana/provisioning/dashboards/Leaderboard.json @@ -0,0 +1,3217 @@ +{ + "__inputs": [ + { + "name": "graphite", + "label": "graphite", + "description": "", + "type": "datasource", + "pluginId": "graphite", + "pluginName": "Graphite" + }, + { + "name": "VAR_NAMESPACE", + "type": "constant", + "label": "sitespeed_io", + "value": "sitespeed_io", + "description": "" + } + ], + "__requires": [ + { + "type": "panel", + "id": "bargauge", + "name": "Bar gauge", + "version": "" + }, + { + "type": "grafana", + "id": "grafana", + "name": "Grafana", + "version": "7.4.0-beta1" + }, + { + "type": "panel", + "id": "graph", + "name": "Graph", + "version": "" + }, + { + "type": "datasource", + "id": "graphite", + "name": "Graphite", + "version": "1.0.0" + }, + { + "type": "panel", + "id": "stat", + "name": "Stat", + "version": "" + } + ], + "annotations": { + "list": [ + { + "builtIn": 1, + "datasource": "-- Grafana --", + "enable": true, + "hide": true, + "iconColor": "rgba(0, 211, 255, 1)", + "name": "Annotations & Alerts", + "type": "dashboard" + } + ] + }, + "editable": true, + "gnetId": null, + "graphTooltip": 0, + "id": null, + "iteration": 1612787019283, + "links": [ + { + "icon": "external link", + "includeVars": true, + "keepTime": true, + "tags": [ + "page timings" + ], + "type": "dashboards" + }, + { + "icon": "external link", + "includeVars": true, + "keepTime": true, + "tags": [ + "page summary" + ], + "type": "dashboards" + }, + { + "icon": "external link", + "includeVars": true, + "keepTime": true, + "tags": [ + "site summary" + ], + "type": "dashboards" + } + ], + "panels": [ + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 0 + }, + "id": 33, + "panels": [], + "title": "Visual Metrics [$function]", + "type": "row" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "The first visual change is when something for the first time is painted within the current viewport. It is calculated by analyzing a video recording of the screen.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 3000, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1000 + }, + { + "color": "red", + "value": 2000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 0, + "y": 1 + }, + "id": 30, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.visualMetrics.FirstVisualChange.$function, 'average'),4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "First Visual Change", + "type": "bargauge" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "The largest image is the time when the largest image within the viewport is painted and on its final position. It is calculated by analyzing a video recording of the screen.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 10000, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1000 + }, + { + "color": "red", + "value": 2000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 12, + "y": 1 + }, + "id": 59, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.visualMetrics.LargestImage.$function,'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Largest image", + "type": "bargauge" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "The Speed Index is the average time at which visible parts of the page are displayed. It is expressed in milliseconds and dependent on size of the view port. It was created by Pat Meenan and you can checkout the full documentation [here](https://sites.google.com/a/webpagetest.org/docs/using-webpagetest/metrics/speed-index).", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 8000, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1000 + }, + { + "color": "red", + "value": 2000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 0, + "y": 15 + }, + "id": 31, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.visualMetrics.SpeedIndex.$function,'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Speed Index", + "type": "bargauge" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "Visual readiness is the time between the first visual change and the last visual change within the viewport. It is calculated by analyzing a video recording of the screen.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 10000, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1000 + }, + { + "color": "red", + "value": 2000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 12, + "y": 15 + }, + "id": 60, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.visualMetrics.VisualReadiness.$function,'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Visual Readiness", + "type": "bargauge" + }, + { + "collapsed": true, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 29 + }, + "id": 11, + "panels": [ + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "description": "The first visual change is when something for the first time is painted within the current viewport. It is calculated by analyzing a video recording of the screen.", + "fieldConfig": { + "defaults": { + "custom": {} + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 15, + "w": 12, + "x": 0, + "y": 30 + }, + "hiddenSeries": false, + "id": 12, + "legend": { + "alignAsTable": true, + "avg": true, + "current": true, + "hideEmpty": true, + "hideZero": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "links": [], + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.3.6", + "pointradius": 5, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refId": "A", + "target": "aliasByNode($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.visualMetrics.FirstVisualChange.$function, 4, 5)", + "textEditor": true + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "First Visual Change", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:239", + "format": "ms", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "$$hashKey": "object:240", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "description": "The largest image is the time when the largest image within the viewport is painted and on its final position. It is calculated by analyzing a video recording of the screen.", + "fieldConfig": { + "defaults": { + "custom": {} + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 15, + "w": 12, + "x": 12, + "y": 30 + }, + "hiddenSeries": false, + "id": 14, + "legend": { + "alignAsTable": true, + "avg": true, + "current": true, + "hideEmpty": true, + "hideZero": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "links": [], + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.3.6", + "pointradius": 5, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refId": "A", + "target": "aliasByNode($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.visualMetrics.LargestImage.$function, 4, 5)", + "textEditor": true + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "Largest image", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:505", + "format": "ms", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "$$hashKey": "object:506", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "description": "The Speed Index is the average time at which visible parts of the page are displayed. It is expressed in milliseconds and dependent on size of the view port. It was created by Pat Meenan and you can checkout the full documentation [here](https://sites.google.com/a/webpagetest.org/docs/using-webpagetest/metrics/speed-index).", + "fieldConfig": { + "defaults": { + "custom": {} + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 15, + "w": 12, + "x": 0, + "y": 45 + }, + "hiddenSeries": false, + "id": 1, + "legend": { + "alignAsTable": true, + "avg": true, + "current": true, + "hideEmpty": true, + "hideZero": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "links": [], + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.3.6", + "pointradius": 5, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refId": "A", + "target": "aliasByNode($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.visualMetrics.SpeedIndex.$function, 4, 5)", + "textEditor": true + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "SpeedIndex", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:717", + "format": "ms", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "$$hashKey": "object:718", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "description": "Visual readiness is the time between the first visual change and the last visual change within the viewport. It is calculated by analyzing a video recording of the screen.", + "fieldConfig": { + "defaults": { + "custom": {} + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 15, + "w": 12, + "x": 12, + "y": 45 + }, + "hiddenSeries": false, + "id": 13, + "legend": { + "alignAsTable": true, + "avg": true, + "current": true, + "hideEmpty": true, + "hideZero": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "links": [], + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.3.6", + "pointradius": 5, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refId": "A", + "target": "aliasByNode($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.visualMetrics.VisualReadiness.$function, 4, 5)", + "textEditor": true + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "Visual Readiness", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:847", + "format": "ms", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "$$hashKey": "object:848", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + } + ], + "title": "History Visual Metrics", + "type": "row" + }, + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 30 + }, + "id": 40, + "panels": [], + "title": "CPU [$function]", + "type": "row" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "CPU time spent evaluating JavaScript. Calculated using [Tracium](https://github.com/aslushnikov/tracium). This is a Chrome only metric at the moment.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 2500, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 200 + }, + { + "color": "red", + "value": 1000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 0, + "y": 31 + }, + "id": 41, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.cpu.categories.scriptEvaluation.$function,'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "CPU time spent script evaluation", + "type": "bargauge" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "CPU time spent rendering the page. Calculated using [Tracium](https://github.com/aslushnikov/tracium). This is a Chrome only metric at the moment.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 800, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 50 + }, + { + "color": "red", + "value": 400 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 12, + "y": 31 + }, + "id": 42, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.cpu.categories.paintCompositeRender.$function,'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "CPU time spent render", + "type": "bargauge" + }, + { + "collapsed": true, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 45 + }, + "id": 78, + "panels": [ + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "The estimated carbon emission is calculated using the sustainable web plugin, developed together with the Green Web Foundation.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 15, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1 + }, + { + "color": "red", + "value": 4 + } + ] + }, + "unit": "massg" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 0, + "y": 46 + }, + "id": 79, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true + }, + "pluginVersion": "7.3.6", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.sustainable.co2PerPageView.$function, 'average'),4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Estimated carbon emission per page view", + "type": "bargauge" + } + ], + "title": "Carbon emission (enable with --sustainability.enable)", + "type": "row" + }, + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 46 + }, + "id": 62, + "panels": [], + "title": "Technical metrics [$function]", + "type": "row" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "Load Event End is when the load event end event fires in the Navigation Timing API", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 15000, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 2000 + }, + { + "color": "red", + "value": 4000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 0, + "y": 47 + }, + "id": 64, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.timings.loadEventEnd.$function,'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Load Event End", + "type": "bargauge" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "Fully loaded time when the last of all assets is downloaded on the page.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 20000, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 2000 + }, + { + "color": "red", + "value": 5000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 12, + "y": 47 + }, + "id": 63, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.timings.fullyLoaded.$function,'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Fully Loaded", + "type": "bargauge" + }, + { + "collapsed": true, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 61 + }, + "id": 66, + "panels": [ + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "custom": {} + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 15, + "w": 12, + "x": 0, + "y": 62 + }, + "hiddenSeries": false, + "id": 67, + "legend": { + "alignAsTable": true, + "avg": true, + "current": true, + "hideEmpty": true, + "hideZero": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "links": [], + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.3.6", + "pointradius": 5, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refId": "A", + "target": "aliasByNode($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.timings.loadEventEnd.$function, 4, 5)", + "textEditor": true + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "Load Event End", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1046", + "format": "ms", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "$$hashKey": "object:1047", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "custom": {} + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 15, + "w": 12, + "x": 12, + "y": 62 + }, + "hiddenSeries": false, + "id": 68, + "legend": { + "alignAsTable": true, + "avg": true, + "current": true, + "hideEmpty": true, + "hideZero": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "links": [], + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.3.6", + "pointradius": 5, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refId": "A", + "target": "aliasByNode($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.timings.fullyLoaded.$function, 4, 5)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "Fully Loaded", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1176", + "format": "ms", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "$$hashKey": "object:1177", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + } + ], + "title": "Technical metrics history", + "type": "row" + }, + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 62 + }, + "id": 44, + "panels": [], + "title": "JavaScript [$function]", + "type": "row" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 2000000, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 100000 + }, + { + "color": "red", + "value": 200000 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 0, + "y": 63 + }, + "id": 45, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.pagexray.contentTypes.javascript.transferSize,'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "JavaScript Transfer Size", + "type": "bargauge" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "The JavaScript size unpacked.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 6000000, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 250000 + }, + { + "color": "red", + "value": 500000 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 12, + "y": 63 + }, + "id": 46, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.pagexray.contentTypes.javascript.contentSize,'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "JavaScript Content Size", + "type": "bargauge" + }, + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 77 + }, + "id": 35, + "panels": [], + "title": "Requests and size ", + "type": "row" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "Total number of requests for the full page.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 500, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + } + }, + "overrides": [] + }, + "gridPos": { + "h": 10, + "w": 24, + "x": 0, + "y": 78 + }, + "id": 37, + "links": [], + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortByMaxima($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.pagexray.requests), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Total number or requests", + "type": "stat" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "Total page weight (compressed over the wire).", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 5000000, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "yellow", + "value": 500000 + }, + { + "color": "red", + "value": 2000000 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 10, + "w": 24, + "x": 0, + "y": 88 + }, + "id": 38, + "links": [], + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortByMaxima($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.pagexray.transferSize), 4, 5)", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Total page transfer size (over the wire)", + "type": "stat" + }, + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 98 + }, + "id": 70, + "panels": [], + "title": "Requests and size bars", + "type": "row" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "Total number of requests for the full page.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 500, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "index": 0, + "value": null + }, + { + "color": "yellow", + "index": 1, + "value": 50 + }, + { + "color": "red", + "index": 2, + "value": 100 + } + ] + } + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 0, + "y": 99 + }, + "id": 71, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.pagexray.requests,'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Total number of requests", + "type": "bargauge" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "Total page weight (compressed over the wire).", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 5000000, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "index": 0, + "value": null + }, + { + "color": "yellow", + "index": 1, + "value": 500000 + }, + { + "color": "red", + "index": 2, + "value": 2000000 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 12, + "y": 99 + }, + "id": 72, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.pagexray.transferSize,'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Total page transfer size (over the wire)", + "type": "bargauge" + }, + { + "collapsed": true, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 113 + }, + "id": 7, + "panels": [ + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "fieldConfig": { + "defaults": { + "custom": {} + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 16, + "w": 12, + "x": 0, + "y": 100 + }, + "hiddenSeries": false, + "id": 3, + "legend": { + "alignAsTable": true, + "avg": true, + "current": true, + "hideEmpty": true, + "hideZero": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "links": [], + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.3.6", + "pointradius": 5, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refId": "A", + "target": "aliasByNode($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.pagexray.requests, 4, 5)", + "textEditor": true + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "Requests", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1719", + "format": "none", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "$$hashKey": "object:1720", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "fieldConfig": { + "defaults": { + "custom": {} + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 16, + "w": 12, + "x": 12, + "y": 100 + }, + "hiddenSeries": false, + "id": 4, + "legend": { + "alignAsTable": true, + "avg": true, + "current": true, + "hideEmpty": true, + "hideZero": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "links": [], + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.3.6", + "pointradius": 5, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refId": "A", + "target": "aliasByNode($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.pagexray.transferSize, 4, 5)", + "textEditor": true + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "Total transfer size", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1837", + "format": "decbytes", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "$$hashKey": "object:1838", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + } + ], + "title": "Requests and size history", + "type": "row" + }, + { + "collapsed": true, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 114 + }, + "id": 74, + "panels": [ + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 20, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 1 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 0, + "y": 101 + }, + "id": 75, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true + }, + "pluginVersion": "7.3.6", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.axe.violations.critical.$function, 'average'),4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Axe critical violations", + "type": "bargauge" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 20, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1 + }, + { + "color": "red", + "value": 2 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 12, + "y": 101 + }, + "id": 76, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true + }, + "pluginVersion": "7.3.6", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.axe.violations.serious.$function, 'average'),4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Axe serious violations", + "type": "bargauge" + } + ], + "title": "Axe violations", + "type": "row" + }, + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 115 + }, + "id": 48, + "panels": [], + "title": "CPU Long Task [$function]", + "type": "row" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "The average number of CPU Long Tasks per page. A CPU long Task is by default a CPU task that takes longer than 50 ms to run. This metrics is Chrome only at the moment.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [ + { + "from": "", + "id": 1, + "operator": "", + "text": "No long task", + "to": "", + "type": 1, + "value": "0" + } + ], + "max": 8, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1 + }, + { + "color": "red", + "value": 5 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 0, + "y": 116 + }, + "id": 49, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.cpu.longTasks.tasks.$function,'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Number of CPU Long Tasks (average)", + "type": "bargauge" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "This is the longest CPU task for each page (if they are over 50 ms long). This metrics is Chrome only at the moment.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 1000, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 60 + }, + { + "color": "red", + "value": 200 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 12, + "y": 116 + }, + "id": 50, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.cpu.longTasks.durations.max,'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Longest long task", + "type": "bargauge" + }, + { + "collapsed": true, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 130 + }, + "id": 18, + "panels": [ + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "fill": 0, + "gridPos": { + "h": 15, + "w": 8, + "x": 0, + "y": 73 + }, + "id": 19, + "legend": { + "alignAsTable": true, + "avg": true, + "current": true, + "hideEmpty": true, + "hideZero": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "links": [], + "nullPointMode": "connected", + "options": {}, + "percentage": false, + "pointradius": 5, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refId": "A", + "target": "aliasByNode($namespace.$path.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.cpu.longTasks.durations.max, 3, 4)" + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "Longest CPU Long Tasks", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "format": "ms", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "fill": 0, + "gridPos": { + "h": 15, + "w": 8, + "x": 8, + "y": 73 + }, + "id": 20, + "legend": { + "alignAsTable": true, + "avg": true, + "current": true, + "hideEmpty": true, + "hideZero": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "links": [], + "nullPointMode": "connected", + "options": {}, + "percentage": false, + "pointradius": 5, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refId": "A", + "target": "aliasByNode($namespace.$path.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.cpu.longTasks.tasks.$function, 3, 4)" + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "Number of CPU Long Tasks", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "format": "none", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "fill": 0, + "gridPos": { + "h": 15, + "w": 8, + "x": 16, + "y": 73 + }, + "id": 21, + "legend": { + "alignAsTable": true, + "avg": true, + "current": true, + "hideEmpty": true, + "hideZero": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "links": [], + "nullPointMode": "connected", + "options": {}, + "percentage": false, + "pointradius": 5, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refId": "A", + "target": "aliasByNode($namespace.$path.pageSummary.$domains.$pages.$browser.$connectivity.browsertime.statistics.cpu.longTasks.beforeFirstPaint.tasks.median, 3, 4)" + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "Number of CPU Long Tasks before First Paint", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "format": "none", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + } + ], + "title": "CPU Long Task history", + "type": "row" + }, + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 131 + }, + "id": 52, + "panels": [], + "title": "Third parties [$function]", + "type": "row" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "Third party requests are calculated using the [Third party web](https://github.com/patrickhulce/third-party-web) library.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [ + { + "from": "", + "id": 1, + "operator": "", + "text": "No 3rd parties", + "to": "", + "type": 1, + "value": "0" + } + ], + "max": 200, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1 + }, + { + "color": "red", + "value": 10 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 0, + "y": 132 + }, + "id": 53, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.thirdparty.requests.total.$function, 'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Third party request", + "type": "bargauge" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "Third party % are calculated using the [Third party web](https://github.com/patrickhulce/third-party-web) library.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 100, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 5 + }, + { + "color": "red", + "value": 10 + } + ] + }, + "unit": "percent" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 12, + "y": 132 + }, + "id": 54, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.thirdparty.requests.percentage.$function, 'average'), 4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "% third party request", + "type": "bargauge" + }, + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 146 + }, + "id": 56, + "panels": [], + "title": "Score", + "type": "row" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "The performance score (0-100) calculated by the [Coach](https://www.sitespeed.io/documentation/coach/) using performance best practices.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 100, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "red", + "value": null + }, + { + "color": "yellow", + "value": 80 + }, + { + "color": "green", + "value": 90 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 0, + "y": 147 + }, + "id": 57, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.coach.advice.performance.score, 'average', true),4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Performance score", + "type": "bargauge" + }, + { + "cacheTimeout": "", + "datasource": "graphite", + "description": "The privacy score (0-100) calculated by the [Coach](https://www.sitespeed.io/documentation/coach/) using user privacy best practices.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": {}, + "mappings": [], + "max": 100, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "red", + "value": null + }, + { + "color": "yellow", + "value": 80 + }, + { + "color": "green", + "value": 90 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 12, + "y": 147 + }, + "id": 58, + "links": [], + "options": { + "displayMode": "lcd", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showUnfilled": true, + "text": {} + }, + "pluginVersion": "7.4.0-beta1", + "targets": [ + { + "refId": "A", + "target": "aliasByNode(sortBy($namespace.$path.$testname.pageSummary.$domains.$pages.$browser.$connectivity.coach.advice.privacy.score, 'average', true),4, 5)", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Privacy score", + "type": "bargauge" + } + ], + "schemaVersion": 27, + "style": "dark", + "tags": [ + "leaderboard", + "pages" + ], + "templating": { + "list": [ + { + "description": null, + "error": null, + "hide": 2, + "label": "sitespeed_io", + "name": "namespace", + "query": "${VAR_NAMESPACE}", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "${VAR_NAMESPACE}", + "text": "${VAR_NAMESPACE}", + "selected": false + }, + "options": [ + { + "value": "${VAR_NAMESPACE}", + "text": "${VAR_NAMESPACE}", + "selected": false + } + ] + }, + { + "allValue": null, + "current": {}, + "datasource": "graphite", + "definition": "$namespace.*", + "description": null, + "error": null, + "hide": 0, + "includeAll": false, + "label": "path", + "multi": true, + "name": "path", + "options": [], + "query": "$namespace.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tags": [], + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "allValue": null, + "current": {}, + "datasource": "graphite", + "definition": "$namespace.$path.*", + "description": null, + "error": null, + "hide": 0, + "includeAll": false, + "label": null, + "multi": false, + "name": "testname", + "options": [], + "query": "$namespace.$path.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tags": [], + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "allValue": null, + "current": {}, + "datasource": "graphite", + "definition": "$namespace.$path.$testname.pageSummary.*", + "description": null, + "error": null, + "hide": 0, + "includeAll": true, + "label": "domains", + "multi": true, + "name": "domains", + "options": [], + "query": "$namespace.$path.$testname.pageSummary.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tags": [], + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "allValue": null, + "current": {}, + "datasource": "graphite", + "definition": "$namespace.$path.$testname.pageSummary.$domains.*", + "description": null, + "error": null, + "hide": 0, + "includeAll": true, + "label": "pages", + "multi": true, + "name": "pages", + "options": [], + "query": "$namespace.$path.$testname.pageSummary.$domains.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tags": [], + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "allValue": null, + "current": {}, + "datasource": "graphite", + "definition": "$namespace.$path.$testname.pageSummary.$domains.$pages.*", + "description": null, + "error": null, + "hide": 0, + "includeAll": false, + "label": "browser", + "multi": false, + "name": "browser", + "options": [], + "query": "$namespace.$path.$testname.pageSummary.$domains.$pages.*", + "refresh": 1, + "regex": "(chrome||firefox)", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tags": [], + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "auto": false, + "auto_count": 30, + "auto_min": "10s", + "current": { + "selected": false, + "text": "median", + "value": "median" + }, + "description": null, + "error": null, + "hide": 0, + "label": "", + "name": "function", + "options": [ + { + "selected": false, + "text": "min", + "value": "min" + }, + { + "selected": false, + "text": "mean", + "value": "mean" + }, + { + "selected": true, + "text": "median", + "value": "median" + }, + { + "selected": false, + "text": "p90", + "value": "p90" + }, + { + "selected": false, + "text": "max", + "value": "max" + } + ], + "query": "min,mean,median,p90,max", + "queryValue": "", + "refresh": 2, + "skipUrlSync": false, + "type": "interval" + }, + { + "allValue": null, + "current": {}, + "datasource": "graphite", + "definition": "$namespace.$path.$testname.pageSummary.$domains.$pages.$browser.*", + "description": null, + "error": null, + "hide": 0, + "includeAll": false, + "label": "", + "multi": false, + "name": "connectivity", + "options": [], + "query": "$namespace.$path.$testname.pageSummary.$domains.$pages.$browser.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tags": [], + "tagsQuery": "", + "type": "query", + "useTags": false + } + ] + }, + "time": { + "from": "now-7d", + "to": "now" + }, + "timepicker": { + "refresh_intervals": [ + "5s", + "10s", + "30s", + "1m", + "5m", + "15m", + "30m", + "1h", + "2h", + "1d" + ], + "time_options": [ + "5m", + "15m", + "1h", + "6h", + "12h", + "24h", + "2d", + "7d", + "30d" + ] + }, + "timezone": "", + "title": "Leaderboard", + "uid": "000000060", + "version": 2 +} \ No newline at end of file diff --git a/docker/grafana/provisioning/dashboards/PageMetrics.json b/docker/grafana/provisioning/dashboards/PageMetrics.json new file mode 100644 index 0000000000..160878f0e3 --- /dev/null +++ b/docker/grafana/provisioning/dashboards/PageMetrics.json @@ -0,0 +1,11644 @@ +{ + "__inputs": [ + { + "name": "graphite", + "label": "graphite", + "description": "", + "type": "datasource", + "pluginId": "graphite", + "pluginName": "Graphite" + }, + { + "name": "json-api", + "label": "JSON API", + "description": "", + "type": "datasource", + "pluginId": "marcusolsson-json-datasource", + "pluginName": "JSON API" + }, + { + "name": "VAR_BASE", + "type": "constant", + "label": "sitespeed_io", + "value": "sitespeed_io", + "description": "" + }, + { + "name": "VAR_RESULTURL", + "type": "constant", + "label": "resulturl", + "value": "https://data.sitespeed.io/", + "description": "" + }, + { + "name": "VAR_SCREENSHOTTYPE", + "type": "constant", + "label": "screenshottype", + "value": "jpg", + "description": "" + } + ], + "__elements": {}, + "__requires": [ + { + "type": "grafana", + "id": "grafana", + "name": "Grafana", + "version": "10.0.1" + }, + { + "type": "datasource", + "id": "graphite", + "name": "Graphite", + "version": "1.0.0" + }, + { + "type": "panel", + "id": "marcusolsson-dynamictext-panel", + "name": "Dynamic Text", + "version": "4.0.0" + }, + { + "type": "datasource", + "id": "marcusolsson-json-datasource", + "name": "JSON API", + "version": "1.3.6" + }, + { + "type": "panel", + "id": "piechart", + "name": "Pie chart", + "version": "" + }, + { + "type": "panel", + "id": "stat", + "name": "Stat", + "version": "" + }, + { + "type": "panel", + "id": "text", + "name": "Text", + "version": "" + }, + { + "type": "panel", + "id": "timeseries", + "name": "Time series", + "version": "" + } + ], + "annotations": { + "list": [ + { + "builtIn": 1, + "datasource": { + "type": "datasource", + "uid": "grafana" + }, + "enable": true, + "hide": true, + "iconColor": "rgba(0, 211, 255, 1)", + "name": "Annotations & Alerts", + "target": { + "limit": 100, + "matchAny": false, + "tags": [], + "type": "dashboard" + }, + "type": "dashboard" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "enable": false, + "iconColor": "rgb(96, 255, 103)", + "limit": 100, + "name": "Go to result", + "showIn": 0, + "tags": "$base $path $group $page $browser $connectivity $testname", + "target": { + "fromAnnotations": true, + "queryType": "tags", + "tags": [ + "$base", + "$path", + "$group", + "$page", + "$browser", + "$connectivity", + "$testname" + ] + }, + "type": "alert" + }, + { + "datasource": { + "type": "datasource", + "uid": "grafana" + }, + "enable": true, + "hide": false, + "iconColor": "#8AB8FF", + "limit": 100, + "name": "sitespeed.io", + "showIn": 0, + "tags": [ + "sitespeed.io" + ], + "target": { + "limit": 100, + "matchAny": false, + "tags": [ + "sitespeed.io" + ], + "type": "tags" + }, + "type": "tags" + }, + { + "datasource": { + "type": "datasource", + "uid": "grafana" + }, + "enable": false, + "iconColor": "red", + "name": "Alerts", + "target": { + "limit": 100, + "matchAny": true, + "tags": [ + "alert" + ], + "type": "tags" + } + } + ] + }, + "description": "", + "editable": true, + "fiscalYearStartMonth": 0, + "graphTooltip": 0, + "id": null, + "links": [], + "liveNow": false, + "panels": [ + { + "collapsed": true, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 0 + }, + "id": 278, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 1 + }, + "id": 292, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Show data from each individual run from the last seven days.", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "points", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 6, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "auto", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byName", + "options": "Median" + }, + "properties": [ + { + "id": "custom.drawStyle", + "value": "line" + }, + { + "id": "custom.lineInterpolation", + "value": "linear" + }, + { + "id": "custom.spanNulls", + "value": true + } + ] + } + ] + }, + "gridPos": { + "h": 9, + "w": 24, + "x": 0, + "y": 3 + }, + "id": 280, + "maxDataPoints": 50000, + "options": { + "legend": { + "calcs": [ + "min", + "max", + "range" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias(sitespeed_io.$path.$testname.run.$group.$page.$browser.$connectivity.browsertime.visualMetrics.FirstVisualChange, 'First Visual Change')" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "alias(sitespeed_io.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.FirstVisualChange.median, 'Median')" + } + ], + "title": "First visual change", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "points", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 6, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "auto", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byName", + "options": "Median" + }, + "properties": [ + { + "id": "custom.drawStyle", + "value": "line" + }, + { + "id": "custom.lineInterpolation", + "value": "linear" + }, + { + "id": "custom.spanNulls", + "value": true + } + ] + } + ] + }, + "gridPos": { + "h": 9, + "w": 24, + "x": 0, + "y": 12 + }, + "id": 283, + "maxDataPoints": 50000, + "options": { + "legend": { + "calcs": [ + "min", + "max", + "range" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias(sitespeed_io.$path.$testname.run.$group.$page.$browser.$connectivity.browsertime.googleWebVitals.largestContentfulPaint, 'Largest Contentful Paint')" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "alias(sitespeed_io.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.googleWebVitals.largestContentfulPaint.median, 'Median')" + } + ], + "title": "Largest Contentful Paint", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "points", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "auto", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byName", + "options": "Median" + }, + "properties": [ + { + "id": "custom.drawStyle", + "value": "line" + }, + { + "id": "custom.lineInterpolation", + "value": "linear" + }, + { + "id": "custom.spanNulls", + "value": true + } + ] + } + ] + }, + "gridPos": { + "h": 9, + "w": 24, + "x": 0, + "y": 21 + }, + "id": 281, + "maxDataPoints": 50000, + "options": { + "legend": { + "calcs": [ + "min", + "max", + "range" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias(sitespeed_io.$path.$testname.run.$group.$page.$browser.$connectivity.browsertime.timings.ttfb, 'TTFB')" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "alias(sitespeed_io.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.ttfb.median, 'Median')" + } + ], + "title": "Time to first byte", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "points", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "auto", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byName", + "options": "Median" + }, + "properties": [ + { + "id": "custom.drawStyle", + "value": "line" + }, + { + "id": "custom.lineInterpolation", + "value": "linear" + }, + { + "id": "custom.spanNulls", + "value": true + } + ] + } + ] + }, + "gridPos": { + "h": 9, + "w": 24, + "x": 0, + "y": 30 + }, + "id": 282, + "maxDataPoints": 50000, + "options": { + "legend": { + "calcs": [ + "min", + "max", + "range" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias(sitespeed_io.$path.$testname.run.$group.$page.$browser.$connectivity.browsertime.browser.cpuBenchmark, 'CPU benchmark')" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "alias(sitespeed_io.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.browser.cpuBenchmark.median, 'Median')" + } + ], + "title": "CPU benchmark", + "type": "timeseries" + } + ], + "title": "Per run", + "type": "row" + }, + { + "collapsed": false, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 1 + }, + "id": 84, + "panels": [], + "title": "Page metrics", + "type": "row" + }, + { + "datasource": { + "type": "marcusolsson-json-datasource", + "uid": "json-api" + }, + "gridPos": { + "h": 4, + "w": 12, + "x": 0, + "y": 2 + }, + "id": 272, + "options": { + "content": "{{#each data}}\n{{{friendlyHTML}}}\n\n{{#if title}}\n---\n**{{{title}}}**\n\n{{{description}}}\n{{/if}}\n\n{{/each}}", + "defaultContent": "The query didn't return any results.", + "editor": { + "format": "auto", + "height": 200, + "language": "markdown" + }, + "editors": [], + "everyRow": false, + "helpers": "", + "styles": "" + }, + "targets": [ + { + "cacheDurationSeconds": 300, + "datasource": { + "type": "marcusolsson-json-datasource", + "uid": "json-api" + }, + "experimentalGroupByField": "*", + "fields": [ + { + "jsonPath": "description ", + "language": "jsonata", + "name": "description" + }, + { + "jsonPath": "title", + "language": "jsonata", + "name": "title" + }, + { + "jsonPath": "friendlyHTML", + "language": "jsonata", + "name": "friendlyHTML" + } + ], + "method": "GET", + "queryParams": "", + "refId": "A", + "urlPath": "/$testname/$base.$path.$group.$page.$browser.$connectivity.json" + } + ], + "title": "Meta data for the test", + "transformations": [ + { + "id": "filterByValue", + "options": { + "filters": [], + "match": "all", + "type": "exclude" + } + } + ], + "type": "marcusolsson-dynamictext-panel" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 1, + "w": 12, + "x": 12, + "y": 2 + }, + "id": 228, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "" + } + ], + "title": "Page Vitals", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "gridPos": { + "h": 6, + "w": 6, + "x": 12, + "y": 3 + }, + "id": 159, + "links": [], + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "\n", + "mode": "html" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.pageSummary.$group.$page.$browser.$connectivity.pagexray.requests, 8)", + "textEditor": false + } + ], + "title": "Screenshot from last run", + "type": "text" + }, + { + "cacheTimeout": "", + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "gridPos": { + "h": 6, + "w": 6, + "x": 18, + "y": 3 + }, + "id": 160, + "links": [], + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "\n", + "mode": "html" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.pageSummary.$group.$page.$browser.$connectivity.coach.advice.info.domElements, 'DOM elements')", + "textEditor": false + } + ], + "title": "Video", + "type": "text" + }, + { + "cacheTimeout": "", + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "always", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byName", + "options": "Heading" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "semi-dark-green", + "mode": "fixed" + } + } + ] + }, + { + "matcher": { + "id": "byName", + "options": "LastVisualChange" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "#cca300", + "mode": "fixed" + } + }, + { + "id": "custom.fillBelowTo", + "value": "FirstVisualChange" + } + ] + } + ] + }, + "gridPos": { + "h": 25, + "w": 12, + "x": 0, + "y": 6 + }, + "id": 80, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull", + "range" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "G", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.ttfb.$function, 'TTFB')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.FirstVisualChange.$function, 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.Heading.$function, 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.LargestImage.$function, 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "E", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.LastVisualChange.$function, 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "D", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.SpeedIndex.$function, 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "F", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.LargestContentfulPaint.$function, 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "H", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.fullyLoaded.$function, 'Fully Loaded')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "I", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.lastLongTask.$function, 'Last CPU long task')", + "textEditor": false + } + ], + "title": "Visual Metrics [$function]", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "decimals": 2, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "yellow", + "value": 1000000 + }, + { + "color": "red", + "value": 2000000 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 4, + "x": 12, + "y": 9 + }, + "id": 224, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.transferSize, 'Total Transfer Size')", + "textEditor": true + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "yellow", + "value": 100 + }, + { + "color": "red", + "value": 150 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 4, + "x": 16, + "y": 9 + }, + "id": 225, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.requests, 'Requests')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 2000 + }, + { + "color": "red", + "value": 5000 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 4, + "x": 20, + "y": 9 + }, + "id": 226, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.info.domElements, 'DOM Elements')", + "textEditor": true + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "Metrics that Google thinks is important for a good user experience.", + "gridPos": { + "h": 1, + "w": 12, + "x": 12, + "y": 13 + }, + "id": 190, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "" + } + ], + "title": "Google Web Vitals", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 2000 + }, + { + "color": "red", + "value": 4000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 3, + "x": 12, + "y": 14 + }, + "id": 191, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.paintTiming.first-contentful-paint.$function, 'First Contentful Paint')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 2500 + }, + { + "color": "red", + "value": 4000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 3, + "x": 15, + "y": 14 + }, + "id": 192, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.largestContentfulPaint.renderTime.$function, 'Largest Contentful Paint')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 0.1 + }, + { + "color": "red", + "value": 0.25 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 3, + "x": 18, + "y": 14 + }, + "id": 193, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.pageinfo.cumulativeLayoutShift.$function, 'Cumulative Layout Shift')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 300 + }, + { + "color": "red", + "value": 500 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 3, + "x": 21, + "y": 14 + }, + "id": 194, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.totalBlockingTime.$function, 'Total Blocking Time')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "When is elements painted within the viewport. The metrics comes from analysing a video of the browser screen.", + "gridPos": { + "h": 1, + "w": 12, + "x": 12, + "y": 18 + }, + "id": 287, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "" + } + ], + "title": "Visual Metrics", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1000 + }, + { + "color": "red", + "value": 2000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 3, + "x": 12, + "y": 19 + }, + "id": 288, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.FirstVisualChange.$function, 'First Visual Change')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1000 + }, + { + "color": "red", + "value": 2000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 3, + "x": 15, + "y": 19 + }, + "id": 289, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.Heading.$function, 'Largest Heading')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1000 + }, + { + "color": "red", + "value": 2000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 3, + "x": 18, + "y": 19 + }, + "id": 290, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.LargestImage.$function, 'Largest Image')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1000 + }, + { + "color": "red", + "value": 2000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 3, + "x": 21, + "y": 19 + }, + "id": 291, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.LastVisualChange.$function, 'Last Visual Change')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "The performance score (0-100) calculated by the [Coach](https://www.sitespeed.io/documentation/coach/) using performance best practices.The performance score (0-100) calculated by the [Coach](https://www.sitespeed.io/documentation/coach/) using performance best practices.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "red", + "value": null + }, + { + "color": "yellow", + "value": 80 + }, + { + "color": "green", + "value": 90 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 12, + "x": 12, + "y": 23 + }, + "id": 186, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.bestpractice.score, 'Best practice')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.performance.score, 'Performance')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.privacy.score, 'Privacy')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "D", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.score, 'Total')", + "textEditor": false + } + ], + "title": "Coach Score", + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "gridPos": { + "h": 1, + "w": 12, + "x": 12, + "y": 27 + }, + "id": 293, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "" + } + ], + "title": "Axe violations [enable with --axe.enable]", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 1 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 3, + "w": 3, + "x": 12, + "y": 28 + }, + "id": 188, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.axe.violations.critical.$function, 'Critical')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "yellow", + "value": 1 + }, + { + "color": "red", + "value": 2 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 3, + "w": 3, + "x": 15, + "y": 28 + }, + "id": 210, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.axe.violations.serious.$function, 'Serious')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "yellow", + "value": 1 + }, + { + "color": "red", + "value": 5 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 3, + "w": 3, + "x": 18, + "y": 28 + }, + "id": 211, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.axe.violations.moderate.$function, 'Moderate')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "yellow", + "value": 5 + }, + { + "color": "red", + "value": 10 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 3, + "w": 3, + "x": 21, + "y": 28 + }, + "id": 212, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.axe.violations.minor.$function, 'Minor')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "gridPos": { + "h": 1, + "w": 12, + "x": 12, + "y": 31 + }, + "id": 209, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "" + } + ], + "title": "CPU [Chrome only, enable with --cpu]", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1 + }, + { + "color": "red", + "value": 2 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 3, + "x": 12, + "y": 32 + }, + "id": 296, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.beforeFirstContentfulPaint.tasks.$function, 'Long tasks before FCP')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 2 + }, + { + "color": "red", + "value": 4 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 3, + "x": 15, + "y": 32 + }, + "id": 297, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.tasks.max, 'Number of long tasks')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 100 + }, + { + "color": "red", + "value": 200 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 3, + "x": 18, + "y": 32 + }, + "id": 298, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.durations.max, 'Longest long task')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1000 + }, + { + "color": "red", + "value": 2000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 3, + "x": 21, + "y": 32 + }, + "id": 299, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.lastLongTask.$function, 'Last long task')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "collapsed": false, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 36 + }, + "id": 301, + "panels": [], + "title": "Page history", + "type": "row" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 37 + }, + "id": 302, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Showing how the page is built over time.", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 6, + "x": 0, + "y": 39 + }, + "id": 303, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.contentSize, 'Content size')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.transferSize, 'Transfer size')", + "textEditor": false + } + ], + "title": "Total page size", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 6, + "x": 6, + "y": 39 + }, + "id": 304, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.requests, 'Requests')", + "textEditor": false + } + ], + "title": "Requests", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 6, + "x": 12, + "y": 39 + }, + "id": 305, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.pageinfo.domElements.$function, 'DOM elements')", + "textEditor": false + } + ], + "title": "DOM elements", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 6, + "x": 18, + "y": 39 + }, + "id": 306, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.totalDomains, 'Total domains')", + "textEditor": false + } + ], + "title": "Total domains", + "type": "timeseries" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 47 + }, + "id": 113, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 48 + }, + "id": 300, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Transfer size is the size over the wire when the data is transfered to the browser (hopefully compressed). Content size is the size unpacked in the browser. ", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 6, + "x": 0, + "y": 50 + }, + "id": 106, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.contentTypes.html.contentSize, 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.contentTypes.html.transferSize, 11)", + "textEditor": false + } + ], + "title": "HTML size", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 6, + "x": 6, + "y": 50 + }, + "id": 107, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.contentTypes.javascript.contentSize, 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.contentTypes.javascript.transferSize, 11)", + "textEditor": false + } + ], + "title": "JavaScript size", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 6, + "x": 12, + "y": 50 + }, + "id": 108, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.contentTypes.css.contentSize, 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.contentTypes.css.transferSize, 11)", + "textEditor": false + } + ], + "title": "CSS size", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 6, + "x": 18, + "y": 50 + }, + "id": 109, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.contentTypes.image.contentSize, 11)", + "textEditor": false + } + ], + "title": "Image size", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + } + }, + "decimals": 0, + "mappings": [], + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 0, + "y": 58 + }, + "id": 246, + "links": [], + "options": { + "displayLabels": [], + "legend": { + "calcs": [], + "displayMode": "table", + "placement": "right", + "showLegend": true, + "values": [ + "value" + ] + }, + "pieType": "pie", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "7.5.0-beta1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.contentTypes.*.contentSize, 10)", + "textEditor": false + } + ], + "title": "Content size per type", + "type": "piechart" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + } + }, + "decimals": 0, + "mappings": [], + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 12, + "y": 58 + }, + "id": 247, + "links": [], + "options": { + "displayLabels": [], + "legend": { + "calcs": [], + "displayMode": "table", + "placement": "right", + "showLegend": true, + "values": [ + "value" + ] + }, + "pieType": "pie", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "7.5.0-beta1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.contentTypes.*.transferSize, 10)", + "textEditor": false + } + ], + "title": "Transfer size per type", + "type": "piechart" + } + ], + "title": "Page size", + "type": "row" + }, + { + "collapsed": true, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 48 + }, + "id": 284, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 49 + }, + "id": 319, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Keep track of the number of element that is affected by recalcualte style before first contentful paint and largest contentful paint.", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 0, + "y": 51 + }, + "id": 285, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull", + "range" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.renderBlocking.recalculateStyle.beforeFCP.elements.$function, 'Elements before First Contentful Paint (FCP)')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.renderBlocking.recalculateStyle.beforeLCP.elements.$function, 'Elements before Largest Contentful Paint (LCP)')", + "textEditor": false + } + ], + "title": "Elements affected by recalculated styles", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 12, + "y": 51 + }, + "id": 286, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull", + "range" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.renderBlocking.recalculateStyle.beforeFCP.durationInMillis.$function, 'Time in recalculate style before First Contentful Paint (FCP)')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.renderBlocking.recalculateStyle.beforeLCP.durationInMillis.$function, 'Time in recalculate style before Largest Contentful Paint (LCP)')", + "textEditor": false + } + ], + "title": "Time spent in recalculated styles before FCP/LCP", + "type": "timeseries" + } + ], + "title": "Elements that needs recalculate style before ... [Chrome only, enable with --cpu]", + "type": "row" + }, + { + "collapsed": true, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 49 + }, + "id": 309, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 60 + }, + "id": 310, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Screenshots showing what part of the page is the largest contentful paint (LCP) (the red area) and content that is moved around (cumulative layout shift).", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 12, + "x": 0, + "y": 62 + }, + "id": 312, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Largest contentful paint (LCP) - the largest area painted is in the red area.", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 12, + "x": 12, + "y": 62 + }, + "id": 313, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Cumulative layout shift (CLS) - red is the area that moved.", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 0, + "y": 64 + }, + "id": 311, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "\n\n\n\n", + "mode": "html" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 12, + "y": 64 + }, + "id": 314, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "\n\n\n\n", + "mode": "html" + }, + "pluginVersion": "10.0.1", + "type": "text" + } + ], + "title": "Largest Contentful Paint and Cumulative Layout Shift screenshot", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 50 + }, + "id": 199, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 51 + }, + "id": 321, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "The coach helps you find performance problems on your web page. ", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "The performance score (0-100) calculated by the [Coach](https://www.sitespeed.io/documentation/coach/) using performance best practices.The performance score (0-100) calculated by the [Coach](https://www.sitespeed.io/documentation/coach/) using performance best practices.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "max": 100, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 11, + "w": 24, + "x": 0, + "y": 53 + }, + "id": 201, + "links": [], + "maxDataPoints": 100, + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.bestpractice.score, 'Best practice')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.performance.score, 'Performance')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.privacy.score, 'Privacy')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "D", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.score, 'Total')", + "textEditor": false + } + ], + "title": "Coach Score", + "type": "timeseries" + } + ], + "title": "Coach history", + "type": "row" + }, + { + "collapsed": true, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 51 + }, + "id": 274, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 74 + }, + "id": 320, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Main document timings is the timings for downloading the main HTML page.", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "auto", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 15, + "w": 24, + "x": 0, + "y": 76 + }, + "id": 276, + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull", + "range" + ], + "displayMode": "table", + "placement": "right", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.mainDocumentTimings.*.$function, 12)" + } + ], + "title": "Main document timings", + "type": "timeseries" + } + ], + "title": "Main document timings", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 52 + }, + "id": 196, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 11, + "w": 24, + "x": 0, + "y": 53 + }, + "id": 197, + "links": [], + "maxDataPoints": 100, + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.axe.violations.critical.$function, 'Critical')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.axe.violations.serious.$function, 'Serious')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.axe.violations.moderate.$function, 'Moderate')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "D", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.axe.violations.minor.$function, 'Minor')", + "textEditor": false + } + ], + "title": "Axe violations", + "type": "timeseries" + } + ], + "title": "Axe history", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 53 + }, + "id": 256, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 3, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byRegexp", + "options": "/earlier/" + }, + "properties": [ + { + "id": "custom.fillOpacity", + "value": 0 + }, + { + "id": "custom.lineWidth", + "value": 3 + } + ] + } + ] + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 0, + "y": 54 + }, + "id": 254, + "links": [ + { + "targetBlank": true, + "title": "Page summary $page", + "url": "/dashboard/db/page-summary?$__url_time_range&$__all_variables" + } + ], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "alias(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.googleWebVitals.firstContentfulPaint.$function, '24h'), 'Last 24 hours')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "A", + "target": "alias(timeShift(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.googleWebVitals.firstContentfulPaint.$function, '24h'), '7d'), 'One week earlier')", + "textEditor": false + } + ], + "title": "First Contentful Paint", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 3, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byRegexp", + "options": "/earlier/" + }, + "properties": [ + { + "id": "custom.fillOpacity", + "value": 0 + }, + { + "id": "custom.lineWidth", + "value": 3 + } + ] + } + ] + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 12, + "y": 54 + }, + "id": 257, + "links": [ + { + "targetBlank": true, + "title": "Page summary $page", + "url": "/dashboard/db/page-summary?$__url_time_range&$__all_variables" + } + ], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "alias(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.googleWebVitals.largestContentfulPaint.$function, '24h'), 'Last 24 hours')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "A", + "target": "alias(timeShift(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.googleWebVitals.largestContentfulPaint.$function, '24h'), '7d'), 'One week earlier')", + "textEditor": false + } + ], + "title": "Largest Contentful Paint", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 3, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byRegexp", + "options": "/earlier/" + }, + "properties": [ + { + "id": "custom.fillOpacity", + "value": 0 + }, + { + "id": "custom.lineWidth", + "value": 3 + } + ] + } + ] + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 0, + "y": 62 + }, + "id": 258, + "links": [ + { + "targetBlank": true, + "title": "Page summary $page", + "url": "/dashboard/db/page-summary?$__url_time_range&$__all_variables" + } + ], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "alias(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.googleWebVitals.totalBlockingTime.$function, '24h'), 'Last 24 hours')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "A", + "target": "alias(timeShift(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.googleWebVitals.totalBlockingTime.$function, '24h'), '7d'), 'One week earlier')", + "textEditor": false + } + ], + "title": "Total Blocking Time", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 3, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [ + { + "matcher": { + "id": "byRegexp", + "options": "/earlier/" + }, + "properties": [ + { + "id": "custom.fillOpacity", + "value": 0 + }, + { + "id": "custom.lineWidth", + "value": 3 + } + ] + } + ] + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 12, + "y": 62 + }, + "id": 259, + "links": [ + { + "targetBlank": true, + "title": "Page summary $page", + "url": "/dashboard/db/page-summary?$__url_time_range&$__all_variables" + } + ], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "alias(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.googleWebVitals.cumulativeLayoutShift.$function, '24h'), 'Last 24 hours')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "A", + "target": "alias(timeShift(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.googleWebVitals.cumulativeLayoutShift.$function, '24h'), '7d'), 'One week earlier')", + "textEditor": false + } + ], + "title": "Cumulative Layout Shift", + "type": "timeseries" + } + ], + "title": "Google Web Vitals trends", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 54 + }, + "id": 203, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 6, + "x": 0, + "y": 55 + }, + "id": 204, + "links": [], + "maxDataPoints": 100, + "options": { + "legend": { + "calcs": [], + "displayMode": "list", + "placement": "bottom", + "showLegend": false + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.paintTiming.first-contentful-paint.$function, 'FCP')", + "textEditor": false + } + ], + "title": "First Contentful Paint (FCP)", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 6, + "x": 6, + "y": 55 + }, + "id": 206, + "links": [], + "maxDataPoints": 100, + "options": { + "legend": { + "calcs": [], + "displayMode": "list", + "placement": "bottom", + "showLegend": false + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.pageinfo.cumulativeLayoutShift.$function, 'CLS')", + "textEditor": false + } + ], + "title": "Cumulative Layout Shift (CLS)", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 6, + "x": 12, + "y": 55 + }, + "id": 205, + "links": [], + "maxDataPoints": 100, + "options": { + "legend": { + "calcs": [], + "displayMode": "list", + "placement": "bottom", + "showLegend": false + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.largestContentfulPaint.renderTime.$function, 'LCP')", + "textEditor": false + } + ], + "title": "Largest Contentful Paint (LCP)", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 6, + "x": 18, + "y": 55 + }, + "id": 207, + "links": [], + "maxDataPoints": 100, + "options": { + "legend": { + "calcs": [], + "displayMode": "list", + "placement": "bottom", + "showLegend": false + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.totalBlockingTime.$function, 'TBT')", + "textEditor": false + } + ], + "title": "Total Blocking Time (TBT)", + "type": "timeseries" + } + ], + "title": "Google Web Vitals history", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 55 + }, + "id": 264, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 56 + }, + "id": 316, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Data that is collected using the [Navigation Timing API](https://developer.mozilla.org/en-US/docs/Web/API/Navigation_timing_API) (the same data as you can collect from real users. Use it to compare changes in data from our real users.", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "cacheTimeout": "", + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "Metrics collected from theNavigation Timing API", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 15, + "w": 24, + "x": 0, + "y": 58 + }, + "id": 270, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "right", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.navigationTiming.*.$function, 12)", + "textEditor": false + } + ], + "title": "Navigation Timings [$function]", + "type": "timeseries" + } + ], + "title": "Navigation Timings", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 56 + }, + "id": 146, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "The document height in pixels.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue" + } + ] + } + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 6, + "x": 0, + "y": 57 + }, + "id": 149, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.info.documentHeight, 'Document height (pixels)')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue" + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 5, + "x": 6, + "y": 57 + }, + "id": 151, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.totalDomains, 'Number of domains')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "The total number of iframes used on the page.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue" + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 4, + "x": 11, + "y": 57 + }, + "id": 148, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.info.iframes, 'Number of iframes')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue" + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 4, + "x": 15, + "y": 57 + }, + "id": 152, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.cookies, 'Number of cookies')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue" + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 5, + "x": 19, + "y": 57 + }, + "id": 249, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.thirdParty.cookies, 'Third Party Cookies')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "The $function cache expire time of all responses for the page.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue" + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 5, + "x": 0, + "y": 61 + }, + "id": 153, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.expireStats.$function, 'The $function cache expire time of all responses')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "The $function last modified time of all responses for the page.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "decimals": 2, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue" + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 4, + "x": 5, + "y": 61 + }, + "id": 154, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.lastModifiedStats.$function, 'The $function last modified time of all responses')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "The average DOM depth of the page.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue" + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 3, + "x": 9, + "y": 61 + }, + "id": 155, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.info.domDepth.avg, 'Average DOM depth')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "The max depth of DOM elements on the page.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue" + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 4, + "x": 12, + "y": 61 + }, + "id": 156, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.info.domDepth.max, 'Max DOM depth')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue" + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 4, + "x": 16, + "y": 61 + }, + "id": 150, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.info.localStorageSize, 'Local storage size')", + "textEditor": false + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "The total number of iframes used on the page.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue" + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 4, + "x": 20, + "y": 61 + }, + "id": 250, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.coach.advice.info.scripts, 'Number of scripts')", + "textEditor": false + } + ], + "type": "stat" + } + ], + "title": "Even more page statistics", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 57 + }, + "id": 220, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 13, + "w": 24, + "x": 0, + "y": 58 + }, + "id": 221, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.contentTypes.*.requests, 10)", + "textEditor": false + } + ], + "title": "Number of requests per type", + "type": "timeseries" + } + ], + "title": "Request history", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 58 + }, + "id": 223, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 59 + }, + "id": 317, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Data collected using the [CPU long tasks API](https://developer.mozilla.org/en-US/docs/Web/API/Long_Tasks_API). The long tasks depends on the CPU used on the device that runs the tests so you can only compare metrics using the exact same device. Use the data to see trends.", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "yellow", + "value": 1 + }, + { + "color": "red", + "value": 2 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 5, + "x": 0, + "y": 61 + }, + "id": 229, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.tasks.$function, 'Long Tasks')", + "textEditor": true + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 1 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 6, + "x": 5, + "y": 61 + }, + "id": 230, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.beforeFirstContentfulPaint.tasks.$function, 'Long Tasks Before FCP')", + "textEditor": true + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "yellow", + "value": 100 + }, + { + "color": "red", + "value": 300 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 6, + "x": 11, + "y": 61 + }, + "id": 231, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.totalBlockingTime.$function, 'Total Blocking Time')", + "textEditor": true + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "yellow", + "value": 100 + }, + { + "color": "red", + "value": 300 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 7, + "x": 17, + "y": 61 + }, + "id": 232, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.durations.max, 'Longest Long Task')", + "textEditor": true + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 5, + "x": 0, + "y": 66 + }, + "id": 236, + "links": [], + "maxDataPoints": 100, + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "list", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.tasks.$function, 'Long Tasks')", + "textEditor": true + } + ], + "title": "CPU Long Tasks", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 6, + "x": 5, + "y": 66 + }, + "id": 237, + "links": [], + "maxDataPoints": 100, + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "list", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.beforeFirstContentfulPaint.tasks.$function, 'Long Tasks Before FCP')", + "textEditor": false + } + ], + "title": "CPU Long Tasks Before FCP", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 6, + "x": 11, + "y": 66 + }, + "id": 238, + "links": [], + "maxDataPoints": 100, + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "list", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.totalBlockingTime.$function, 'Total Blocking Time')", + "textEditor": true + } + ], + "title": "Total Blocking Time", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 7, + "x": 17, + "y": 66 + }, + "id": 239, + "links": [], + "maxDataPoints": 100, + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "list", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.longTasks.durations.max, 'Longest Long Task')", + "textEditor": true + } + ], + "title": "Longest Long Task", + "type": "timeseries" + } + ], + "title": "CPU Long Tasks [Chrome only, enable with --cpu]", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 59 + }, + "id": 96, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 73 + }, + "id": 323, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Data collected from the Chrome trace log whgere we can see where the browser spends it time creating the page.", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 15, + "w": 24, + "x": 0, + "y": 75 + }, + "id": 81, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull", + "range" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.categories.*.median, 12)", + "textEditor": false + } + ], + "title": "CPU [Chrome only]", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "The CPU metrics are collected from Chrome when you add --chrome.timeline to your run. The trace log is analyzed and sorted by type.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 24, + "x": 0, + "y": 90 + }, + "id": 138, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "table", + "placement": "right", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "currentAbove(aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cpu.events.*.median, 12), 1)", + "textEditor": false + } + ], + "title": "CPU time spent per event", + "type": "timeseries" + } + ], + "title": "CPU Details [Chrome only, enable with --cpu]", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 60 + }, + "id": 140, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 9, + "w": 24, + "x": 0, + "y": 61 + }, + "id": 104, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull", + "range" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cdp.performance.JSHeapTotalSize.$function, 12)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.cdp.performance.JSHeapUsedSize.$function, 12)", + "textEditor": false + } + ], + "title": "JS Heap size [Chrome only]", + "type": "timeseries" + } + ], + "title": "JavaScript heap [Chrome only]", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 61 + }, + "id": 252, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 62 + }, + "id": 322, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Delta TTFB metrics is metrics where we remove the time to first byte from the metrics. If we have metrics that are unstable because of unstable TTFB these metrics can be stable.", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "cacheTimeout": "", + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byName", + "options": "Heading" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "semi-dark-green", + "mode": "fixed" + } + } + ] + }, + { + "matcher": { + "id": "byName", + "options": "LastVisualChange" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "#cca300", + "mode": "fixed" + } + }, + { + "id": "custom.fillBelowTo", + "value": "FirstVisualChange" + } + ] + } + ] + }, + "gridPos": { + "h": 11, + "w": 24, + "x": 0, + "y": 64 + }, + "id": 253, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull", + "range" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "G", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.deltaToTFFB.*.$function, 11)", + "textEditor": false + } + ], + "title": "Visual Metrics [$function]", + "type": "timeseries" + } + ], + "title": "Delta TTFB", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 62 + }, + "id": 214, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "#EAB839", + "value": 2000 + }, + { + "color": "red", + "value": 4000 + } + ] + }, + "unit": "massg" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 6, + "x": 0, + "y": 61 + }, + "id": 215, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.sustainable.totalCO2.$function, 'Total C02')", + "textEditor": true + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "#EAB839", + "value": 2000 + }, + { + "color": "red", + "value": 4000 + } + ] + }, + "unit": "massg" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 6, + "x": 6, + "y": 61 + }, + "id": 216, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.sustainable.co2PerPageView.$function, 'CO2 Per Page View')", + "textEditor": true + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "#EAB839", + "value": 2000 + }, + { + "color": "red", + "value": 4000 + } + ] + }, + "unit": "massg" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 6, + "x": 12, + "y": 61 + }, + "id": 217, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "vertical", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.sustainable.co2FirstParty.$function, 'CO2 First Party')", + "textEditor": true + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [ + { + "options": { + "match": "null", + "result": { + "text": "N/A" + } + }, + "type": "special" + } + ], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "#EAB839", + "value": 2000 + }, + { + "color": "red", + "value": 4000 + } + ] + }, + "unit": "massg" + }, + "overrides": [] + }, + "gridPos": { + "h": 4, + "w": 6, + "x": 18, + "y": 61 + }, + "id": 218, + "links": [], + "maxDataPoints": 100, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "10.0.1", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.sustainable.co2ThirdParty.$function, 'CO2 Third Party')", + "textEditor": true + } + ], + "type": "stat" + } + ], + "title": "Carbon emission (enable with --sustainable.enable)", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 63 + }, + "id": 115, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 62 + }, + "id": 318, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Performance metrics that you can add yourself by annotating your page. We automatically collect [User Timing API](https://developer.mozilla.org/en-US/docs/Web/API/User_Timing_API) metrics and [Element Timing API metrics](https://developer.mozilla.org/en-US/docs/Web/API/Element_timing_API) (when elements are painted on the screen).", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "cacheTimeout": "", + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "Timing metrics collected using browser APIs like the Navigation Timing API.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 15, + "w": 12, + "x": 0, + "y": 64 + }, + "id": 118, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.fullyLoaded.$function, 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.firstPaint.$function, 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.largestContentfulPaint.renderTime.$function, 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "D", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.loadEventEnd.$function, 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "E", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.pageTimings.domContentLoadedTime.$function, 12)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "F", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.pageTimings.serverResponseTime.$function, 12)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "G", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.timeToContentfulPaint, 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "H", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.timeToFirstInteractive, 11)", + "textEditor": false + } + ], + "title": "Timings [$function]", + "type": "timeseries" + }, + { + "cacheTimeout": "", + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "Timings collected using the [Element Timing API](https://wicg.github.io/element-timing/).", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 15, + "w": 12, + "x": 12, + "y": 64 + }, + "id": 119, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "right", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.elementTimings.*.renderTime.$function, 12)", + "textEditor": false + } + ], + "title": "Element Timings [$function]", + "type": "timeseries" + }, + { + "cacheTimeout": "", + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "All User Timing marks created on the page using the [User Timing API](https://www.w3.org/TR/user-timing/).", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 24, + "x": 0, + "y": 79 + }, + "id": 120, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "right", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.userTimings.marks.*.$function, 13)", + "textEditor": false + } + ], + "title": "User Timings Marks [$function]", + "type": "timeseries" + }, + { + "cacheTimeout": "", + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "All User Timing marks created on the page using the [User Timing API](https://www.w3.org/TR/user-timing/).", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 24, + "x": 0, + "y": 86 + }, + "id": 248, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "right", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.userTimings.measures.*.$function, 13)", + "textEditor": false + } + ], + "title": "User Timings Measures [$function]", + "type": "timeseries" + } + ], + "title": "Timings, element timings and user timings", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 64 + }, + "id": 269, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 63 + }, + "id": 315, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Main document timings is the timings for downloading the main HTML page.", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "cacheTimeout": "", + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 15, + "w": 24, + "x": 0, + "y": 65 + }, + "id": 265, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull", + "range" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.mainDocumentTimings.*.$function, 12)", + "textEditor": false + } + ], + "title": "Main document timings [$function]", + "type": "timeseries" + } + ], + "title": "Main document timings", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 65 + }, + "id": 122, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "The Visual Metrics are collected by recording and analysing a video of the screen.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 3, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byRegexp", + "options": "/earlier/" + }, + "properties": [ + { + "id": "custom.fillOpacity", + "value": 0 + }, + { + "id": "custom.lineWidth", + "value": 3 + } + ] + } + ] + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 0, + "y": 64 + }, + "id": 124, + "links": [ + { + "targetBlank": true, + "title": "Page summary $page", + "url": "/dashboard/db/page-summary?$__url_time_range&$__all_variables" + } + ], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "aliasByNode(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.FirstVisualChange.$function, '24h'), 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "A", + "target": "alias(timeShift(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.FirstVisualChange.$function, '24h'), '7d'), 'One week earlier')", + "textEditor": false + } + ], + "title": "First Visual Change", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "The Visual Metrics are collected by recording and analysing a video of the screen.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 3, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byRegexp", + "options": "/earlier/" + }, + "properties": [ + { + "id": "custom.fillOpacity", + "value": 0 + }, + { + "id": "custom.lineWidth", + "value": 3 + } + ] + } + ] + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 12, + "y": 64 + }, + "id": 126, + "links": [ + { + "targetBlank": true, + "title": "Page summary $page", + "url": "/dashboard/db/page-summary?$__url_time_range&$__all_variables" + } + ], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "aliasByNode(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.SpeedIndex.$function, '24h'), 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "A", + "target": "alias(timeShift(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.SpeedIndex.$function, '24h'), '7d'), 'One week earlier')", + "textEditor": false + } + ], + "title": "Speed Index", + "type": "timeseries" + }, + { + "cacheTimeout": "", + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 3, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byRegexp", + "options": "/earlier/" + }, + "properties": [ + { + "id": "custom.fillOpacity", + "value": 0 + }, + { + "id": "custom.lineWidth", + "value": 3 + } + ] + } + ] + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 0, + "y": 72 + }, + "id": 128, + "links": [ + { + "targetBlank": true, + "title": "Page summary $page", + "url": "/dashboard/db/page-summary?$__url_time_range&$__all_variables" + } + ], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "alias(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.pageTimings.serverResponseTime.$function, '24h'), 'TTFB')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "A", + "target": "alias(timeShift(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.pageTimings.serverResponseTime.$function, '24h'), '7d'), 'One week earlier')", + "textEditor": false + } + ], + "title": "TTFB/Server response time", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 3, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": false, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byRegexp", + "options": "/earlier/" + }, + "properties": [ + { + "id": "custom.fillOpacity", + "value": 0 + }, + { + "id": "custom.lineWidth", + "value": 3 + } + ] + } + ] + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 12, + "y": 72 + }, + "id": 130, + "links": [ + { + "targetBlank": true, + "title": "Page summary $page", + "url": "/dashboard/db/page-summary?$__url_time_range&$__all_variables" + } + ], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "aliasByNode(movingAverage($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.fullyLoaded.$function, '24h'), 11)", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "A", + "target": "alias(timeShift(movingAverage($base.$path.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.fullyLoaded.$function, '24h'), '7d'), 'One week earlier')", + "textEditor": false + } + ], + "title": "Fully Loaded", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "The Visual Metrics are collected by recording and analysing a video of the screen.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 10, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 3, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 24, + "x": 0, + "y": 80 + }, + "id": 179, + "links": [ + { + "targetBlank": true, + "title": "Page summary $page", + "url": "/dashboard/db/page-summary?$__url_time_range&$__all_variables" + } + ], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.visualMetrics.FirstVisualChange.$function, 11)", + "textEditor": false + } + ], + "timeFrom": "30d", + "title": "First Visual Change History", + "type": "timeseries" + } + ], + "title": "Timing trends", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 66 + }, + "id": 234, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 11, + "w": 24, + "x": 0, + "y": 65 + }, + "id": 235, + "links": [], + "maxDataPoints": 100, + "options": { + "legend": { + "calcs": [ + "min", + "max" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.thirdParty.cookies, 'Third Party Cookies')", + "textEditor": true + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.firstParty.cookies, 'First Party Cookies')", + "textEditor": false + } + ], + "title": "Cookies", + "type": "timeseries" + } + ], + "title": "Cookies", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 67 + }, + "id": 136, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 35, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [ + { + "matcher": { + "id": "byName", + "options": "LastVisualChange" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "#cca300", + "mode": "fixed" + } + }, + { + "id": "custom.fillBelowTo", + "value": "FirstVisualChange" + } + ] + }, + { + "matcher": { + "id": "byName", + "options": "Heading" + }, + "properties": [ + { + "id": "custom.lineStyle", + "value": { + "dash": [ + 2, + 2 + ], + "fill": "dash" + } + } + ] + }, + { + "matcher": { + "id": "byName", + "options": "LargestImage" + }, + "properties": [ + { + "id": "custom.lineStyle", + "value": { + "dash": [ + 3, + 3 + ], + "fill": "dash" + } + } + ] + } + ] + }, + "gridPos": { + "h": 10, + "w": 12, + "x": 0, + "y": 67 + }, + "id": 142, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull", + "range" + ], + "displayMode": "table", + "placement": "right", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.thirdparty.category.*.requests.$function, 10)", + "textEditor": false + } + ], + "title": "Third party request by category", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 35, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [ + { + "matcher": { + "id": "byName", + "options": "LastVisualChange" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "#cca300", + "mode": "fixed" + } + }, + { + "id": "custom.fillBelowTo", + "value": "FirstVisualChange" + } + ] + }, + { + "matcher": { + "id": "byName", + "options": "Heading" + }, + "properties": [ + { + "id": "custom.lineStyle", + "value": { + "dash": [ + 2, + 2 + ], + "fill": "dash" + } + } + ] + }, + { + "matcher": { + "id": "byName", + "options": "LargestImage" + }, + "properties": [ + { + "id": "custom.lineStyle", + "value": { + "dash": [ + 3, + 3 + ], + "fill": "dash" + } + } + ] + } + ] + }, + "gridPos": { + "h": 10, + "w": 12, + "x": 12, + "y": 67 + }, + "id": 144, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull", + "range" + ], + "displayMode": "table", + "placement": "right", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.thirdparty.category.*.tools.$function, 10)", + "textEditor": false + } + ], + "title": "Third party tools by category", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "Activate by adding --thirdParty.cpu to to your run.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 24, + "x": 0, + "y": 77 + }, + "id": 134, + "links": [], + "options": { + "legend": { + "calcs": [ + "lastNotNull", + "max", + "min" + ], + "displayMode": "table", + "placement": "right", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.thirdparty.tool.*.cpu, 10)", + "textEditor": false + } + ], + "title": "CPU time spent per tool/domain - enable using --thirdParty.cpu [Chrome only]", + "type": "timeseries" + } + ], + "title": "Third party", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 68 + }, + "id": 176, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "All requests and their HTTP Status Code.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 15, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 9, + "w": 24, + "x": 0, + "y": 69 + }, + "id": 178, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull", + "range" + ], + "displayMode": "table", + "placement": "right", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.pagexray.responseCodes.*, 10)", + "textEditor": false + } + ], + "title": "Response codes", + "type": "timeseries" + } + ], + "title": "Response codes", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 69 + }, + "id": 172, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 12, + "x": 0, + "y": 70 + }, + "id": 111, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "right", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.console.*.$function, 11)", + "textEditor": false + } + ], + "title": "Console error and warnings", + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "Show number of errors from Browsertime and other tools.", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 12, + "x": 12, + "y": 70 + }, + "id": 174, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "right", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.errors.$function, 11)", + "textEditor": false + } + ], + "title": "Errors collecting the metrics", + "type": "timeseries" + } + ], + "title": "Errors", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 70 + }, + "id": 261, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 71 + }, + "id": 307, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Variation over time in the in CPU benchmark metric (how long time it takes to run a JavaScript loop). Use this metric to make sure the CPU speed is constant over time.", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "cacheTimeout": "", + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byName", + "options": "Heading" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "semi-dark-green", + "mode": "fixed" + } + } + ] + }, + { + "matcher": { + "id": "byName", + "options": "LastVisualChange" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "#cca300", + "mode": "fixed" + } + }, + { + "id": "custom.fillBelowTo", + "value": "FirstVisualChange" + } + ] + } + ] + }, + "gridPos": { + "h": 14, + "w": 24, + "x": 0, + "y": 73 + }, + "id": 244, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "G", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.browser.cpuBenchmark.min, 'min')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.browser.cpuBenchmark.median, 'median')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.browser.cpuBenchmark.max, 'max')", + "textEditor": false + } + ], + "title": "CPU benchmark", + "type": "timeseries" + }, + { + "cacheTimeout": "", + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byName", + "options": "Heading" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "semi-dark-green", + "mode": "fixed" + } + } + ] + }, + { + "matcher": { + "id": "byName", + "options": "LastVisualChange" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "#cca300", + "mode": "fixed" + } + }, + { + "id": "custom.fillBelowTo", + "value": "FirstVisualChange" + } + ] + } + ] + }, + "gridPos": { + "h": 14, + "w": 24, + "x": 0, + "y": 87 + }, + "id": 267, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "G", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.browser.cpuBenchmark.stddev, 'stddev')", + "textEditor": false + } + ], + "title": "CPU benchmark stddev", + "type": "timeseries" + } + ], + "title": "CPU benchmark variation", + "type": "row" + }, + { + "collapsed": true, + "datasource": { + "type": "graphite", + "uid": "E-Pn3IaGz" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 71 + }, + "id": 243, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 72 + }, + "id": 308, + "options": { + "code": { + "language": "plaintext", + "showLineNumbers": false, + "showMiniMap": false + }, + "content": "Variation over time in the time to first byte metric (TTFB). Use it to make sure TTFB is stable over time.", + "mode": "markdown" + }, + "pluginVersion": "10.0.1", + "type": "text" + }, + { + "cacheTimeout": "", + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byName", + "options": "Heading" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "semi-dark-green", + "mode": "fixed" + } + } + ] + }, + { + "matcher": { + "id": "byName", + "options": "LastVisualChange" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "#cca300", + "mode": "fixed" + } + }, + { + "id": "custom.fillBelowTo", + "value": "FirstVisualChange" + } + ] + } + ] + }, + "gridPos": { + "h": 14, + "w": 24, + "x": 0, + "y": 74 + }, + "id": 266, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "G", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.ttfb.min, 'min')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.ttfb.median, 'median')", + "textEditor": false + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "hide": false, + "refCount": 0, + "refId": "B", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.ttfb.max, 'max')", + "textEditor": false + } + ], + "title": "TTFB", + "type": "timeseries" + }, + { + "cacheTimeout": "", + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisCenteredZero": false, + "axisColorMode": "text", + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "links": [], + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green" + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [ + { + "matcher": { + "id": "byName", + "options": "Heading" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "semi-dark-green", + "mode": "fixed" + } + } + ] + }, + { + "matcher": { + "id": "byName", + "options": "LastVisualChange" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "#cca300", + "mode": "fixed" + } + }, + { + "id": "custom.fillBelowTo", + "value": "FirstVisualChange" + } + ] + } + ] + }, + "gridPos": { + "h": 14, + "w": 24, + "x": 0, + "y": 88 + }, + "id": 245, + "links": [], + "options": { + "legend": { + "calcs": [ + "min", + "max", + "lastNotNull" + ], + "displayMode": "table", + "placement": "bottom", + "showLegend": true + }, + "tooltip": { + "mode": "single", + "sort": "none" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "G", + "target": "alias($base.$path.$testname.pageSummary.$group.$page.$browser.$connectivity.browsertime.statistics.timings.ttfb.stddev, 'stddev')", + "textEditor": false + } + ], + "title": "TTFB stddev", + "type": "timeseries" + } + ], + "title": "TTFB variation", + "type": "row" + } + ], + "refresh": "", + "schemaVersion": 38, + "style": "dark", + "tags": [], + "templating": { + "list": [ + { + "hide": 2, + "label": "sitespeed_io", + "name": "base", + "query": "sitespeed_io", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "sitespeed_io", + "text": "sitespeed_io", + "selected": false + }, + "options": [ + { + "value": "sitespeed_io", + "text": "sitespeed_io", + "selected": false + } + ] + }, + { + "current": {}, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "definition": "", + "hide": 0, + "includeAll": false, + "multi": false, + "name": "path", + "options": [], + "query": "$base.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "type": "query", + "useTags": false + }, + { + "current": {}, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "definition": "$base.$path.*", + "hide": 0, + "includeAll": false, + "multi": false, + "name": "testname", + "options": [], + "query": "$base.$path.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "current": {}, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "definition": "$base.$path.$testname.pageSummary.*", + "hide": 0, + "includeAll": false, + "label": "domain", + "multi": false, + "name": "group", + "options": [], + "query": "$base.$path.$testname.pageSummary.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "type": "query", + "useTags": false + }, + { + "current": {}, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "definition": "$base.$path.$testname.pageSummary.$group.*", + "hide": 0, + "includeAll": false, + "multi": false, + "name": "page", + "options": [], + "query": "$base.$path.$testname.pageSummary.$group.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "type": "query", + "useTags": false + }, + { + "current": {}, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "definition": "$base.$path.$testname.pageSummary.$group.$page.*", + "hide": 0, + "includeAll": false, + "multi": false, + "name": "browser", + "options": [], + "query": "$base.$path.$testname.pageSummary.$group.$page.*", + "refresh": 1, + "regex": "chrome|firefox|safari|edge", + "skipUrlSync": false, + "sort": 0, + "type": "query", + "useTags": false + }, + { + "current": {}, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "definition": "$base.$path.$testname.pageSummary.$group.$page.$browser.*", + "hide": 0, + "includeAll": false, + "multi": false, + "name": "connectivity", + "options": [], + "query": "$base.$path.$testname.pageSummary.$group.$page.$browser.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "type": "query", + "useTags": false + }, + { + "auto": false, + "auto_count": 30, + "auto_min": "10s", + "current": { + "selected": false, + "text": "median", + "value": "median" + }, + "hide": 0, + "name": "function", + "options": [ + { + "selected": false, + "text": "min", + "value": "min" + }, + { + "selected": false, + "text": "mean", + "value": "mean" + }, + { + "selected": true, + "text": "median", + "value": "median" + }, + { + "selected": false, + "text": "p90", + "value": "p90" + }, + { + "selected": false, + "text": "max", + "value": "max" + }, + { + "selected": false, + "text": "stddev", + "value": "stddev" + } + ], + "query": "min, mean,median,p90,max,stddev", + "queryValue": "", + "refresh": 2, + "skipUrlSync": false, + "type": "interval" + }, + { + "hide": 2, + "name": "resulturl", + "query": "https://changeme.example.org", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "https://changeme.example.org", + "text": "https://changeme.example.org", + "selected": false + }, + "options": [ + { + "value": "https://changeme.example.org", + "text": "https://changeme.example.org", + "selected": false + } + ] + }, + { + "hide": 2, + "name": "screenshottype", + "query": "jpg", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "jpg", + "text": "jpg", + "selected": false + }, + "options": [ + { + "value": "jpg", + "text": "jpg", + "selected": false + } + ] + } + ] + }, + "time": { + "from": "now-7d", + "to": "now" + }, + "timepicker": { + "refresh_intervals": [ + "5s", + "10s", + "30s", + "1m", + "5m", + "15m", + "30m", + "1h", + "2h", + "1d" + ], + "time_options": [ + "5m", + "15m", + "1h", + "6h", + "12h", + "24h", + "2d", + "7d", + "30d" + ] + }, + "timezone": "browser", + "title": "Page metrics", + "uid": "9NDMzFfMk", + "version": 21, + "weekStart": "" +} \ No newline at end of file diff --git a/docker/grafana/provisioning/dashboards/Plus1.json b/docker/grafana/provisioning/dashboards/Plus1.json new file mode 100644 index 0000000000..d67a1dbb31 --- /dev/null +++ b/docker/grafana/provisioning/dashboards/Plus1.json @@ -0,0 +1,3268 @@ +{ + "__inputs": [ + { + "name": "graphite", + "label": "graphite", + "description": "", + "type": "datasource", + "pluginId": "graphite", + "pluginName": "Graphite" + }, + { + "name": "VAR_BASE", + "type": "constant", + "label": "sitespeed_io", + "value": "sitespeed_io", + "description": "" + } + ], + "__requires": [ + { + "type": "grafana", + "id": "grafana", + "name": "Grafana", + "version": "7.5.0" + }, + { + "type": "panel", + "id": "grafana-piechart-panel", + "name": "Pie Chart", + "version": "1.6.1" + }, + { + "type": "panel", + "id": "graph", + "name": "Graph", + "version": "" + }, + { + "type": "datasource", + "id": "graphite", + "name": "Graphite", + "version": "1.0.0" + }, + { + "type": "panel", + "id": "piechart", + "name": "Pie chart v2", + "version": "" + }, + { + "type": "panel", + "id": "stat", + "name": "Stat", + "version": "" + }, + { + "type": "panel", + "id": "text", + "name": "Text", + "version": "" + } + ], + "annotations": { + "list": [ + { + "builtIn": 1, + "datasource": "-- Grafana --", + "enable": true, + "hide": true, + "iconColor": "rgba(0, 211, 255, 1)", + "name": "Annotations & Alerts", + "type": "dashboard" + } + ] + }, + "editable": true, + "gnetId": null, + "graphTooltip": 0, + "id": null, + "iteration": 1616704198863, + "links": [], + "panels": [ + { + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 0 + }, + "id": 23, + "title": "Score", + "type": "row" + }, + { + "datasource": "graphite", + "fieldConfig": { + "defaults": {}, + "overrides": [] + }, + "gridPos": { + "h": 2, + "w": 24, + "x": 0, + "y": 1 + }, + "id": 9, + "options": { + "content": "Use the +1 container to get metrics from Lighthouse and GPSI", + "mode": "markdown" + }, + "pluginVersion": "7.5.0", + "targets": [ + { + "refId": "A", + "target": "" + } + ], + "timeFrom": null, + "timeShift": null, + "type": "text" + }, + { + "datasource": "graphite", + "fieldConfig": { + "defaults": { + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "red", + "value": null + }, + { + "color": "yellow", + "value": 80 + }, + { + "color": "green", + "value": 90 + } + ] + } + }, + "overrides": [] + }, + "gridPos": { + "h": 14, + "w": 12, + "x": 0, + "y": 3 + }, + "id": 26, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "7.5.0", + "targets": [ + { + "refId": "A", + "target": "aliasByNode($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.score.*, 9)", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "title": "GPSI Score", + "type": "stat" + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "decimals": 0, + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 14, + "w": 12, + "x": 12, + "y": 3 + }, + "hiddenSeries": false, + "id": 4, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "maxDataPoints": "", + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refId": "A", + "target": "aliasByNode($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.score.*, 9)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "timeShift": null, + "title": "GPSI Score", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "none", + "label": null, + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 17 + }, + "id": 30, + "panels": [], + "title": "CrUX Chrome data for origin $group", + "type": "row" + }, + { + "cacheTimeout": null, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "displayName": "First Contentful Paint", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1000 + }, + { + "color": "red", + "value": 3000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 6, + "x": 0, + "y": 18 + }, + "id": 39, + "interval": null, + "links": [], + "maxDataPoints": 1, + "options": { + "colorMode": "background", + "graphMode": "area", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "7.5.0", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.FIRST_CONTENTFUL_PAINT_MS.percentile, 'First Contentful Paint')", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "type": "stat" + }, + { + "cacheTimeout": null, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "displayName": "Largest Contentful Paint", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "yellow", + "value": 2500 + }, + { + "color": "red", + "value": 4000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 6, + "x": 6, + "y": 18 + }, + "id": 40, + "interval": null, + "links": [], + "maxDataPoints": 1, + "options": { + "colorMode": "background", + "graphMode": "area", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "7.5.0", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.LARGEST_CONTENTFUL_PAINT_MS.percentile, 'Largest Contentful Paint')", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "type": "stat" + }, + { + "cacheTimeout": null, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "displayName": "First Input Delay", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 100 + }, + { + "color": "red", + "value": 300 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 6, + "x": 12, + "y": 18 + }, + "id": 41, + "interval": null, + "links": [], + "maxDataPoints": 1, + "options": { + "colorMode": "background", + "graphMode": "area", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "7.5.0", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.FIRST_INPUT_DELAY_MS.percentile, 'First Input Delay')", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "type": "stat" + }, + { + "cacheTimeout": null, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "displayName": "Cumulative Layout Shift", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 10 + }, + { + "color": "red", + "value": 25 + } + ] + } + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 6, + "x": 18, + "y": 18 + }, + "id": 42, + "interval": null, + "links": [], + "maxDataPoints": 1, + "options": { + "colorMode": "background", + "graphMode": "area", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "7.5.0", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.CUMULATIVE_LAYOUT_SHIFT_SCORE.percentile, 'Cumulative Layout Shift')", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "type": "stat" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "cacheTimeout": null, + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": {}, + "overrides": [] + }, + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 7, + "w": 6, + "x": 0, + "y": 25 + }, + "id": 28, + "interval": null, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.FIRST_CONTENTFUL_PAINT_MS.fast, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.FIRST_CONTENTFUL_PAINT_MS.moderate, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.FIRST_CONTENTFUL_PAINT_MS.slow, 100), 9)", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "title": "First Contentful Paint", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "cacheTimeout": null, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "decimals": 0, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "percent" + }, + "overrides": [ + { + "matcher": { + "id": "byName", + "options": "slow" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "#E02F44", + "mode": "fixed" + } + } + ] + }, + { + "matcher": { + "id": "byName", + "options": "moderate" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "yellow", + "mode": "fixed" + } + } + ] + }, + { + "matcher": { + "id": "byName", + "options": "fast" + }, + "properties": [ + { + "id": "color", + "value": { + "fixedColor": "green", + "mode": "fixed" + } + } + ] + } + ] + }, + "gridPos": { + "h": 7, + "w": 6, + "x": 6, + "y": 25 + }, + "id": 31, + "interval": null, + "links": [], + "maxDataPoints": 1, + "options": { + "displayLabels": [], + "legend": { + "calcs": [], + "displayMode": "table", + "placement": "right", + "values": [ + "value" + ] + }, + "pieType": "pie", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {} + }, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.LARGEST_CONTENTFUL_PAINT_MS.fast, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.LARGEST_CONTENTFUL_PAINT_MS.moderate, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.LARGEST_CONTENTFUL_PAINT_MS.slow, 100), 9)", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Largest Contentful Paint", + "type": "piechart" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "cacheTimeout": null, + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": {}, + "overrides": [] + }, + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 7, + "w": 6, + "x": 12, + "y": 25 + }, + "id": 32, + "interval": null, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.FIRST_INPUT_DELAY_MS.fast, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.FIRST_INPUT_DELAY_MS.moderate, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.FIRST_INPUT_DELAY_MS.slow, 100), 9)", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "title": "First Input Delay", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "cacheTimeout": null, + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": {}, + "overrides": [] + }, + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 7, + "w": 6, + "x": 18, + "y": 25 + }, + "id": 33, + "interval": null, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.CUMULATIVE_LAYOUT_SHIFT_SCORE.fast, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.CUMULATIVE_LAYOUT_SHIFT_SCORE.moderate, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.CUMULATIVE_LAYOUT_SHIFT_SCORE.slow, 100), 9)", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Cumulative Layout Shift", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 9, + "w": 6, + "x": 0, + "y": 32 + }, + "hiddenSeries": false, + "id": 35, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.FIRST_CONTENTFUL_PAINT_MS.fast, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.FIRST_CONTENTFUL_PAINT_MS.moderate, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.FIRST_CONTENTFUL_PAINT_MS.slow, 100), 9)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "timeShift": null, + "title": "First Contentful Paint", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "label": null, + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 9, + "w": 6, + "x": 6, + "y": 32 + }, + "hiddenSeries": false, + "id": 36, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.LARGEST_CONTENTFUL_PAINT_MS.fast, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.LARGEST_CONTENTFUL_PAINT_MS.moderate, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.LARGEST_CONTENTFUL_PAINT_MS.slow, 100), 9)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "timeShift": null, + "title": "Largest Contentful Paint", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "label": null, + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 9, + "w": 6, + "x": 12, + "y": 32 + }, + "hiddenSeries": false, + "id": 37, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.FIRST_INPUT_DELAY_MS.fast, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.FIRST_INPUT_DELAY_MS.moderate, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.FIRST_INPUT_DELAY_MS.slow, 100), 9)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "timeShift": null, + "title": "First Input Delay", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "label": null, + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 9, + "w": 6, + "x": 18, + "y": 32 + }, + "hiddenSeries": false, + "id": 38, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.CUMULATIVE_LAYOUT_SHIFT_SCORE.fast, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.CUMULATIVE_LAYOUT_SHIFT_SCORE.moderate, 100), 9)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.summary.$group.gpsi.$type.originLoadingExperience.CUMULATIVE_LAYOUT_SHIFT_SCORE.slow, 100), 9)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "timeShift": null, + "title": "Cumulative Layout Shift", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "label": null, + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 41 + }, + "id": 25, + "panels": [], + "title": "CrUX Chrome data for page $group$page", + "type": "row" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "cacheTimeout": null, + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": {}, + "overrides": [] + }, + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 6, + "w": 6, + "x": 0, + "y": 42 + }, + "id": 16, + "interval": null, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.FIRST_CONTENTFUL_PAINT_MS.fast, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.FIRST_CONTENTFUL_PAINT_MS.moderate, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.FIRST_CONTENTFUL_PAINT_MS.slow, 100), 10)", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "title": "First Contentful Paint", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "cacheTimeout": null, + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": {}, + "overrides": [] + }, + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 6, + "w": 6, + "x": 6, + "y": 42 + }, + "id": 19, + "interval": null, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.LARGEST_CONTENTFUL_PAINT_MS.fast, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.LARGEST_CONTENTFUL_PAINT_MS.moderate, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.LARGEST_CONTENTFUL_PAINT_MS.slow, 100), 10)", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Largest Contentful Paint", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "cacheTimeout": null, + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": {}, + "overrides": [] + }, + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 6, + "w": 6, + "x": 12, + "y": 42 + }, + "id": 20, + "interval": null, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.FIRST_INPUT_DELAY_MS.fast, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.FIRST_INPUT_DELAY_MS.moderate, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.FIRST_INPUT_DELAY_MS.slow, 100), 10)", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "title": "First Input Delay", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "#E02F44" + }, + "breakPoint": "50%", + "cacheTimeout": null, + "combine": { + "label": "Others", + "threshold": 0 + }, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": {}, + "overrides": [] + }, + "fontSize": "80%", + "format": "percent", + "gridPos": { + "h": 6, + "w": 6, + "x": 18, + "y": 42 + }, + "id": 21, + "interval": null, + "legend": { + "show": true, + "values": true + }, + "legendType": "Right side", + "links": [], + "maxDataPoints": 1, + "nullPointMode": "connected", + "pieType": "pie", + "strokeWidth": 1, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.CUMULATIVE_LAYOUT_SHIFT_SCORE.fast, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.CUMULATIVE_LAYOUT_SHIFT_SCORE.moderate, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.CUMULATIVE_LAYOUT_SHIFT_SCORE, 100), 10)", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Cumulative Layout Shift", + "type": "grafana-piechart-panel", + "valueName": "current" + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 11, + "w": 6, + "x": 0, + "y": 48 + }, + "hiddenSeries": false, + "id": 6, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.FIRST_CONTENTFUL_PAINT_MS.fast, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.FIRST_CONTENTFUL_PAINT_MS.moderate, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.FIRST_CONTENTFUL_PAINT_MS.slow, 100), 10)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "First Contentful Paint", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "label": null, + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 11, + "w": 6, + "x": 6, + "y": 48 + }, + "hiddenSeries": false, + "id": 10, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.LARGEST_CONTENTFUL_PAINT_MS.fast, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.LARGEST_CONTENTFUL_PAINT_MS.moderate, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.LARGEST_CONTENTFUL_PAINT_MS.slow, 100), 10)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "Largest Contentful Paint", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "label": null, + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 11, + "w": 6, + "x": 12, + "y": 48 + }, + "hiddenSeries": false, + "id": 11, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.FIRST_INPUT_DELAY_MS.fast, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.FIRST_INPUT_DELAY_MS.moderate, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.FIRST_INPUT_DELAY_MS.slow, 100), 10)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "First Input Delay", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "label": null, + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": { + "slow": "dark-red" + }, + "bars": true, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "decimals": 0, + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 4, + "fillGradient": 0, + "gridPos": { + "h": 11, + "w": 6, + "x": 18, + "y": 48 + }, + "hiddenSeries": false, + "id": 12, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": true, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": true, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.CUMULATIVE_LAYOUT_SHIFT_SCORE.fast, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.CUMULATIVE_LAYOUT_SHIFT_SCORE.moderate, 100), 10)", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.CUMULATIVE_LAYOUT_SHIFT_SCORE.slow, 100), 10)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "Cumulative Layout Shift", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "percent", + "label": null, + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 59 + }, + "id": 18, + "panels": [], + "title": "History", + "type": "row" + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "decimals": 2, + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 14, + "w": 12, + "x": 0, + "y": 60 + }, + "hiddenSeries": false, + "id": 5, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.FIRST_CONTENTFUL_PAINT_MS.percentile, 'First Contentful Paint')", + "textEditor": false + }, + { + "refCount": 0, + "refId": "B", + "target": "alias($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.FIRST_INPUT_DELAY_MS.percentile, 'First Input Delay')", + "textEditor": false + }, + { + "refCount": 0, + "refId": "C", + "target": "alias($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.LARGEST_CONTENTFUL_PAINT_MS.percentile, 'Largest Contentful Paint')", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "Loading experience percentile", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 1, + "format": "ms", + "label": "", + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "decimals": 0, + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 14, + "w": 12, + "x": 12, + "y": 60 + }, + "hiddenSeries": false, + "id": 13, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testtype.pageSummary.$group.$page.gpsi.$type.loadingExperience.CUMULATIVE_LAYOUT_SHIFT_SCORE.percentile, 'Cumulative Layout Shift')", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": null, + "timeRegions": [], + "timeShift": null, + "title": "Loading experience percentile", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:1865", + "decimals": 0, + "format": "none", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "$$hashKey": "object:1866", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 74 + }, + "id": 44, + "panels": [], + "title": "Lighthouse Google Web Vitals", + "type": "row" + }, + { + "cacheTimeout": null, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "displayName": "First Contentful Paint", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1000 + }, + { + "color": "red", + "value": 3000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 6, + "x": 0, + "y": 75 + }, + "id": 46, + "interval": null, + "links": [], + "maxDataPoints": 1, + "options": { + "colorMode": "background", + "graphMode": "area", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "7.5.0", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testtype.pageSummary.$group.$page.lighthouse.audits.first-contentful-paint.numericValue, 'First Contentful Paint')", + "textEditor": true + } + ], + "timeFrom": null, + "timeShift": null, + "type": "stat" + }, + { + "cacheTimeout": null, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "displayName": "Largest Contentful Paint", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "yellow", + "value": 2500 + }, + { + "color": "red", + "value": 4000 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 6, + "x": 6, + "y": 75 + }, + "id": 47, + "interval": null, + "links": [], + "maxDataPoints": 1, + "options": { + "colorMode": "background", + "graphMode": "area", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "7.5.0", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testtype.pageSummary.$group.$page.lighthouse.audits.largest-contentful-paint.numericValue, 'First Contentful Paint')", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "type": "stat" + }, + { + "cacheTimeout": null, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 100 + }, + { + "color": "red", + "value": 300 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 6, + "x": 12, + "y": 75 + }, + "id": 50, + "interval": null, + "links": [], + "maxDataPoints": 1, + "options": { + "colorMode": "background", + "graphMode": "area", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "7.5.0", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testtype.pageSummary.$group.$page.lighthouse.audits.total-blocking-time.numericValue, 'Total Blocking ime')", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "type": "stat" + }, + { + "cacheTimeout": null, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "displayName": "Cumulative Layout Shift", + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 10 + }, + { + "color": "red", + "value": 25 + } + ] + } + }, + "overrides": [] + }, + "gridPos": { + "h": 7, + "w": 6, + "x": 18, + "y": 75 + }, + "id": 49, + "interval": null, + "links": [], + "maxDataPoints": 1, + "options": { + "colorMode": "background", + "graphMode": "area", + "justifyMode": "center", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "7.5.0", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testtype.pageSummary.$group.$page.lighthouse.audits.cumulative-layout-shift.numericValue, 'Cumulative Layout Shift')", + "textEditor": false + } + ], + "timeFrom": null, + "timeShift": null, + "type": "stat" + }, + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 82 + }, + "id": 55, + "panels": [], + "title": "Lighthouse score", + "type": "row" + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "links": [] + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 13, + "w": 24, + "x": 0, + "y": 83 + }, + "hiddenSeries": false, + "id": 2, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode(scale($base.$path.$testtype.pageSummary.$group.$page.lighthouse.categories.*.score, 100), 8)", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "timeShift": null, + "title": "Lighthouse Score", + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:360", + "format": "short", + "label": null, + "logBase": 1, + "max": "100", + "min": "0", + "show": true + }, + { + "$$hashKey": "object:361", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "collapsed": false, + "datasource": "graphite", + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 96 + }, + "id": 57, + "panels": [], + "title": "Lighthouse Google Web Vitals history", + "type": "row" + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "links": [], + "unit": "ms" + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 10, + "w": 12, + "x": 0, + "y": 97 + }, + "hiddenSeries": false, + "id": 45, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testtype.pageSummary.$group.$page.lighthouse.audits.first-contentful-paint.numericValue, 'First Contentful Paint')", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "timeShift": null, + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:360", + "format": "ms", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "$$hashKey": "object:361", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "links": [], + "unit": "ms" + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 10, + "w": 12, + "x": 12, + "y": 97 + }, + "hiddenSeries": false, + "id": 51, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testtype.pageSummary.$group.$page.lighthouse.audits.largest-contentful-paint.numericValue, 'Largest Contentful Paint')", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "timeShift": null, + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:360", + "format": "ms", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "$$hashKey": "object:361", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "links": [], + "unit": "ms" + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 10, + "w": 12, + "x": 0, + "y": 107 + }, + "hiddenSeries": false, + "id": 52, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testtype.pageSummary.$group.$page.lighthouse.audits.total-blocking-time.numericValue, 'Total Blocking Time')", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "timeShift": null, + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:360", + "format": "ms", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "$$hashKey": "object:361", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + }, + { + "aliasColors": {}, + "bars": false, + "dashLength": 10, + "dashes": false, + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "links": [], + "unit": "none" + }, + "overrides": [] + }, + "fill": 0, + "fillGradient": 0, + "gridPos": { + "h": 10, + "w": 12, + "x": 12, + "y": 107 + }, + "hiddenSeries": false, + "id": 53, + "legend": { + "alignAsTable": true, + "avg": false, + "current": true, + "max": true, + "min": true, + "show": true, + "total": false, + "values": true + }, + "lines": true, + "linewidth": 1, + "nullPointMode": "connected", + "options": { + "alertThreshold": true + }, + "percentage": false, + "pluginVersion": "7.5.0", + "pointradius": 2, + "points": false, + "renderer": "flot", + "seriesOverrides": [], + "spaceLength": 10, + "stack": false, + "steppedLine": false, + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testtype.pageSummary.$group.$page.lighthouse.audits.cumulative-layout-shift.numericValue, 'Cumulative Layout Shift')", + "textEditor": false + } + ], + "thresholds": [], + "timeFrom": "30d", + "timeRegions": [], + "timeShift": null, + "tooltip": { + "shared": true, + "sort": 0, + "value_type": "individual" + }, + "type": "graph", + "xaxis": { + "buckets": null, + "mode": "time", + "name": null, + "show": true, + "values": [] + }, + "yaxes": [ + { + "$$hashKey": "object:360", + "format": "none", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + }, + { + "$$hashKey": "object:361", + "format": "short", + "label": null, + "logBase": 1, + "max": null, + "min": null, + "show": true + } + ], + "yaxis": { + "align": false, + "alignLevel": null + } + } + ], + "schemaVersion": 27, + "style": "dark", + "tags": [], + "templating": { + "list": [ + { + "description": null, + "error": null, + "hide": 2, + "label": "sitespeed_io", + "name": "base", + "query": "sitespeed_io", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "sitespeed_io", + "text": "sitespeed_io", + "selected": false + }, + "options": [ + { + "value": "sitespeed_io", + "text": "sitespeed_io", + "selected": false + } + ] + }, + { + "allValue": null, + "current": {}, + "datasource": "graphite", + "definition": "$base.*", + "description": null, + "error": null, + "hide": 0, + "includeAll": false, + "label": null, + "multi": false, + "name": "path", + "options": [], + "query": "$base.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tags": [], + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "allValue": null, + "current": {}, + "datasource": "graphite", + "definition": "$base.$path.*", + "description": null, + "error": null, + "hide": 0, + "includeAll": false, + "label": null, + "multi": false, + "name": "testtype", + "options": [], + "query": "$base.$path.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tags": [], + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "allValue": null, + "current": {}, + "datasource": "graphite", + "definition": "$base.$path.$testtype.pageSummary.*", + "description": null, + "error": null, + "hide": 0, + "includeAll": false, + "label": "domain", + "multi": false, + "name": "group", + "options": [], + "query": "$base.$path.$testtype.pageSummary.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tags": [], + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "allValue": null, + "current": {}, + "datasource": "graphite", + "definition": "$base.$path.$testtype.pageSummary.$group.*", + "description": null, + "error": null, + "hide": 0, + "includeAll": false, + "label": null, + "multi": false, + "name": "page", + "options": [], + "query": "$base.$path.$testtype.pageSummary.$group.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tags": [], + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "allValue": null, + "current": { + "selected": true, + "text": "desktop", + "value": "desktop" + }, + "description": null, + "error": null, + "hide": 0, + "includeAll": false, + "label": "GPSI type", + "multi": false, + "name": "type", + "options": [ + { + "selected": false, + "text": "mobile", + "value": "mobile" + }, + { + "selected": true, + "text": "desktop", + "value": "desktop" + } + ], + "query": "mobile,desktop", + "queryValue": "", + "skipUrlSync": false, + "type": "custom" + } + ] + }, + "time": { + "from": "now-7d", + "to": "now" + }, + "timepicker": { + "refresh_intervals": [ + "10s", + "30s", + "1m", + "5m", + "15m", + "30m", + "1h", + "2h", + "1d" + ] + }, + "timezone": "", + "title": "Plus1", + "uid": "abRtVXRGk", + "version": 7 +} \ No newline at end of file diff --git a/docker/grafana/provisioning/dashboards/Welcome.json b/docker/grafana/provisioning/dashboards/Welcome.json new file mode 100644 index 0000000000..410ceda104 --- /dev/null +++ b/docker/grafana/provisioning/dashboards/Welcome.json @@ -0,0 +1,166 @@ +{ + "__inputs": [ + { + "name": "graphite", + "label": "graphite", + "description": "", + "type": "datasource", + "pluginId": "graphite", + "pluginName": "Graphite" + } + ], + "__requires": [ + { + "type": "panel", + "id": "dashlist", + "name": "Dashboard list", + "version": "" + }, + { + "type": "grafana", + "id": "grafana", + "name": "Grafana", + "version": "7.0.0" + }, + { + "type": "datasource", + "id": "graphite", + "name": "Graphite", + "version": "1.0.0" + }, + { + "type": "panel", + "id": "text", + "name": "Text", + "version": "" + } + ], + "annotations": { + "list": [ + { + "builtIn": 1, + "datasource": "-- Grafana --", + "enable": true, + "hide": true, + "iconColor": "rgba(0, 211, 255, 1)", + "name": "Annotations & Alerts", + "type": "dashboard" + } + ] + }, + "editable": true, + "gnetId": null, + "graphTooltip": 0, + "id": null, + "links": [], + "panels": [ + { + "content": "

Welcome to sitespeed.io

\n

\nsitespeed.io | \nDocumentation | \nSetup your own dashboard | \nChangelog | \nTwitter | \nOpen Collective\n

\n\n

\nSitespeed.io is a set of Open Source tools that makes it easy to monitor and measure the performance of your web site.\n

\n

If you don't know what you can do with sitespeed.io, you should look at the page timing dashboard or checkout what the HTML result looks like.\n", + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "custom": { + "align": null + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + } + }, + "overrides": [] + }, + "gridPos": { + "h": 18, + "w": 13, + "x": 0, + "y": 0 + }, + "id": 4, + "mode": "html", + "pluginVersion": "7.0.0", + "targets": [ + { + "refId": "A", + "target": "" + } + ], + "timeFrom": null, + "timeShift": null, + "title": "", + "type": "text" + }, + { + "datasource": "graphite", + "description": "", + "fieldConfig": { + "defaults": { + "custom": {} + }, + "overrides": [] + }, + "folderId": null, + "gridPos": { + "h": 18, + "w": 11, + "x": 13, + "y": 0 + }, + "headings": true, + "id": 2, + "limit": 10, + "query": "", + "recent": false, + "search": true, + "starred": false, + "tags": [], + "targets": [ + { + "refId": "A", + "target": "" + } + ], + "timeFrom": null, + "timeShift": null, + "title": "Installed dashboards", + "type": "dashlist" + } + ], + "schemaVersion": 25, + "style": "dark", + "tags": [], + "templating": { + "list": [] + }, + "time": { + "from": "now-6h", + "to": "now" + }, + "timepicker": { + "refresh_intervals": [ + "10s", + "30s", + "1m", + "5m", + "15m", + "30m", + "1h", + "2h", + "1d" + ] + }, + "timezone": "", + "title": "Welcome to sitespeed.io", + "uid": "3zStduRGk", + "version": 6 +} \ No newline at end of file diff --git a/docker/grafana/provisioning/dashboards/WikipediaLogin.json b/docker/grafana/provisioning/dashboards/WikipediaLogin.json new file mode 100644 index 0000000000..9355f1bfca --- /dev/null +++ b/docker/grafana/provisioning/dashboards/WikipediaLogin.json @@ -0,0 +1,2735 @@ +{ + "__inputs": [ + { + "name": "graphite", + "label": "graphite", + "description": "", + "type": "datasource", + "pluginId": "graphite", + "pluginName": "Graphite" + }, + { + "name": "VAR_BASE", + "type": "constant", + "label": "base", + "value": "sitespeed_io", + "description": "" + }, + { + "name": "VAR_PATH", + "type": "constant", + "label": "path", + "value": "desktopUserJourney", + "description": "" + }, + { + "name": "VAR_RESULTURL", + "type": "constant", + "label": "resulturl", + "value": "https://s3.amazonaws.com/results.sitespeed.io", + "description": "" + }, + { + "name": "VAR_TESTNAME", + "type": "constant", + "label": "testname", + "value": "loginWikipedia", + "description": "" + }, + { + "name": "VAR_DOMAIN", + "type": "constant", + "label": "domain", + "value": "en_wikipedia_org", + "description": "" + }, + { + "name": "VAR_PAGE1", + "type": "constant", + "label": "page1", + "value": "LoginPage", + "description": "" + }, + { + "name": "VAR_PAGE2", + "type": "constant", + "label": "page2", + "value": "LoggedIn", + "description": "" + }, + { + "name": "VAR_PAGE3", + "type": "constant", + "label": "page3", + "value": "_wiki_Barack_Obama", + "description": "" + }, + { + "name": "VAR_PAGE4", + "type": "constant", + "label": "page4", + "value": "_wiki_President_of_the_United_States", + "description": "" + } + ], + "__elements": [], + "__requires": [ + { + "type": "grafana", + "id": "grafana", + "name": "Grafana", + "version": "8.3.3" + }, + { + "type": "datasource", + "id": "graphite", + "name": "Graphite", + "version": "1.0.0" + }, + { + "type": "panel", + "id": "stat", + "name": "Stat", + "version": "" + }, + { + "type": "panel", + "id": "text", + "name": "Text", + "version": "" + }, + { + "type": "panel", + "id": "timeseries", + "name": "Time series", + "version": "" + } + ], + "annotations": { + "list": [ + { + "builtIn": 1, + "datasource": "-- Grafana --", + "enable": true, + "hide": true, + "iconColor": "rgba(0, 211, 255, 1)", + "name": "Annotations & Alerts", + "target": { + "limit": 100, + "matchAny": false, + "tags": [], + "type": "dashboard" + }, + "type": "dashboard" + } + ] + }, + "editable": true, + "fiscalYearStartMonth": 0, + "graphTooltip": 0, + "id": null, + "iteration": 1646754293149, + "links": [], + "liveNow": false, + "panels": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 3, + "w": 23, + "x": 0, + "y": 0 + }, + "id": 28, + "options": { + "content": "# Wikipedia - logged in user\nHere we test the Wikipedia as a logged in user. We measure the \n[login page](https://en.wikipedia.org/w/index.php?title=Special:UserLogin&returnto=Main+Page), log in the user and measure when we are redirected back to the main page. We wait for 21 seconds and then \ngo the [Barack Obama page](https://en.wikipedia.org/wiki/Barack_Obama). When the page finished loading, we then waits another 21 seconds and then go to the [President page](https://en.wikipedia.org/wiki/President_of_the_United_States).\n\n ", + "mode": "markdown" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "" + } + ], + "type": "text" + }, + { + "collapsed": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 3 + }, + "id": 6, + "panels": [], + "title": "Screenshots", + "type": "row" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 5, + "w": 6, + "x": 0, + "y": 4 + }, + "id": 2, + "options": { + "content": "\n", + "mode": "html" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "" + } + ], + "title": "Login page", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 5, + "w": 6, + "x": 6, + "y": 4 + }, + "id": 42, + "options": { + "content": "\n", + "mode": "html" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "" + } + ], + "title": "Login step and redirect to main page", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 5, + "w": 6, + "x": 12, + "y": 4 + }, + "id": 43, + "options": { + "content": "\n", + "mode": "html" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "" + } + ], + "title": "Barack Obama page", + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "description": "", + "gridPos": { + "h": 5, + "w": 6, + "x": 18, + "y": 4 + }, + "id": 44, + "options": { + "content": "\n", + "mode": "html" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "" + } + ], + "title": "President of the United States page", + "type": "text" + }, + { + "collapsed": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 9 + }, + "id": 13, + "panels": [], + "title": "Video", + "type": "row" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 6, + "w": 6, + "x": 0, + "y": 10 + }, + "id": 14, + "options": { + "content": "", + "mode": "html" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "" + } + ], + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 6, + "w": 6, + "x": 6, + "y": 10 + }, + "id": 45, + "options": { + "content": "", + "mode": "html" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "" + } + ], + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 6, + "w": 6, + "x": 12, + "y": 10 + }, + "id": 46, + "options": { + "content": "", + "mode": "html" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "" + } + ], + "type": "text" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 6, + "w": 6, + "x": 18, + "y": 10 + }, + "id": 47, + "options": { + "content": "", + "mode": "html" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refId": "A", + "target": "" + } + ], + "type": "text" + }, + { + "collapsed": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 16 + }, + "id": 9, + "panels": [], + "title": "Visual Metrics", + "type": "row" + }, + { + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 11, + "w": 6, + "x": 0, + "y": 17 + }, + "id": 7, + "options": { + "legend": { + "calcs": [ + "lastNotNull", + "max", + "min" + ], + "displayMode": "table", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page1.$browser.$connectivity.browsertime.statistics.visualMetrics.FirstVisualChange.$function, 11)" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "B", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page1.$browser.$connectivity.browsertime.statistics.visualMetrics.LargestImage.$function, 11)" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "C", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page1.$browser.$connectivity.browsertime.statistics.visualMetrics.SpeedIndex.$function, 11)" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "refCount": 0, + "refId": "D", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page1.$browser.$connectivity.browsertime.statistics.visualMetrics.LastVisualChange.$function, 11)" + } + ], + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 11, + "w": 6, + "x": 6, + "y": 17 + }, + "id": 17, + "options": { + "legend": { + "calcs": [ + "lastNotNull", + "max", + "min" + ], + "displayMode": "table", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page2.$browser.$connectivity.browsertime.statistics.visualMetrics.FirstVisualChange.$function, 11)" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page2.$browser.$connectivity.browsertime.statistics.visualMetrics.LargestImage.$function, 11)" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page2.$browser.$connectivity.browsertime.statistics.visualMetrics.SpeedIndex.$function, 11)" + }, + { + "refCount": 0, + "refId": "D", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page2.$browser.$connectivity.browsertime.statistics.visualMetrics.LastVisualChange.$function, 11)" + } + ], + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 11, + "w": 6, + "x": 12, + "y": 17 + }, + "id": 18, + "options": { + "legend": { + "calcs": [ + "lastNotNull", + "max", + "min" + ], + "displayMode": "table", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page3.$browser.$connectivity.browsertime.statistics.visualMetrics.FirstVisualChange.$function, 11)" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page3.$browser.$connectivity.browsertime.statistics.visualMetrics.LargestImage.$function, 11)" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page3.$browser.$connectivity.browsertime.statistics.visualMetrics.SpeedIndex.$function, 11)" + }, + { + "refCount": 0, + "refId": "D", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page3.$browser.$connectivity.browsertime.statistics.visualMetrics.LastVisualChange.$function, 11)" + } + ], + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 11, + "w": 6, + "x": 18, + "y": 17 + }, + "id": 48, + "options": { + "legend": { + "calcs": [ + "lastNotNull", + "max", + "min" + ], + "displayMode": "table", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page4.$browser.$connectivity.browsertime.statistics.visualMetrics.FirstVisualChange.$function, 11)" + }, + { + "refCount": 0, + "refId": "B", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page4.$browser.$connectivity.browsertime.statistics.visualMetrics.LargestImage.$function, 11)" + }, + { + "refCount": 0, + "refId": "C", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page4.$browser.$connectivity.browsertime.statistics.visualMetrics.SpeedIndex.$function, 11)" + }, + { + "refCount": 0, + "refId": "D", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page4.$browser.$connectivity.browsertime.statistics.visualMetrics.LastVisualChange.$function, 11)" + } + ], + "type": "timeseries" + }, + { + "collapsed": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 28 + }, + "id": 20, + "panels": [], + "title": "CPU Long Tasks", + "type": "row" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 100 + }, + { + "color": "red", + "value": 300 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 3, + "x": 0, + "y": 29 + }, + "id": 21, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page1.$browser.$connectivity.browsertime.statistics.cpu.longTasks.totalBlockingTime.$function, 'Total Blocking Time')" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1 + }, + { + "color": "red", + "value": 2 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 3, + "x": 3, + "y": 29 + }, + "id": 22, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page1.$browser.$connectivity.browsertime.statistics.cpu.longTasks.tasks.$function, 'Long Tasks')" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 100 + }, + { + "color": "red", + "value": 300 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 3, + "x": 6, + "y": 29 + }, + "id": 23, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page2.$browser.$connectivity.browsertime.statistics.cpu.longTasks.totalBlockingTime.$function, 'Total Blocking Time')" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1 + }, + { + "color": "red", + "value": 2 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 3, + "x": 9, + "y": 29 + }, + "id": 24, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page2.$browser.$connectivity.browsertime.statistics.cpu.longTasks.tasks.$function, 'Long Tasks')" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 100 + }, + { + "color": "red", + "value": 300 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 3, + "x": 12, + "y": 29 + }, + "id": 25, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page3.$browser.$connectivity.browsertime.statistics.cpu.longTasks.totalBlockingTime.$function, 'Total Blocking Time')" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1 + }, + { + "color": "red", + "value": 2 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 3, + "x": 15, + "y": 29 + }, + "id": 26, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page3.$browser.$connectivity.browsertime.statistics.cpu.longTasks.tasks.$function, 'Long Tasks')" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 100 + }, + { + "color": "red", + "value": 300 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 3, + "x": 18, + "y": 29 + }, + "id": 49, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page4.$browser.$connectivity.browsertime.statistics.cpu.longTasks.totalBlockingTime.$function, 'Total Blocking Time')" + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "#EAB839", + "value": 1 + }, + { + "color": "red", + "value": 2 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 3, + "x": 21, + "y": 29 + }, + "id": 50, + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "text": {}, + "textMode": "auto" + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page4.$browser.$connectivity.browsertime.statistics.cpu.longTasks.tasks.$function, 'Long Tasks')" + } + ], + "type": "stat" + }, + { + "collapsed": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 34 + }, + "id": 30, + "panels": [], + "title": "CPU Long Tasks history", + "type": "row" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 6, + "x": 0, + "y": 35 + }, + "id": 31, + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page1.$browser.$connectivity.browsertime.statistics.cpu.longTasks.totalBlockingTime.$function, 'Total Blocking Time')" + } + ], + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "mappings": [], + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 6, + "x": 6, + "y": 35 + }, + "id": 33, + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page2.$browser.$connectivity.browsertime.statistics.cpu.longTasks.totalBlockingTime.$function, 'Total Blocking Time')" + } + ], + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "mappings": [], + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 6, + "x": 12, + "y": 35 + }, + "id": 35, + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page3.$browser.$connectivity.browsertime.statistics.cpu.longTasks.totalBlockingTime.$function, 'Total Blocking Time')" + } + ], + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "mappings": [], + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "ms" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 6, + "x": 18, + "y": 35 + }, + "id": 53, + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page4.$browser.$connectivity.browsertime.statistics.cpu.longTasks.totalBlockingTime.$function, 'Total Blocking Time')" + } + ], + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "mappings": [], + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 6, + "x": 0, + "y": 40 + }, + "id": 32, + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page1.$browser.$connectivity.browsertime.statistics.cpu.longTasks.tasks.$function, 'Long Tasks')" + } + ], + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "mappings": [], + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 6, + "x": 6, + "y": 40 + }, + "id": 34, + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page2.$browser.$connectivity.browsertime.statistics.cpu.longTasks.tasks.$function, 'Long Tasks')" + } + ], + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "mappings": [], + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 6, + "x": 12, + "y": 40 + }, + "id": 36, + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page3.$browser.$connectivity.browsertime.statistics.cpu.longTasks.tasks.$function, 'Long Tasks')" + } + ], + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "decimals": 0, + "mappings": [], + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "none" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 6, + "x": 18, + "y": 40 + }, + "id": 52, + "options": { + "legend": { + "calcs": [ + "max", + "min" + ], + "displayMode": "list", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "alias($base.$path.$testname.pageSummary.$domain.$page4.$browser.$connectivity.browsertime.statistics.cpu.longTasks.tasks.$function, 'Long Tasks')" + } + ], + "type": "timeseries" + }, + { + "collapsed": false, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 45 + }, + "id": 38, + "panels": [], + "title": "Response transfer size", + "type": "row" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 17, + "w": 6, + "x": 0, + "y": 46 + }, + "id": 39, + "options": { + "legend": { + "calcs": [ + "lastNotNull", + "max", + "min" + ], + "displayMode": "table", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page1.$browser.$connectivity.pagexray.contentTypes.*.transferSize, 10)" + } + ], + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 17, + "w": 6, + "x": 6, + "y": 46 + }, + "id": 40, + "options": { + "legend": { + "calcs": [ + "lastNotNull", + "max", + "min" + ], + "displayMode": "table", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page2.$browser.$connectivity.pagexray.contentTypes.*.transferSize, 10)" + } + ], + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 17, + "w": 6, + "x": 12, + "y": 46 + }, + "id": 41, + "options": { + "legend": { + "calcs": [ + "lastNotNull", + "max", + "min" + ], + "displayMode": "table", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page3.$browser.$connectivity.pagexray.contentTypes.*.transferSize, 10)" + } + ], + "type": "timeseries" + }, + { + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "palette-classic" + }, + "custom": { + "axisLabel": "", + "axisPlacement": "auto", + "barAlignment": 0, + "drawStyle": "line", + "fillOpacity": 0, + "gradientMode": "none", + "hideFrom": { + "legend": false, + "tooltip": false, + "viz": false + }, + "lineInterpolation": "linear", + "lineWidth": 1, + "pointSize": 5, + "scaleDistribution": { + "type": "linear" + }, + "showPoints": "never", + "spanNulls": true, + "stacking": { + "group": "A", + "mode": "none" + }, + "thresholdsStyle": { + "mode": "off" + } + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "decbytes" + }, + "overrides": [] + }, + "gridPos": { + "h": 17, + "w": 6, + "x": 18, + "y": 46 + }, + "id": 51, + "options": { + "legend": { + "calcs": [ + "lastNotNull", + "max", + "min" + ], + "displayMode": "table", + "placement": "bottom" + }, + "tooltip": { + "mode": "single" + } + }, + "pluginVersion": "8.3.3", + "targets": [ + { + "refCount": 0, + "refId": "A", + "target": "aliasByNode($base.$path.$testname.pageSummary.$domain.$page4.$browser.$connectivity.pagexray.contentTypes.*.transferSize, 10)" + } + ], + "type": "timeseries" + } + ], + "schemaVersion": 34, + "style": "dark", + "tags": [], + "templating": { + "list": [ + { + "hide": 2, + "name": "base", + "query": "sitespeed_io", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "sitespeed_io", + "text": "sitespeed_io", + "selected": false + }, + "options": [ + { + "value": "sitespeed_io", + "text": "sitespeed_io", + "selected": false + } + ] + }, + { + "hide": 2, + "name": "path", + "query": "${VAR_PATH}", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "${VAR_PATH}", + "text": "${VAR_PATH}", + "selected": false + }, + "options": [ + { + "value": "${VAR_PATH}", + "text": "${VAR_PATH}", + "selected": false + } + ] + }, + { + "hide": 2, + "name": "resulturl", + "query": "https://changeme.example.org", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "https://changeme.example.org", + "text": "https://changeme.example.org", + "selected": false + }, + "options": [ + { + "value": "https://changeme.example.org", + "text": "https://changeme.example.org", + "selected": false + } + ] + }, + { + "current": {}, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "definition": "$base.$path.$testname.pageSummary.*.*.*", + "hide": 0, + "includeAll": false, + "multi": false, + "name": "browser", + "options": [], + "query": "$base.$path.$testname.pageSummary.*.*.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "current": {}, + "datasource": { + "type": "graphite", + "uid": "graphite" + }, + "definition": "$base.$path.$testname.pageSummary.*.*.$browser.*", + "hide": 0, + "includeAll": false, + "multi": false, + "name": "connectivity", + "options": [], + "query": "$base.$path.$testname.pageSummary.*.*.$browser.*", + "refresh": 1, + "regex": "", + "skipUrlSync": false, + "sort": 0, + "tagValuesQuery": "", + "tagsQuery": "", + "type": "query", + "useTags": false + }, + { + "auto": false, + "auto_count": 30, + "auto_min": "10s", + "current": { + "selected": false, + "text": "median", + "value": "median" + }, + "hide": 0, + "name": "function", + "options": [ + { + "selected": false, + "text": "min", + "value": "min" + }, + { + "selected": false, + "text": "mean", + "value": "mean" + }, + { + "selected": true, + "text": "median", + "value": "median" + }, + { + "selected": false, + "text": "p90", + "value": "p90" + }, + { + "selected": false, + "text": "max", + "value": "max" + }, + { + "selected": false, + "text": "stddev", + "value": "stddev" + } + ], + "query": "min, mean,median,p90,max,stddev", + "refresh": 2, + "skipUrlSync": false, + "type": "interval" + }, + { + "hide": 2, + "name": "testname", + "query": "${VAR_TESTNAME}", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "${VAR_TESTNAME}", + "text": "${VAR_TESTNAME}", + "selected": false + }, + "options": [ + { + "value": "${VAR_TESTNAME}", + "text": "${VAR_TESTNAME}", + "selected": false + } + ] + }, + { + "hide": 2, + "name": "domain", + "query": "${VAR_DOMAIN}", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "${VAR_DOMAIN}", + "text": "${VAR_DOMAIN}", + "selected": false + }, + "options": [ + { + "value": "${VAR_DOMAIN}", + "text": "${VAR_DOMAIN}", + "selected": false + } + ] + }, + { + "hide": 2, + "name": "page1", + "query": "${VAR_PAGE1}", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "${VAR_PAGE1}", + "text": "${VAR_PAGE1}", + "selected": false + }, + "options": [ + { + "value": "${VAR_PAGE1}", + "text": "${VAR_PAGE1}", + "selected": false + } + ] + }, + { + "hide": 2, + "name": "page2", + "query": "${VAR_PAGE2}", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "${VAR_PAGE2}", + "text": "${VAR_PAGE2}", + "selected": false + }, + "options": [ + { + "value": "${VAR_PAGE2}", + "text": "${VAR_PAGE2}", + "selected": false + } + ] + }, + { + "hide": 2, + "name": "page3", + "query": "${VAR_PAGE3}", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "${VAR_PAGE3}", + "text": "${VAR_PAGE3}", + "selected": false + }, + "options": [ + { + "value": "${VAR_PAGE3}", + "text": "${VAR_PAGE3}", + "selected": false + } + ] + }, + { + "hide": 2, + "name": "page4", + "query": "${VAR_PAGE4}", + "skipUrlSync": false, + "type": "constant", + "current": { + "value": "${VAR_PAGE4}", + "text": "${VAR_PAGE4}", + "selected": false + }, + "options": [ + { + "value": "${VAR_PAGE4}", + "text": "${VAR_PAGE4}", + "selected": false + } + ] + } + ] + }, + "time": { + "from": "now-24h", + "to": "now" + }, + "timepicker": {}, + "timezone": "", + "title": "Wikipedia login", + "uid": "d-pdqGBGdse", + "version": 47, + "weekStart": "" +} \ No newline at end of file diff --git a/docker/grafana/provisioning/dashboards/default.yaml b/docker/grafana/provisioning/dashboards/default.yaml new file mode 100644 index 0000000000..da92ff3059 --- /dev/null +++ b/docker/grafana/provisioning/dashboards/default.yaml @@ -0,0 +1,24 @@ +apiVersion: 1 + +providers: + # an unique provider name. Required + - name: 'sitespeed.io' + # Org id. Default to 1 + orgId: 1 + # name of the dashboard folder. + folder: 'sitespeed.io' + # folder UID. will be automatically generated if not specified + folderUid: '' + # provider type. Default to 'file' + type: file + # disable dashboard deletion + disableDeletion: false + # how often Grafana will scan for changed dashboards + updateIntervalSeconds: 10 + # allow updating provisioned dashboards from the UI + allowUiUpdates: true + options: + # path to dashboard files on disk. Required when using the 'file' type + path: /var/lib/grafana/dashboards + # use folder names from filesystem to create folders in Grafana + foldersFromFilesStructure: true diff --git a/docker/grafana/provisioning/datasources/graphite.yaml b/docker/grafana/provisioning/datasources/graphite.yaml new file mode 100644 index 0000000000..67383c33ab --- /dev/null +++ b/docker/grafana/provisioning/datasources/graphite.yaml @@ -0,0 +1,51 @@ +# Configuration file version +apiVersion: 1 + +# List of data sources to delete from the database. +deleteDatasources: + - name: graphite + orgId: 1 + +# List of data sources to insert/update depending on what's +# available in the database. +datasources: + # Sets the name you use to refer to + # the data source in panels and queries. + - name: graphite + # Sets the data source type. + type: graphite + # Sets the access mode, either + # proxy or direct (Server or Browser in the UI). + # Some data sources are incompatible with any setting + # but proxy (Server). + access: proxy + # Sets the organization id. Defaults to orgId 1. + orgId: 1 + # Sets a custom UID to reference this + # data source in other parts of the configuration. + # If not specified, Grafana generates one. + uid: + # Sets the data source's URL, including the + # port. + url: http://graphite:80 + # Sets the database user, if necessary. + user: + # Sets the database name, if necessary. + database: + # Enables basic authorization. + basicAuth: true + # Sets the basic authorization username. + basicAuthUser: guest + # Enables credential headers. + withCredentials: false + # Toggles whether the data source is pre-selected + # for new panels. You can set only one default + # data source per organization. + isDefault: true + secureJsonData: + # Sets the basic authorization password. + basicAuthPassword: guest + version: 1 + # Allows users to edit data sources from the + # Grafana UI. + editable: true \ No newline at end of file diff --git a/docker/grafana/provisioning/datasources/json.yaml b/docker/grafana/provisioning/datasources/json.yaml new file mode 100644 index 0000000000..210936539b --- /dev/null +++ b/docker/grafana/provisioning/datasources/json.yaml @@ -0,0 +1,18 @@ +# Configuration file version +apiVersion: 1 + +# List of data sources to delete from the database. +deleteDatasources: + - name: json-api + orgId: 1 + +# List of data sources to insert/update depending on what's +# available in the database. +datasources: + # Sets the name you use to refer to + # the data source in panels and queries. + - name: json-api + # Sets the data source type. + type: marcusolsson-json-datasource + url: https://changeme.example.com + editable: true \ No newline at end of file