feat: add fps code

packages/web-performance/src/constants/index.ts

@@ -1,7 +1,7 @@
-export const metricsName = {
-  NT: 'navigation-timing',
-  FP: 'first-paint',
-  FCP: 'first-contentful-paint',
-  LCP: 'largest-contentful-paint',
-  DI: 'device-information'
+export enum metricsName {
+  NT = 'navigation-timing',
+  FP = 'first-paint',
+  FCP = 'first-contentful-paint',
+  LCP = 'largest-contentful-paint',
+  DI = 'device-information'
 }

packages/web-performance/src/lib/store.ts

@@ -1,26 +1,27 @@
 import { IMetrics } from '../types'
+import { metricsName } from '../constants'
 
 /*
  * store metrics
  *
  * @class
  * */
 class metricsStore {
-  state: Map<string, IMetrics>
+  state: Map<metricsName, IMetrics>
 
   constructor() {
-    this.state = new Map<string, IMetrics>()
+    this.state = new Map<metricsName, IMetrics>()
   }
 
-  set(key, value: IMetrics) {
+  set(key: metricsName, value: IMetrics) {
     this.state.set(key, value)
   }
 
-  get(key): IMetrics {
+  get(key: metricsName): IMetrics {
     return this.state.get(key)
   }
 
-  has(key) {
+  has(key: metricsName) {
     return this.state.has(key)
   }
 }

packages/web-performance/src/metrics/getDeviceInfo.ts

@@ -7,4 +7,15 @@
  * totalJSHeapSize,the total allocated heap size, in bytes.
  * usedJSHeapSize,the currently active segment of JS heap, in bytes.
  * fps,a frame rate is the speed at which the browser is able to recalculate, layout and paint content to the display.
+ * userAgent
  * */
+import { IDeviceInformation } from '../types'
+import { isPerformanceSupported } from '../utils/isSupported'
+import { metricsName } from '../constants'
+
+const getDeviceInfo = (): IDeviceInformation => {
+  if (!isPerformanceSupported) {
+    console.log('browser do not support performance')
+    return
+  }
+}