渲染优化

This commit is contained in:
CN-JS-HuiBai
2026-04-07 00:26:00 +08:00
parent c94b697319
commit 09887b52d0
2 changed files with 130 additions and 90 deletions

View File

@@ -18,6 +18,7 @@ class AreaChart {
this.prevMaxVal = 0;
this.currentMaxVal = 0;
this.lastDataHash = ''; // Fingerprint for optimization
// Use debounced resize for performance and safety
this._resize = typeof debounce === 'function' ? debounce(this.resize.bind(this), 100) : this.resize.bind(this);
@@ -40,6 +41,14 @@ class AreaChart {
setData(data) {
if (!data || !data.timestamps) return;
// 1. Data Fingerprinting: Skip redundant updates to save GPU/CPU
const fingerprint = data.timestamps.length + '_' +
(data.rx.length > 0 ? data.rx[data.rx.length - 1] : 0) + '_' +
(data.tx.length > 0 ? data.tx[data.tx.length - 1] : 0);
if (fingerprint === this.lastDataHash) return;
this.lastDataHash = fingerprint;
// Store old data for smooth transition before updating this.data
// Only clone if there is data to clone; otherwise use empty set
if (this.data && this.data.timestamps && this.data.timestamps.length > 0) {
@@ -335,6 +344,7 @@ class MetricChart {
this.prevMaxVal = 0;
this.currentMaxVal = 0;
this.lastDataHash = ''; // Fingerprint for optimization
// Use debounced resize for performance and safety
this._resize = typeof debounce === 'function' ? debounce(this.resize.bind(this), 100) : this.resize.bind(this);
@@ -358,6 +368,15 @@ class MetricChart {
}
setData(data) {
if (!data || !data.timestamps) return;
// 1. Simple fingerprinting to avoid constant re-animation of same data
const lastVal = data.values && data.values.length > 0 ? data.values[data.values.length - 1] : 0;
const fingerprint = data.timestamps.length + '_' + lastVal + '_' + (data.series ? 's' : 'v');
if (fingerprint === this.lastDataHash) return;
this.lastDataHash = fingerprint;
if (this.data && this.data.values && this.data.values.length > 0) {
this.prevData = JSON.parse(JSON.stringify(this.data));
} else {