Hi Gong,
Thanks for posting question to the community!
According to your screenshot, it seems that you didn't set up BRUM javascript agent correctly.
I made a Single-SPA microfrontend app demo according to the qiankun/examples and I will share a template containing BRUM with you.
Here is the template of my main app of Single-SPA(index.html).
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>QianKun Example</title>
</head>
<script charset='UTF-8'>
window['adrum-start-time'] = new Date().getTime();
(function(config){
config.appKey = '<your appKey>';
config.adrumExtUrlHttp = '<your adrumExtUrlHttp>';
config.adrumExtUrlHttps = '<your adrumExtUrlHttps>';
config.beaconUrlHttp = '<your beaconUrlHttp>';
config.beaconUrlHttps = '<your beaconUrlHttps>';
config.xd = {enable : false};
config.spa = {"spa2": true};
})(window['adrum-config'] || (window['adrum-config'] = {}));
</script>
<body>
<div class="mainapp">
<header class="mainapp-header">
<h1>QianKun</h1>
</header>
<div class="mainapp-main">
<ul class="mainapp-sidemenu">
<li onclick="push('/react16')">React16</li>
<li onclick="push('/react15')">React15</li>
<li onclick="push('/vue')">Vue</li>
<li onclick="push('/vue3')">Vue3</li>
<li onclick="push('/angular9')">Angular9</li>
<li onclick="push('/purehtml')">Purehtml</li>
</ul>
<main id="subapp-container"></main>
</div>
</div>
<script>
function push(subapp) { history.pushState(null, subapp, subapp) }
</script>
<script src='<your javaccript agent files url>'></script>
</body>
</html>
Here is the monitoring results.
(Attached figure)
If you want to know more about BRUM javascript agent, please refer to the document below.
https://docs.appdynamics.com/appd/22.x/22.4/en/end-user-monitoring/browser-monitoring/browser-real-u...
Hope this answer helps!
Best regards,
Mao
