This is an automated email from the ASF dual-hosted git repository.
qiuxiafan pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/skywalking-client-js.git
The following commit(s) were added to refs/heads/master by this push:
new cfdd9f8 refactor: update perf functions (#81)
cfdd9f8 is described below
commit cfdd9f8ca277fb7c86f2d6216658743cf3f9efdd
Author: Fine0830 <[email protected]>
AuthorDate: Thu Apr 7 12:25:13 2022 +0800
refactor: update perf functions (#81)
---
package.json | 2 +-
src/monitor.ts | 15 +++---------
src/performance/fmp.ts | 60 ++++++++++++++++++++++++++----------------------
src/performance/index.ts | 14 +++++++++++
tsconfig.json | 1 -
5 files changed, 50 insertions(+), 42 deletions(-)
diff --git a/package.json b/package.json
index 3684fd9..41e45b5 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "skywalking-client-js",
- "version": "0.7.0",
+ "version": "0.8.0",
"description": "Client-side JavaScript exception and tracing library for
Apache SkyWalking APM",
"main": "index.js",
"types": "lib/src/index.d.ts",
diff --git a/src/monitor.ts b/src/monitor.ts
index aed46d5..de8f949 100644
--- a/src/monitor.ts
+++ b/src/monitor.ts
@@ -50,27 +50,18 @@ const ClientMonitor = {
performance(configs: any) {
// trace and report perf data and pv to serve when page loaded
if (document.readyState === 'complete') {
- tracePerf.recordPerf(configs);
+ tracePerf.getPerf(configs);
} else {
window.addEventListener(
'load',
() => {
- tracePerf.recordPerf(configs);
- },
- false,
- );
- }
- if (this.customOptions.enableSPA) {
- // hash router
- window.addEventListener(
- 'hashchange',
- () => {
- tracePerf.recordPerf(configs);
+ tracePerf.getPerf(configs);
},
false,
);
}
},
+
catchErrors(options: CustomOptionsType) {
const { service, pagePath, serviceVersion, collector } = options;
diff --git a/src/performance/fmp.ts b/src/performance/fmp.ts
index df0132f..7c610c3 100644
--- a/src/performance/fmp.ts
+++ b/src/performance/fmp.ts
@@ -38,7 +38,7 @@ const IGNORE_TAG_SET: string[] = ['SCRIPT', 'STYLE', 'META',
'HEAD', 'LINK'];
const LIMIT: number = 3000;
const WW: number = window.innerWidth;
const WH: number = window.innerHeight;
-const DELAY: number = 500; // fmp retry interval
+const DELAY: number = 2000; // fmp retry interval
class FMPTiming {
public fmpTime: number = 0;
@@ -86,37 +86,41 @@ class FMPTiming {
this.calculateFinalScore();
}
private calculateFinalScore() {
- if (MutationEvent && this.flag) {
- if (this.checkNeedCancel(START_TIME)) {
- // cancel observer for dom change
- this.observer.disconnect();
- this.flag = false;
- const res = this.getTreeScore(document.body);
- let tp: ICalScore = null;
- for (const item of res.dpss) {
- if (tp && tp.st) {
- if (tp.st < item.st) {
- tp = item;
- }
- } else {
+ if (!this.flag) {
+ return;
+ }
+ if (!MutationObserver) {
+ return;
+ }
+ if (this.checkNeedCancel(START_TIME)) {
+ // cancel observer for dom change
+ this.observer.disconnect();
+ this.flag = false;
+ const res = this.getTreeScore(document.body);
+ let tp: ICalScore = null;
+ for (const item of res.dpss) {
+ if (tp && tp.st) {
+ if (tp.st < item.st) {
tp = item;
}
+ } else {
+ tp = item;
}
- // Get all of soures load time
- performance.getEntries().forEach((item: PerformanceResourceTiming) => {
- this.entries[item.name] = item.responseEnd;
- });
- if (!tp) {
- return false;
- }
- const resultEls: ElementList = this.filterResult(tp.els);
- const fmpTiming: number = this.getFmpTime(resultEls);
- this.fmpTime = fmpTiming;
- } else {
- setTimeout(() => {
- this.calculateFinalScore();
- }, DELAY);
}
+ // Get all of soures load time
+ performance.getEntries().forEach((item: PerformanceResourceTiming) => {
+ this.entries[item.name] = item.responseEnd;
+ });
+ if (!tp) {
+ return false;
+ }
+ const resultEls: ElementList = this.filterResult(tp.els);
+ const fmpTiming: number = this.getFmpTime(resultEls);
+ this.fmpTime = fmpTiming;
+ } else {
+ setTimeout(() => {
+ this.calculateFinalScore();
+ }, DELAY);
}
}
private getFmpTime(resultEls: ElementList): number {
diff --git a/src/performance/index.ts b/src/performance/index.ts
index 6c637e0..e93b997 100644
--- a/src/performance/index.ts
+++ b/src/performance/index.ts
@@ -26,6 +26,20 @@ class TracePerf {
perfDetail: {},
} as { perfDetail: IPerfDetail };
+ public getPerf(options: CustomOptionsType) {
+ this.recordPerf(options);
+ if (options.enableSPA) {
+ // hash router
+ window.addEventListener(
+ 'hashchange',
+ () => {
+ this.recordPerf(options);
+ },
+ false,
+ );
+ }
+ }
+
public async recordPerf(options: CustomOptionsType) {
let fmp: { fmpTime: number | undefined } = { fmpTime: undefined };
if (options.autoTracePerf && options.useFmp) {
diff --git a/tsconfig.json b/tsconfig.json
index a96dbc5..0c4ed17 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -16,7 +16,6 @@
*/
{
"compilerOptions": {
- "declaration": true,
"outDir": "./lib/",
"noImplicitAny": true,
"sourceMap": true,
