You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The Synthetics **Overview** tab provides you with a high-level view of all the services you are monitoring to help you quickly diagnose outages and other connectivity issues within your network.
15
14
16
-
% Internal links rely on the following IDs being on this page (e.g. as a heading ID, paragraph ID, etc):
15
+
To access this page, find `Synthetics` in the [global search field](../../../get-started/the-stack.md#kibana-navigation-search) and make sure you’re on the **Overview** tab.
This overview includes a snapshot of the current status of all monitors, the number of errors that occurred over the last 6 hours, and the number of alerts over the last 12 hours. All monitors created using projects or using the UI will be listed below with information about the location, current status, and duration average.
When you use a single monitor configuration to create monitors in multiple locations, each location is listed as a separate monitor as they run as individual monitors and the status and duration average can vary by location.
To get started with your analysis in the Overview tab, you can search for monitors or use the filter options including current status (up, down, or disabled), monitor type (for example, journey or HTTP), location, and more.
29
31
30
-
$$$synthetics-analyze-one-step-network$$$
32
+
Then click an individual monitor to see some details in a flyout. From there, you can click **Go to monitor** to go to an individual monitor’s page to see more details (as described below).
31
33
32
-
$$$synthetics-analyze-one-step-timing$$$
33
34
34
-
$$$synthetics-analyze-one-step$$$
35
+
## All monitor types [synthetics-analyze-individual-monitors]
36
+
37
+
When you go to an individual monitor’s page, you’ll see much more detail about the monitor’s performance over time. The details vary by monitor type, but for every monitor at the top of the page you’ll see:
38
+
39
+
* The monitor’s **name** with a down arrow icon that you can use to quickly move between monitors.
40
+
* The **location** of the monitor. If the same monitor configuration was used to create monitors in multiple locations, you’ll also see a down arrow icon that you can use to quickly move between locations that use the same configuration.
41
+
* The latest **status** and when the monitor was **last run**.
42
+
* The **![Beaker icon](../../../images/observability-beaker.svg"") Run test manually** button that allows you to run the test on demand before the next scheduled run.
43
+
44
+
::::{note}
45
+
This is only available for monitors running on Elastic’s global managed testing infrastructure. It is not available for monitors running on {{private-location}}s.
46
+
47
+
::::
48
+
49
+
* The **![Pencil icon](../../../images/observability-pencil.svg"") Edit monitor** button that allows you to edit the monitor’s configuration.
The **Overview** tab has information about the monitor availability, duration, and any errors that have occurred since the monitor was created. The *Duration trends* chart displays the timing for each check that was performed in the last 30 days. This visualization helps you to gain insights into how quickly requests resolve by the targeted endpoint and gives you a sense of how frequently a host or endpoint was down.
:alt: Details in the Overview tab on the individual monitor page for all monitor types in the {synthetics-app}
65
+
:class: screenshot
66
+
:::
67
+
68
+
69
+
### History [synthetics-analyze-individual-monitors-history]
70
+
71
+
The **History** tab has information on every time the monitor has run. It includes some high-level stats and a complete list of all test runs. Use the calendar icon (![Calendar icon](../../../images/observability-calendar.svg"")) and search bar to filter for runs that occurred in a specific time period.
72
+
73
+
For browser monitors, you can click on any run in the **Test runs** list to see the details for that run. Read more about what information is included the in [Details for one run](../../../solutions/observability/apps/analyze-data-from-synthetic-monitors.md#synthetics-analyze-one-run) section below.
:alt: The History tab on the individual monitor page for all monitor types in the {synthetics-app}
77
+
:class: screenshot
78
+
:::
79
+
80
+
If the monitor is configured to [retest on failure](../../../solutions/observability/apps/configure-synthetics-projects.md#synthetics-configuration-monitor), you’ll see retests listed in the **Test runs** table. Runs that are retests include a rerun icon (![Refresh icon](../../../images/observability-refresh.svg"")) next to the result badge.
The **Errors** tab has information on failed runs. If the monitor is configured to [retest on failure](../../../solutions/observability/apps/configure-synthetics-projects.md#synthetics-configuration-monitor), failed runs will only result in an error if both the initial run and the rerun fail. This can reduce noise related to transient problems.
91
+
92
+
The Errors tab includes a high-level overview of all alerts and a complete list of all failures. Use the calendar icon (![Calendar icon](../../../images/observability-calendar.svg"")) and search bar to filter for runs that occurred in a specific time period.
93
+
94
+
For browser monitors, you can click on any run in the **Error** list to open an **Error details** page that includes most of the same information that is included the in [Details for one run](../../../solutions/observability/apps/analyze-data-from-synthetic-monitors.md#synthetics-analyze-one-run) section below.
:alt: The Errors tab on the individual monitor page for all monitor types in the {synthetics-app}
98
+
:class: screenshot
99
+
:::
100
+
101
+
102
+
## Browser monitors [synthetics-analyze-journeys]
103
+
104
+
For browser monitors, you can look at results at various levels of granularity:
105
+
106
+
* See an overview of journey runs over time.
107
+
* Drill down into the details of a single run.
108
+
* Drill down further into the details of a single *step* within a journey.
109
+
110
+
111
+
### Journey runs over time [journey_runs_over_time]
112
+
113
+
The journey page on the Overview tab includes:
114
+
115
+
* An overview of the **last test run** including high-level information for each step.
116
+
***Alerts** to date including both active and recovered alerts.
117
+
***Duration by step** over the last 24 hours.
118
+
* A list of the **last 10 test runs** that link to the [details for each run](../../../solutions/observability/apps/analyze-data-from-synthetic-monitors.md#synthetics-analyze-one-run).
:alt: Individual journey page for browser monitors in the {synthetics-app}
122
+
:class: screenshot
123
+
:::
124
+
125
+
From here, you can either drill down into:
126
+
127
+
* The latest run of the full journey by clicking **![Inspect icon](../../../images/observability-inspect.svg"") View test run** or a past run in the list of **Last 10 test runs**. This will take you to the view described below in [Details for one run](../../../solutions/observability/apps/analyze-data-from-synthetic-monitors.md#synthetics-analyze-one-run).
128
+
* An individual step in this run by clicking the performance breakdown icon (![Performance breakdown icon](../../../images/observability-apmTrace.svg"")) next to one of the steps. This will take you to the view described below in [Details for one step](../../../solutions/observability/apps/analyze-data-from-synthetic-monitors.md#synthetics-analyze-one-step).
129
+
130
+
131
+
### Details for one run [synthetics-analyze-one-run]
132
+
133
+
The page detailing one run for a journey includes more information on each step in the current run and opportunities to compare each step to the same step in previous runs.
134
+
135
+
At the top of the page, see the *Code executed* and any *Console* output for each step. If the step failed, this will also include a *Stacktrace* tab that you can use to diagnose the cause of errors.
136
+
137
+
Navigate through each step using **![Previous icon](../../../images/observability-arrowLeft.svg"") Previous** and **Next ![Next icon](../../../images/observability-arrowRight.svg"")**.
:alt: Step carousel on a page detailing one run of a browser monitor in the {synthetics-app}
141
+
:class: screenshot
142
+
:::
143
+
144
+
Scroll down to dig into the steps in this journey run. Click the ![Arrow right icon](../../../images/observability-arrowRight.svg"") icon next to the step number to show details. The details include metrics for the step in the current run and the step in the last successful run. Read more about step-level metrics below in [Timing](../../../solutions/observability/apps/analyze-data-from-synthetic-monitors.md#synthetics-analyze-one-step-timing) and [Metrics](../../../solutions/observability/apps/analyze-data-from-synthetic-monitors.md#synthetics-analyze-one-step-metrics).
145
+
146
+
This is particularly useful to compare the metrics for a failed step to the last time it completed successfully when trying to diagnose the reason it failed.
147
+
148
+
![Step list on a page detailing one run of a browser monitor in the {{synthetics-app}}](../../../images/observability-synthetics-analyze-one-run-compare-steps.png"")
149
+
150
+
Drill down to see even more details for an individual step by clicking the performance breakdown icon (![Performance breakdown icon](../../../images/observability-apmTrace.svg"")) next to one of the steps. This will take you to the view described below in [Details for one step](../../../solutions/observability/apps/analyze-data-from-synthetic-monitors.md#synthetics-analyze-one-step).
151
+
152
+
153
+
### Details for one step [synthetics-analyze-one-step]
154
+
155
+
After clicking the performance breakdown icon (![Performance breakdown icon](../../../images/observability-apmTrace.svg"")) you’ll see more detail for an individual step.
By default the synthetics library will capture a screenshot for each step regardless of whether the step completed or failed.
161
+
162
+
::::{note}
163
+
Customize screenshot behavior for all monitors in the [configuration file](../../../solutions/observability/apps/configure-synthetics-projects.md), for one monitor using [`monitor.use`](../../../solutions/observability/apps/configure-individual-browser-monitors.md), or for a run using the [CLI](../../../solutions/observability/apps/use-synthetics-cli.md#elastic-synthetics-command).
164
+
165
+
::::
166
+
167
+
168
+
Screenshots can be particularly helpful to identify what went wrong when a step fails because of a change to the UI. You can compare the failed step to the last time the step successfully completed.
:alt: Screenshot for one step in a browser monitor in the {synthetics-app}
172
+
:class: screenshot
173
+
:::
174
+
175
+
176
+
#### Timing [synthetics-analyze-one-step-timing]
177
+
178
+
The **Timing** visualization shows a breakdown of the time spent in each part of the resource loading process for the step including:
179
+
180
+
***Blocked**: The request was initiated but is blocked or queued.
181
+
***DNS**: The DNS lookup to convert the hostname to an IP Address.
182
+
***Connect**: The time it took the request to connect to the server. Lengthy connections could indicate network issues, connection errors, or an overloaded server.
183
+
***TLS**: If your page is loading resources securely over TLS, this is the time it took to set up that connection.
184
+
***Wait**: The time it took for the response generated by the server to be received by the browser. A lengthy Waiting (TTFB) time could indicate server-side issues.
185
+
***Receive**: The time it took to receive the response from the server, which can be impacted by the size of the response.
186
+
***Send**: The time spent sending the request data to the server.
187
+
188
+
Next to each network timing metric, there’s an icon that indicates whether the value is higher (![Value is higher icon](../../../images/observability-sortUp.svg"")), lower (![Value is lower icon](../../../images/observability-sortDown.svg"")), or the same (![Value is the same](../../../images/observability-minus.svg"")) compared to the median of all runs in the last 24 hours. Hover over the icon to see more details in a tooltip.
189
+
190
+
This gives you an overview of how much time is spent (and how that time is spent) loading resources. This high-level information may not help you diagnose a problem on its own, but it could act as a signal to look at more granular information in the [Network requests](../../../solutions/observability/apps/analyze-data-from-synthetic-monitors.md#synthetics-analyze-one-step-network) section.
The **Metrics** visualization gives you insight into the performance of the web page visited in the step and what a user would experience when going through the current step. Metrics include:
201
+
202
+
***First contentful paint (FCP)** focuses on the initial rendering and measures the time from when the page starts loading to when any part of the page’s content is displayed on the screen.
203
+
***Largest contentful paint (LCP)** measures loading performance. To provide a good user experience, LCP should occur within 2.5 seconds of when the page first starts loading.
204
+
***Cumulative layout shift (CLS)** measures visual stability. To provide a good user experience, pages should maintain a CLS of less than 0.1.
205
+
***`DOMContentLoaded` event (DCL)** is triggered when the browser completes parsing the document. Helpful when there are multiple listeners, or logic is executed: `domContentLoadedEventEnd - domContentLoadedEventStart`.
206
+
***Transfer size** represents the size of the fetched resource. The size includes the response header fields plus the response payload body.
207
+
208
+
::::{note}
209
+
Largest contentful paint and Cumulative layout shift are part of Google’s [Core Web Vitals](https://web.dev/vitals/), an initiative that introduces a set of metrics that help categorize good and bad sites by quantifying the real-world user experience.
210
+
211
+
::::
212
+
213
+
214
+
Next to each metric, there’s an icon that indicates whether the value is higher (![Value is higher icon](../../../images/observability-sortUp.svg"")), lower (![Value is lower icon](../../../images/observability-sortDown.svg"")), or the same (![Value is the same](../../../images/observability-minus.svg"")) compared to all runs over the last 24 hours. Hover over the icon to see more details in a tooltip.
:alt: Metrics visualization for one step in a browser monitor in the {synthetics-app}
218
+
:class: screenshot
219
+
:::
220
+
221
+
222
+
#### Object weight and count [synthetics-analyze-one-step-object]
223
+
224
+
The **Object weight** visualization shows the cumulative size of downloaded resources by type, and **Object count** shows the number of individual resources by type.
225
+
226
+
This provides a different kind of analysis. For example, you might have a large number of JavaScript files, each of which will need a separate download, but they may be collectively small. This could help you identify an opportunity to improve efficiency by combining multiple files into one.
The **Network requests** visualization is a waterfall chart that shows every request the page made when a user executed it. Each line in the chart represents an HTTP network request and helps you quickly identify what resources are taking the longest to load and in what order they are loading.
237
+
238
+
The colored bars within each line indicate the time spent per resource. Each color represents a different part of that resource’s loading process (as defined in the [Timing](../../../solutions/observability/apps/analyze-data-from-synthetic-monitors.md#synthetics-analyze-one-step-timing) section above) and includes the time spent downloading content for specific Multipurpose Internet Mail Extensions (MIME) types: HTML, JS, CSS, Media, Font, XHR, and Other.
239
+
240
+
Understanding each phase of a request can help you improve your site’s speed by reducing the time spent in each phase.
:alt: Network requests waterfall visualization for one step in a browser monitor in the {synthetics-app}
244
+
:class: screenshot
245
+
:::
246
+
247
+
Without leaving the waterfall chart, you can view data points relating to each resource: resource details, request headers, response headers, and certificate headers. On the waterfall chart, select a resource name, or any part of each row, to display the resource details overlay.
248
+
249
+
For additional analysis, whether to check the content of a CSS file or to view a specific image, click the ![External link icon](../../../images/observability-popout.svg"") icon located beside each resource, to view its content in a new tab.
250
+
251
+
You can also navigate between steps and checks at the top of the page to view the corresponding waterfall charts.
0 commit comments