--- title: "Performance setup" date: "2021-11-04T11:44:49+00:00" summary: "Learn how to set up and configure the Performance add-on for website optimization with step-by-step instructions and expert tips." image: type: "page" url: "/web-governance/performance-setup" id: "f25f9f35-ff8b-4ad7-bcec-2e63799da1af" --- Table of contents will be added Introduction ------------ This document provides instructions on how to add and configure the Performance add-on in Acquia Web Governance. Contact the [Support Team](mailto:webgovsupport@acquia.com) to activate the Performance add-on. ### Google Lighthouse The Performance add-on does a scan on a single page with Google Lighthouse, which is an open-source API and a powerful tool to help you improve the quality, performance, and accuracy of web pages. You can input a URL and receive a score along with suggestions and instructions on how to make website performance improvements. The Google online service software assesses website Performance, PWA (Progressive Web Apps), Best Practices, Accessibility, and SEO. In the first version, Web Governance has integrated the Performance part of Google Lighthouse. With the Google service, you must enter each URL every time you want to see a score. The Performance add-on improves upon this with the possibility to set up score result sequences, for example, Web Governance can automatically scan the selected page up to 4 times a day. For more information on how Google Lighthouse calculates performance, visit: * [Google WebDev Performance Audits](https://web.dev/lighthouse-performance/) * [Lighthouse performance scoring](https://web.dev/performance-scoring/#weightings) * [Lighthouse scoring calculator](https://googlechrome.github.io/lighthouse/scorecalc/) For a list of the IP addresses used for the Performance add-on, visit [Data hosting and security](/node/58411). Navigation ---------- This section provides information on how to navigate to the Performance add-on. 1. Navigate to the _Domain Overview_ and select your domain. 2. Click **Performance** (the gauge icon) on the domain toolbar. The system displays the _Performance_ dashboard and a list of added pages. If no pages are present or if a page is missing, click **Add New Page**. The instructions for how to add a new page are below. Video walkthrough ----------------- Watch the video walkthrough of the Performance add-on setup. Performance dashboard --------------------- This is the landing page for the Web Governance _Performance_ add-on. The page contains a list of pages with the performance score for each page, and the the following action buttons: * **Add New Page**: Click to enter the dialog to add a page to the scan for performance statistics. * **Search**: Click in the dialog box and type a search parameter to search for a specific page that you have added. * **Quick page overview**: Get a quick overview of the performance score. On the row for each page, the following actions are possible: * **Open Page Details** (the page icon): Provides an itemization of all performance details gathered, as described below. * **Actions**: Click to **Edit** or **Delete** the page. * **Expand** (the arrows icon): Click for more details about the performance score for the page. * **Rescan**: Start a new scan to detect performance issues on the page. * **Left menu**: The menu on the left provides the following navigational options, these options are further explained in the sections below: * **Dashboard**: Select this option to return to the Performance dashboard. * **Opportunities**: Select this option to view areas for improvement that can boost the page load speed of your site and improve its performance. * **Diagnostics**: Select this option to view page diagnostics for information about flagged issues on your page. * **History**: Select this option to view performance measurements over time. ### Open Page Details Click **Open Page Details** (the page icon) on the same row as the page on the dashboard view all performance statistics gathered by the most recent scan. Note If the graph on your results page is interrupted with an orange line, this signifies a jump in statistics due to upgrades or changes to the module. Click the label on the orange line to view the reasons for the discrepancy. #### Performance Score section * **Overall percentage**: The overall percentage is displayed with a numerical value in the center of the graph. Hover over the colored sections for a breakdown of score types included in this graph. * **Timeline**: The timeline provides a visual overview of how the performance score has changed between the most recent 8 scans. * **Opportunities by Priority**: This bar graph further breaks down the performance checks and sorts the findings according to priority: * Checks done * Checks to fix * Low * Medium * High For information about how the priority of issues is determined, visit [Issue priority](/node/58621). #### User Loading Experience section View the loading experience for visitors on each profile. * **Thumbnail images**: Thumbnail images represent the elements on the web page in the order that they load as the web page renders in the browser. * **Loading times key**: Color coding indicates the different speeds at which the pages load. * Short (blue) * Medium (yellow) * Long (red) * **Load Times Trend**: The load time results presented in milliseconds. * First contentful paint (FCP) * Largest contentful paint (LCP) * Speed Index (SI) * Total Blocking Time (TBT) * Cumulative Layout Shift (CLS) The line graph displays the measurements over time. Note If the graph on your results page is interrupted with an orange line, this signifies a jump in statistics due to upgrades or changes to the module. Click the label on the orange line to view the reasons for the discrepancy. ### Expand Click the arrow on the same row as the page on the dashboard view to expand an overview of the details for the page. The system displays the overall score in a ring graph.  * **Overall percentage**: The ring graph displays a numerical value in the center of the graph that reflects the performance score, as measured on the most recent check. Hover over the colored sections for a breakdown of score types included in this graph. * **Load time results** for the page in milliseconds, as measured by the most recent check for the following: * First contentful paint (FCP) * Largest contentful paint (LCP) * Speed Index (SI) * Total Blocking Time (TBT) * Cumulative Layout Shift (CLS) * At the bottom of the expanded view, the following details about the profile used are displayed: * Measurement Settings * Device * Measure from * Network speed * Check frequency ### Opportunities Click **Opportunities** from the menu on the left. View areas for improvement that can boost the page load speed of your site and improve its performance. The suggestions provided are highly targeted with examples that include how to enable text compression and identify render-blocking resources.  The recommendations are presented in an easy-to-understand way with links to documentation from Google resources. This page contains a table with the following column headers: * **Audit**: The name and description of the check with a link to learn more about it * **Difficulty**: The level of difficulty to improve the criteria * **Priority**: The priority level to consider when you plan the work * **Relevant for**: The load time trend specifications * **Details button**: Click to view a table with the following column headers: * **URL**: The URL for the item or page * **Resource Size**: The size of the item or page * **Est Savings**: The estimated savings presented in kilobytes ### Diagnostics Click **Diagnostics** from the menu on the left. View page diagnostics for information about flagged issues on your page. This list provides information about each issue, how it impacts your site, why it needs to be fixed, and a link to instructions on how to fix it. This page contains a table with the following column headers: * **Audit**: The name and description of the check with a link to learn more about it. * **Difficulty**: The level of difficulty to improve the criteria. * **Priority**: The priority level to consider when you plan the work. * **Relevant for**: The load time trends that this issue affects, if any. * **Details**: Click to expand the criteria. The system displays audit details for each page or resource where this criteria can be improved. * **FCP** * Failure reason * Failure type * **LCP** * URL * Est Savings (in milliseconds) * SI: The Speed Index * **TBT** * Third-party * Transfer size * Main-thread blocking time * **CLS** * Image name * Image URL ### History Click **History** from the menu on the left for a view of performance status over time. This page contains the following: * A line graph that displays the measurements over time. * A table with the headers: * **Scanned at**: The date of the most recent scan. * **Performance score**: The overall percentage presented in a ring graph. * **First Contentful Paint** (FCP): The indication of how much time in milliseconds that the performance for this measurement has changed since the last scan. A red (down) arrow indicates a decrease in FCP, a green (up) arrow indicates an increase in FCP. * **Largest contentful paint** (LCP): The indication of how much time in milliseconds that the performance for this measurement has changed since the last scan. A red (down) arrow indicates a decrease in LCP, a green (up) arrow indicates an increase in LCP. * **Speed Index** (SI): The indication on how much time in milliseconds that the performance for this measurement has changed since the last scan. A red (down) arrow indicates a decrease in SI, a green (up) arrow indicates an increase in SI. * **Total Blocking Time** (TBT): The indication of how much time in milliseconds that the performance for this measurement has changed since the last scan. A red (down) arrow indicates a decrease in TBT, a green (up) arrow indicates an increase in TBT. * **Cumulative Layout Shift** (CLS): The indication of how much time in milliseconds that the performance for this measurement has changed since the last scan. A red (down) arrow indicates a decrease in CLS, a green (up) arrow indicates an increase in CLS. Add new performance page ------------------------ 1. Navigate to your domain. 2. Click **Performance** (the gauge icon) on the domain toolbar.  The system displays the _Performance_ dashboard.  3. Click **Add New Page**. The system displays the _New Performance Page_. Note A page can only be added if it has been scanned at least once and exists in the current scan inventory. 4. **Select page to scan**: Click in the search box and begin to type the name of the page. The list of available pages expands. Select the page that you want to add. 5. **Scan frequency**: Select the frequency for the performance check. * Once a day * Once a week 6. **Visitor Profile**: Click in the field and select a visitor profile from the expanded list. Choose as many as needed. For instructions on how to add a new visitor profile, see the corresponding section of this document. The system updates the _Summary_ page with the following details about the selections: * **URL**: The URL to the page. * **Scan Frequency**: The frequency of the Performance scan * **Visitor Profile** (if selected): The specific visitor profile selected 7. Click **Save** on the bottom right. Edit a Performance page ----------------------- This section provides instructions on how to edit a Performance page. 1. Navigate to your domain. 2. Click **Performance** (the gauge icon) on the domain toolbar.  The system displays the _Performance_ dashboard.  3. On the same row as the page you want to edit, click **Actions** and select **Edit**. The system displays the _Edit Performance Page_. 4. Edit the fields as needed. 5. Click **Save** on the bottom right. ### Remove a profile from a page This section provides instructions on how to edit an existing Performance page. 1. Navigate to your domain. 2. Click **Performance** (the gauge icon) on the domain toolbar.  The system displays the _Performance_ dashboard.  3. On the same row as the page you want to edit, click **Actions** and select **Edit**. The system displays the _Edit Performance Page_. 4. In the _Visitor Profile_ field, use the drop-down arrow to expand the options and select an existing visitor profile. 5. In the _Summary_ section, click the kebab menu on the profile that you want to remove and select **Remove Profile**. The system displays a confirmation dialog box. 6. Click **OK** to confirm. 7. Click **Save** on the bottom right. ### Remove a Performance page 1. Navigate to your domain. 2. Click **Performance** (the gauge icon) on the domain toolbar.  The system displays the _Performance_ dashboard.  3. On the same row as the page you want to remove, click **Actions** and select **Delete**.  The system displays a confirmation dialog box. 4. **Type “Delete”** in the dialog box and then click **OK** to confirm. Visitor profiles ---------------- This section provides instructions on how to add, edit, and remove a visitor profile. ### Create a visitor profile This section provides instructions for admin users on how to add a new profile to the list during new page creation. 1. Click **Admin Settings** (the gear icon) on the main toolbar. The system displays the Admin dashboard. 2. Click **Configuration** on the left menu and select **Performance Profiles** from the expanded list. 3. Click **+Add profile**. The system displays the A_dd Performance profile_ dialog box. 4. Fill in the details for the new user profile: * **Name**: Enter a name for the profile. * **Description**: Enter a description for the profile. * **Device**: Select the device from the selection: Desktop or Mobile. * **Connection Profile**: Click the drop-down arrow and select from the list: * Cable * 3G Regular * 4G Slow * DSL * LTE * **Measure from**: Click the drop-down arrow and select a geographical location to measure the connection from. 5. Click **Save**. The system saves the profile and closes the dialog box. ### Add a visitor profile to an existing page This section provides instructions on how to add a new profile to the list from an existing page. 1. Navigate to your domain. 2. Click **Performance** (the gauge icon) on the domain toolbar. The system displays the _Performance_ dashboard.  3. On the same row as the page you want to add the profile to, click **Actions** and select **Edit** from the expanded menu. 4. The system displays the _Edit Performance Page_. 5. In the _Visitor profile_ section, click **Select a profile** to expand the list and then select the profile to add. 6. Click **Save** to apply the visitor profile to the scan for performance issues on the page. ### Edit a visitor profile This section provides instructions on how to edit a profile. 1. Click **Admin Settings** (the gear icon) on the main toolbar. The system displays the _Admin dashboard_. 2. Click **Configuration** on the left menu and select **Performance Profiles** from the expanded list. 3. On the same row as the page you want to edit, click **Actions** and select **Edit** from the expanded menu. The system displays the _Edit Performance profile_ page. 4. Edit as needed. 5. Click **Save**. ### Archive a visitor profile This section provides instructions on how to archive a visitor profile. 1. Click **Admin Settings** (the gear icon) on the main toolbar. The system displays the _Admin dashboard_. 2. Click C**onfiguration** on the left menu and select **Performance Profiles** from the expanded list. 3. On the same row as the profile you want to archive, click **Actions** and select **Archive** from the expanded list. The system displays a dialog box with information about the pages that use the profile. 4. Click **Save**. Additional resources -------------------- For a list of the IP addresses used for the Performance add-on, visit [Data hosting and security](/node/58411). For more information on how performance scores are calculated, visit: * [Google WebDev Performance Audits](https://developer.chrome.com/docs/lighthouse/performance/performance-scoring) * [Lighthouse performance scoring](https://developer.chrome.com/docs/lighthouse/performance/performance-scoring#weightings) * [Lighthouse scoring calculator](https://googlechrome.github.io/lighthouse/scorecalc/) * [Chrome Performance Audits (Metrics)](https://developer.chrome.com/docs/lighthouse/performance/performance-scoring)