[#734][3.0] 데이터가 많을 경우 부하 발생 처리에 대한 피드백 반영

###########
- 노드가 많아지면 발생할 수 있는 부하에 대한 피드백 반영, 쓰로틀링 방법을 도입하여 수정

src/components/tree/Tree.vue

@@ -23,7 +23,7 @@
 </template>
 
 <script>
-import { ref, reactive, watch, onMounted } from 'vue';
+import { ref, reactive, watch, onMounted, onBeforeUnmount } from 'vue';
 import TreeNode from './TreeNode';
 
 export default {
@@ -260,15 +260,21 @@ export default {
     });
 
 
+    let timer;
     watch(() => props.searchWord, (newSearchWord) => {
-      if (newSearchWord) {
-        filterNode(newSearchWord);
-      } else {
-        allNodeInfo.forEach((nodeObj) => {
-          const node = nodeObj.node;
-          node.visible = true;
-        });
+      if (timer) {
+        clearTimeout(timer);
       }
+      timer = setTimeout(() => {
+        if (newSearchWord) {
+          filterNode(newSearchWord);
+        } else {
+          allNodeInfo.forEach((nodeObj) => {
+            const node = nodeObj.node;
+            node.visible = true;
+          });
+        }
+      }, 200);
     });
 
     onMounted(() => {
@@ -281,6 +287,11 @@ export default {
         })));
       }
     });
+    onBeforeUnmount(() => {
+      if (timer) {
+        clearTimeout(timer);
+      }
+    });
 
     return {
       treeNodeData,