hy-virtual-tree 1.1.24 → 1.1.25

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 ## Changelog
 
+### 1.1.25
+
+_2025-09-13_
+
+- 扩展[VirtualTree] 功能
+（1）树节点添加缓存逻辑
+
 ### 1.1.24
 
 _2025-09-13_

package/dist/index.js

@@ -11,6 +11,7 @@ class VirtualScroll {
      * @param {number} [options.maxHeight=26840000] Maximum height in pixels for the content wrapper
      * @param {Function} [options.onRender] 节点刷新回调
      */
+    cacheNodeMap = new Map();
     constructor(options) {
         this.container = options.container;
         this.items = options.items || [];
@@ -115,10 +116,13 @@ class VirtualScroll {
     renderVisibleItems(startIndex, endIndex) {
         this._onRender && this._onRender();
         // Clear content container
-        this.contentContainer.innerHTML = '';
+        // this.contentContainer.innerHTML = ''
         // Set position considering scaling factor
+        // const fragment = document.createDocumentFragment()
+        // const fragment = []
         this.contentContainer.style.transform = `translateY(${startIndex * this.itemHeight * this.heightScale}px)`;
         // Render visible items
+        const nodeMap = new Map();
         for (let i = startIndex; i < endIndex; i++) {
             const item = this.items[i];
             if (this.customRenderItem) {
@@ -129,7 +133,17 @@ class VirtualScroll {
                     itemElement.style.height = `${this.itemHeight * this.heightScale}px`;
                     itemElement.style.boxSizing = 'border-box';
                     itemElement.style.width = '100%';
-                    this.contentContainer.appendChild(itemElement);
+                    const innerHTML = itemElement.innerHTML;
+                    if (this.cacheNodeMap.has(innerHTML)) {
+                        const target = this.cacheNodeMap.get(innerHTML);
+                        this.contentContainer.appendChild(target);
+                        nodeMap.set(innerHTML, target);
+                        this.cacheNodeMap.delete(innerHTML);
+                    }
+                    else {
+                        this.contentContainer.appendChild(itemElement);
+                        nodeMap.set(innerHTML, itemElement);
+                    }
                 }
             }
             else {
@@ -146,6 +160,11 @@ class VirtualScroll {
                 this.contentContainer.appendChild(row);
             }
         }
+        for (const [key, value] of this.cacheNodeMap) {
+            this.contentContainer.removeChild(value);
+        }
+        this.cacheNodeMap.clear();
+        this.cacheNodeMap = nodeMap;
     }
     /**
      * Update data items and re-render
@@ -480,7 +499,7 @@ const useConfig = (config) => {
     config = {
         itemHeight: 30,
         itemGap: 10,
-        bufferSize: 10,
+        bufferSize: 30,
         color: '#fff',
         placeholderColor: '#909399',
         fontSize: 14,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hy-virtual-tree",
-  "version": "1.1.24",
+  "version": "1.1.25",
   "type": "module",
   "scripts": {
     "dev": "vite",