Measure the Page Loading Experience

This page describes how to enable the following metrics that helps you measure the page loading experience:

速度インデックスの有効化

速度インデックス（SI）は、ページのコンテンツが目に見える形で入力される速さを計算することで、ページのロードパフォーマンスを判断するための指標です。速度インデックスはビューポートのサイズに依存し、ミリ秒単位で表されます。ページのロード時間が短くなると、速度インデックスのスコアが向上します。

Splunk AppDynamics オンプレミスでは、JavaScript エージェントの設定時に速度インデックスを有効にできます。速度インデックスのスコアを分析して、ページのパフォーマンスを向上させることができます。

速度インデックスメトリックを表示するには、JavaScript エージェントの設定時に速度インデックスを有効にし、adrum.js スクリプトを挿入します。

CODE 
<head>
    <script type='text/javascript' charset='UTF-8'>
        (function(config){
            config.enableSpeedIndex = true;
            })(config.xhr || (config.xhr = {}));
        })(window["adrum-config"] || (window["adrum-config"] = {}));
    </script>
    <script src='//cdn.appdynamics.com/adrum/adrum-latest.js' type='text/javascript' charset='UTF-8'></script>
    ...
</head>

Enable Core Web Vitals

Google Core Web Vitals is a set of metrics that measure the real-world user experience for loading performance, interactivity, and visual stability of the page. In Splunk AppDynamics オンプレミス, Core Web Vitals include the following metrics:
Largest Contentful Paint (LCP)
Reports the render time of the largest image or text block on the page.
First input Delay (FID)
Reports the page response time for the user interaction.
Cumulative Layout Shift (CLS)
of the largest burst of layout shift scores for every unexpected layout shift that occurs during the entire lifespan of a page

Google refers to Core Web Vitals as one of the signals to rank the webpages so you may require to maintain a healthy metrics for your website that improves the SEO ranking and drives user traffic. For more information, seeCore Web Vitals.

Note: To enable core web vitals, ensure the ADRUM version is >= 23.10.0

In Splunk AppDynamics オンプレミス, enable Core Web Vitals while configuring the JavaScript Agent so that the agent collects these metrics for the browsers that are compatible with Google's Core Web Vitals library. You can analyze the scores of Core Web Vitals using Query Language. For more information, see Analytics Browser Core Web Vitals Records Data.

To view the Core Web Vitals metrics, enable Core Web Vitals while configuring the JavaScript Agent and inject the adrum.js script.

  1. Go to a browser application.

  2. In the left-hand panel, go to Configuration > Configure the JavaScript Agent.

  3. In Inject the instrumentation script, specify the script with the appropriate details.

    JSON 
    <script charset="UTF-8" type="text/javascript">
window["adrum-start-time"] = new Date().getTime();
(function(config){
config.appKey = "SM-AFF-ACX";
config.adrumExtUrlHttp = "http://cdn.appdynamics.com";
config.adrumExtUrlHttps = "https://cdn.appdynamics.com";
config.beaconUrlHttp = "http://eum-shadow-master-col.saas.appd-test.com";
config.beaconUrlHttps = "https://eum-shadow-master-col.saas.appd-test.com";
config.useHTTPSAlways = true;
config.resTiming = {"bufSize":200,"clearResTimingOnBeaconSend":true};
config.maxUrlLength = 512;
config.enableCoreWebVitals = true;
})(window["adrum-config"] || (window["adrum-config"] = {}));
</script>
<script src="//cdn.appdynamics.com/adrum/adrum-23.10.0.4353.js"></script>

  4. Click Save.

After you enable Core Web Vitals, create a custom dashboard using the metrics created by ADQL. For more information, see Custom Dashboards.