perf: add debounce and sample on subjects for performance

Author: Keith-CY

packages/neuron-ui/src/services/subjects.ts

@@ -15,7 +15,9 @@ const FallbackSubject = {
   },
 }
 export const SystemScript = window.remote
-  ? (window.remote.require(`${SUBJECT_PATH}/system-script`).default as NeuronWalletSubject<{ codeHash: string }>)
+  ? (window.remote.require(`${SUBJECT_PATH}/system-script`).DebouncedSystemScriptSubject as NeuronWalletSubject<{
+      codeHash: string
+    }>)
   : FallbackSubject
 
 export const DataUpdate = window.remote
@@ -27,23 +29,23 @@ export const DataUpdate = window.remote
   : FallbackSubject
 
 export const NetworkList = window.remote
-  ? (window.remote.require(`${SUBJECT_PATH}/networks`).NetworkListSubject as NeuronWalletSubject<{
+  ? (window.remote.require(`${SUBJECT_PATH}/networks`).DebouncedNetworkListSubject as NeuronWalletSubject<{
       currentNetworkList: State.Network[]
     }>)
   : FallbackSubject
 
 export const CurrentNetworkID = window.remote
-  ? (window.remote.require(`${SUBJECT_PATH}/networks`).CurrentNetworkIDSubject as NeuronWalletSubject<{
+  ? (window.remote.require(`${SUBJECT_PATH}/networks`).DebouncedCurrentNetworkIDSubject as NeuronWalletSubject<{
       currentNetworkID: string
     }>)
   : FallbackSubject
 
 export const ConnectionStatus = window.remote
-  ? (window.remote.require(`${SUBJECT_PATH}/node`).ConnectionStatusSubject as NeuronWalletSubject<boolean>)
+  ? (window.remote.require(`${SUBJECT_PATH}/node`).DebouncedConnectionStatusSubject as NeuronWalletSubject<boolean>)
   : FallbackSubject
 
 export const SyncedBlockNumber = window.remote
-  ? (window.remote.require(`${SUBJECT_PATH}/node`).SyncedBlockNumberSubject as NeuronWalletSubject<string>)
+  ? (window.remote.require(`${SUBJECT_PATH}/node`).SampledSyncedBlockNumberSubject as NeuronWalletSubject<string>)
   : FallbackSubject
 
 export const Command = window.remote

packages/neuron-wallet/src/models/lock-utils.ts

@@ -1,7 +1,7 @@
 import NodeService from '../services/node'
 import { OutPoint, Script } from '../types/cell-types'
 import env from '../env'
-import systemScriptSubject from './subjects/system-script'
+import { SystemScriptSubject } from './subjects/system-script'
 
 const { core } = NodeService.getInstance()
 
@@ -15,7 +15,7 @@ const subscribed = (target: any, propertyName: string) => {
   Object.defineProperty(target, propertyName, {
     get: () => value,
     set: (info: { codeHash: string }) => {
-      systemScriptSubject.next({ codeHash: info.codeHash })
+      SystemScriptSubject.next({ codeHash: info.codeHash })
       value = info
     },
   })
@@ -67,7 +67,7 @@ export default class LockUtils {
 
   static setSystemScript(info: SystemScript) {
     LockUtils.systemScriptInfo = info
-    systemScriptSubject.next({ codeHash: info.codeHash })
+    SystemScriptSubject.next({ codeHash: info.codeHash })
   }
 
   // use SDK lockScriptToHash

packages/neuron-wallet/src/models/subjects/current-block-subject.ts

@@ -1,5 +1,4 @@
 import { ReplaySubject } from 'rxjs'
-import { sampleTime } from 'rxjs/operators'
 import { SyncedBlockNumberSubject } from './node'
 
 export interface CurrentBlockInfo {
@@ -15,7 +14,7 @@ export class CurrentBlockSubject {
   }
 
   static subscribe() {
-    CurrentBlockSubject.subject.pipe(sampleTime(500)).subscribe(({ blockNumber }) => {
+    CurrentBlockSubject.subject.subscribe(({ blockNumber }) => {
       SyncedBlockNumberSubject.next(blockNumber)
     })
   }

packages/neuron-wallet/src/models/subjects/networks.ts

@@ -1,4 +1,7 @@
 import { BehaviorSubject } from 'rxjs'
+import { debounceTime } from 'rxjs/operators'
+
+const DEBOUNCE_TIME = 50
 
 export const NetworkListSubject = new BehaviorSubject<{
   currentNetworkList: Controller.Network[]
@@ -7,7 +10,12 @@ export const CurrentNetworkIDSubject = new BehaviorSubject<{ currentNetworkID: C
   currentNetworkID: '',
 })
 
+export const DebouncedNetworkListSubject = NetworkListSubject.pipe(debounceTime(DEBOUNCE_TIME))
+export const DebouncedCurrentNetworkIDSubject = CurrentNetworkIDSubject.pipe(debounceTime(DEBOUNCE_TIME))
+
 export default {
   NetworkListSubject,
   CurrentNetworkIDSubject,
+  DebouncedNetworkListSubject,
+  DebouncedCurrentNetworkIDSubject,
 }

packages/neuron-wallet/src/models/subjects/node.ts

@@ -1,6 +1,18 @@
 import { BehaviorSubject } from 'rxjs'
+import { debounceTime, sampleTime } from 'rxjs/operators'
+
+const DEBOUNCE_TIME = 50
+const SAMPLE_TIME = 500
 
 export const ConnectionStatusSubject = new BehaviorSubject<boolean>(false)
 export const SyncedBlockNumberSubject = new BehaviorSubject<string>('0')
 
-export default { ConnectionStatusSubject, SyncedBlockNumberSubject }
+export const DebouncedConnectionStatusSubject = ConnectionStatusSubject.pipe(debounceTime(DEBOUNCE_TIME))
+export const SampledSyncedBlockNumberSubject = SyncedBlockNumberSubject.pipe(sampleTime(SAMPLE_TIME))
+
+export default {
+  ConnectionStatusSubject,
+  SyncedBlockNumberSubject,
+  DebouncedConnectionStatusSubject,
+  SampledSyncedBlockNumberSubject,
+}

packages/neuron-wallet/src/models/subjects/system-script.ts

@@ -1,5 +1,9 @@
 import { BehaviorSubject } from 'rxjs'
+import { debounceTime } from 'rxjs/operators'
 
-const systemScriptSubject = new BehaviorSubject<{ codeHash: string }>({ codeHash: '' })
+const DEBOUNCE_TIME = 50
 
-export default systemScriptSubject
+export const SystemScriptSubject = new BehaviorSubject<{ codeHash: string }>({ codeHash: '' })
+export const DebouncedSystemScriptSubject = SystemScriptSubject.pipe(debounceTime(DEBOUNCE_TIME))
+
+export default { SystemScriptSubject, DebouncedSystemScriptSubject }