chore: sync back

src/List.tsx

@@ -271,6 +271,27 @@ export function RawList<T>(props: ListProps<T>, ref: React.Ref<ListRef>) {
   rangeRef.current.start = start;
   rangeRef.current.end = end;
 
+  React.useLayoutEffect(() => {
+    console.log('>>>> offsetTop', offsetTop);
+    console.log('>>>>', scrollHeight, start, end, heights.getRecord());
+
+    const changedRecord = heights.getRecord();
+    if (changedRecord.size === 1) {
+      const recordKey = Array.from(changedRecord)[0];
+      const startIndexKey = getKey(mergedData[start]);
+      if (startIndexKey === recordKey) {
+        const realStartHeight = heights.get(recordKey);
+        const diffHeight = realStartHeight - itemHeight;
+        syncScrollTop((ori) => {
+          console.log('-->', diffHeight, ori);
+          return ori + diffHeight;
+        });
+      }
+    }
+
+    heights.resetRecord();
+  }, [scrollHeight]);
+
   // ================================= Size =================================
   const [size, setSize] = React.useState({ width: 0, height });
 

src/utils/CacheMap.ts

@@ -8,18 +8,33 @@ class CacheMap {
   // `useMemo` no need to update if `id` not change
   id: number = 0;
 
+  diffKeys = new Set<React.Key>();
+
   constructor() {
     this.maps = Object.create(null);
   }
 
   set(key: React.Key, value: number) {
     this.maps[key as string] = value;
     this.id += 1;
+    this.diffKeys.add(key as string);
   }
 
   get(key: React.Key) {
     return this.maps[key as string];
   }
+
+  /**
+   * CacheMap will record the key changed.
+   * To help to know what's update in the next render.
+   */
+  resetRecord() {
+    this.diffKeys.clear();
+  }
+
+  getRecord() {
+    return this.diffKeys;
+  }
 }
 
 export default CacheMap;