diff --git a/frontend/src/api/datamanager.js b/frontend/src/api/datamanager.js
index 40f6fc458..107c5b6ed 100644
--- a/frontend/src/api/datamanager.js
+++ b/frontend/src/api/datamanager.js
@@ -20,6 +20,12 @@ export const getGroupDetail = (groupId) => {
   })
 }
 
+export const getGroupChildren = (groupId) => {
+  return axios({
+    url: '/api/group/' + groupId + '?childrenOnly=true'
+  })
+}
+
 export const createGroup = (name, parentId) => {
   return axios({
     url: '/api/group',
diff --git a/frontend/src/components/DocumentTree.vue b/frontend/src/components/DocumentTree.vue
index f2f15ae10..bfdefa32d 100644
--- a/frontend/src/components/DocumentTree.vue
+++ b/frontend/src/components/DocumentTree.vue
@@ -43,13 +43,30 @@ export default {
       searchRefreshDataListTimer: null,
       realSearchStr: '',
       searchByIdResult: '',
-      selectLimit: 200
+      selectLimit: 500,
+      originAsync: false
     }
   },
+  created() {
+    this.originAsync = this.isLoadTreeAsync
+  },
   computed: {
     isSelectableStatus () {
       return this.$store.state.dataManager.isSelectableStatus
     },
+    isLoadTreeAsync: {
+      get () {
+        return this.$store.state.dataManager.isLoadTreeAsync
+      },
+      set (val) {
+        this.$store.dispatch('commitAndupdateConfigByKey', {
+          'command': 'setIsTreeLoadAsync',
+          'isShowMessage': false,
+          val
+        })
+        this.$store.dispatch('loadDataMap')
+      }
+    },
     groupListOpenNode: {
       get () {
         return this.$store.state.dataManager.groupListOpenNode
@@ -72,6 +89,10 @@ export default {
       clearTimeout(this.searchRefreshDataListTimer)
       this.searchRefreshDataListTimer = setTimeout(() => {
         if (newValue !== oldValue) {
+          // When originAsync is true, and searchStr is not empty, close isLoadTreeAsync
+          if (this.originAsync == true) {
+            this.isLoadTreeAsync = newValue === ''
+          }
           this.realSearchStr = this.searchStr
           clearTimeout(this.searchRefreshDataListTimer)
         }
diff --git a/frontend/src/components/DocumentTreeDialogDelete.vue b/frontend/src/components/DocumentTreeDialogDelete.vue
index 79fbbe554..a6b1b0b2e 100644
--- a/frontend/src/components/DocumentTreeDialogDelete.vue
+++ b/frontend/src/components/DocumentTreeDialogDelete.vue
@@ -74,7 +74,6 @@
                     <p class="text-center data-list-dialog-delete-advanced-selection my-1">Delete Leaf only</p>
                   </v-col>
                 </v-row>
-                </v-radio-group>
 
               </v-expansion-panel-content>
             </v-expansion-panel>
diff --git a/frontend/src/components/DocumentTreeNode.vue b/frontend/src/components/DocumentTreeNode.vue
index b938decea..e02cf2b9d 100644
--- a/frontend/src/components/DocumentTreeNode.vue
+++ b/frontend/src/components/DocumentTreeNode.vue
@@ -11,17 +11,19 @@
 
       <span>
         <v-btn v-if="data.type === 'group'" icon class="mr-1 my-0" @click.stop="onToggleStatusChange">
-          <v-icon small :color="toggleColor">
-            {{isNodeOpen ? 'mdi-chevron-down' : 'mdi-chevron-right'}}
+          <v-icon small :color="toggleColor" :class="toggleClass">
+            {{ isLoading ? 'mdi-autorenew': 'mdi-chevron-down' }}
           </v-icon>
         </v-btn>
-        <v-icon v-else-if="data.type === 'json'" small color="accent" size="14px" class="mr-1">mdi-alpha-j-box-outline</v-icon>
-        <v-icon v-else small color="accent" size="14px" class="mr-1">mdi-file</v-icon>
+        <v-icon v-else-if="data.type === 'json'" small :color="iconColor" size="14px" class="mr-1">mdi-alpha-j-box-outline</v-icon>
+        <v-icon v-else-if="data.type === 'config'" small :color="iconColor" size="14px" class="mr-1">mdi-file-cog-outline</v-icon>
+        <v-icon v-else small :color="iconColor" size="14px" class="mr-1">mdi-file</v-icon>
+      </span>
 
+      <span>
         <div class="status-point" v-show="isGroupActivated"/>
-
         <span :class="nameClass">
-          <span v-if="data.parent_id" color="accent" small>{{data.name}}</span>
+          <span v-if="data.parent_id">{{data.name}}</span>
           <v-icon v-else small color="accent">mdi-home</v-icon>
         </span>
         <span v-if="data.label && isLabelDisplay">
@@ -54,115 +56,18 @@
           <v-icon size="12px" color="error">mdi-delete</v-icon>
         </v-btn>
 
-        <v-menu
-          v-model="showMenu"
-          offset-y
-          bottom
-          left
-          allow-overflow
-          offset-overflow
-          absolute
-          :position-x="menuPositionX"
-          :position-y="menuPositionY"
+        <v-btn
+          icon
+          @click="changeMenuStatus"
+          class="mr-1"
+          v-show="data.type !== 'config'"
         >
-          <!-- slot, got origin click event -->
-          <template v-slot:activator="{ on:{click}, attrs }">
-            <v-btn
-              icon
-              @click="changeMenuStatus"
-              v-bind="attrs"
-              class="mr-1"
-            >
-              <v-icon
-                size="12px" 
-                color="primary"
-              >mdi-dots-horizontal</v-icon>
-            </v-btn>
-          </template>
-
-          <v-list dense>
-
-            <v-list-item key="cut" link @click="onTreeNodeCut">
-              <v-list-item-title>Cut</v-list-item-title>
-            </v-list-item>
-
-            <v-list-item key="copy" link @click="onTreeNodeCopy">
-              <v-list-item-title>Copy</v-list-item-title>
-            </v-list-item>
-
-            <v-list-item
-              key="paste"
-              link
-              v-show="data.type==='group'"
-              :disabled="!pasteButtonEnable"
-              @click="onTreeNodePaste"
-            >
-              <v-list-item-title>Paste</v-list-item-title>
-            </v-list-item>
-
-            <v-list-item
-              key="duplicate"
-              link
-              :disabled="!duplicateButtonEnable"
-              @click="onTreeNodeDuplicate"
-            >
-              <v-list-item-title>Duplicate</v-list-item-title>
-            </v-list-item>
-
-            <v-divider v-show="data.type==='group'"/>
-
-            <v-list-item
-              key="addGroup"
-              link
-              v-show="data.type==='group'"
-              @click="onTreeNodeAddGroup"
-            >
-              <v-list-item-title>Add</v-list-item-title>
-            </v-list-item>
-
-            <v-divider v-show="data.type==='group'"/>
-
-            <v-list-item
-              key="import"
-              link
-              v-show="data.type==='group'"
-              style="padding:0px"
-            >
-              <v-list-item-title>
-                <Upload
-                  :on-success="handlerUploadSuccess"
-                  :on-error="handlerUploadError"
-                  action="/api/snapshot/import"
-                  :format="['lb']"
-                  accept=".lb"
-                  :data="{parent_id: data.id}"
-                  :show-upload-list="false"
-                  style="width: 100%;"
-                >
-                  <div style="padding: 7px 16px; width:100%;">
-                    Import
-                  </div>
-                </Upload>
-              </v-list-item-title>
-            </v-list-item>
-
-            <v-list-item
-              key="export"
-              link
-              v-show="data.type==='group'"
-              style="padding:0px;"
-            >
-              <v-list-item-title>
-                <a :href="'/api/snapshot/export/' + data.id"
-                  :download="data.name + '.lb'"
-                  class="dropdown-menu-item-link"
-                  style="color:#000520"
-                >Export</a>
-              </v-list-item-title>
-            </v-list-item>
+          <v-icon
+            size="12px" 
+            color="primary"
+          >mdi-dots-horizontal</v-icon>
+        </v-btn>
 
-          </v-list>
-        </v-menu>
       </span>
 
     </v-row>
@@ -171,15 +76,14 @@
 
 <script>
 
+import { getGroupChildren } from '@/api'
+
 export default {
   props: ['data', 'selected'],
   data () {
     return {
       isMouseOver: false,
-      shownDuplicateDialogCount: 50,
-      showMenu: false,
-      menuPositionX: 0,
-      menuPositionY: 0,
+      isLoading: false,
     }
   },
   computed: {
@@ -190,7 +94,19 @@ export default {
       if (this.isNodeFocused) {
         return ['tree-node-inner-text', 'tree-node-inner-text-selected']
       }
-      return ['tree-node-inner-text']
+      if (this.data.link) {
+        return ['tree-node-inner-text', 'accent--text', 'text--secondary']
+      }
+      return ['tree-node-inner-text', 'accent--text']
+    },
+    toggleClass () {
+      if (this.isLoading) {
+        return 'loading-icon'
+      }
+      if (!this.isNodeOpen) {
+        return 'toggle-icon-status'
+      }
+      return ''
     },
     toggleColor () {
       if (this.isGroupActivated) {
@@ -199,42 +115,38 @@ export default {
       if (this.isNodeFocused) {
         return 'primary'
       }
+      if (!this.isNodeOpen) {
+        return 'accent'
+      }
       if (this.data.children && this.data.children.length) {
         return 'accent'
       }
       return 'content'
     },
+    iconColor () {
+      return this.data.link ? 'text--secondary' : 'accent'
+    },
     isSelectableStatus () {
       return this.$store.state.dataManager.isSelectableStatus
     },
-    
-    pasteButtonEnable () {
-      const pasteTarget = this.$store.state.dataManager.pasteTarget
-      if (pasteTarget === null) {
-        return false
-      } else {
-        // Paste target should not be it self or it's children
-        return !this.containsPasteTarget(pasteTarget, this.data)
-      }
-    },
-    duplicateButtonEnable () {
-      return this.data.parent_id
-    },
     isGroupActivated () {
       return this.$store.state.inspector.activatedGroup.hasOwnProperty(this.data.id)
     },
     isNodeFocused () {
       return this.$store.state.dataManager.focusNodeInfo && this.data.id === this.$store.state.dataManager.focusNodeInfo.id
     },
-    duplicateNodeChildrenCount () {
-      return this.countNodeChildren(this.data)
-    },
     isNodeDeletable () {
       return this.$store.state.dataManager.treeUndeletableId.indexOf(this.data.id) === -1
     },
     isNodeOpen () {
       return this.$store.state.dataManager.groupListOpenNode.indexOf(this.data.id) > -1
     },
+    isDisplayConfiguration () {
+      return this.$store.state.dataManager.isDisplayConfiguration
+    },
+    isLoadTreeAsync () {
+      return this.$store.state.dataManager.isLoadTreeAsync
+    },
     isLabelDisplay () {
       return this.$store.state.dataManager.isLabelDisplay
     }
@@ -254,16 +166,6 @@ export default {
     }
   },
   methods: {
-    containsPasteTarget (target, node) {
-      if (node.id === target.id) {
-        return true
-      }
-      if (node.parent) {
-        return this.containsPasteTarget(target, node.parent)
-      } else {
-        return false
-      }
-    },
     changeDeleteDialogStatus () {
       this.$store.commit('setDeleteNode', [this.data])
       this.$store.commit('setDeleteDialogSource', 'single')
@@ -271,17 +173,32 @@ export default {
     },
     changeMenuStatus (e) {
       e.preventDefault()
-      this.showMenu = false
-      this.menuPositionX = e.clientX
-      this.menuPositionY = e.clientY
-      this.showMenu = true
+      this.$store.commit('setIsShownNodeMenu', true)
+      this.$store.commit('setShownNodeMenuPosition', {'x': e.clientX, 'y': e.clientY})
     },
     onToggleStatusChange () {
       if (this.isNodeOpen) {
         this.$store.commit('deleteGroupListOpenNode', this.data.id)
-      } else {
+        return
+      } 
+      if (!this.isLoadTreeAsync) {
         this.$store.commit('addGroupListOpenNode', this.data.id)
+        return
       }
+      if (this.isLoading) {
+        return
+      }
+
+      this.isLoading = true
+      getGroupChildren(this.data.id)
+        .then(response => {
+          this.data.children = response.data.data
+          this.isLoading = false
+          this.$store.commit('addGroupListOpenNode', this.data.id)
+        })
+        .catch(error => {
+          this.$bus.$emit('msg.error', 'Load group ' + this.data.name + ' children error: ' + error.data.message)
+        })
     },
     onTreeNodeClick () {
       this.$store.commit('setFocusNodeInfo', this.data)
@@ -291,53 +208,15 @@ export default {
         this.$store.dispatch('loadDataDetail', this.data)
       } else if (this.data.type === 'json') {
         this.$store.dispatch('loadDataDetail', this.data)
+      } else if (this.data.type === 'config') {
+        this.$store.dispatch('loadDataDetail', this.data)
       } else { }
     },
-    onTreeNodeCut () {
-      this.$store.dispatch('cutGroupOrData', this.data)
-    },
-    onTreeNodeCopy () {
-      this.$store.dispatch('copyGroupOrData', this.data)
-    },
-    onTreeNodePaste () {
-      this.$store.dispatch('pasteGroupOrData', this.data)
-    },
-    onTreeNodeDuplicate () {
-      if (this.duplicateNodeChildrenCount >= this.shownDuplicateDialogCount) {
-        this.$store.commit('setIsShownDuplicateDialog', true)
-        return
-      }
-      this.$store.dispatch('duplicateGroupOrData', this.data)
-    },
-    onTreeNodeAddGroup () {
-      this.$store.commit('setIsShownCreateDialog', true)
-    },
     onTreeNodeActivate () {
       this.$store.dispatch('activateGroup', this.data)
     },
     onTreeNodeDeactivate () {
       this.$store.dispatch('deactivateGroup')
-    },
-    handlerUploadSuccess (res, file) {
-      if (res.code === 1000) {
-        this.$bus.$emit('msg.success', 'Import snapshot ' + file.name + ' success!')
-        this.$store.dispatch('loadDataMap')
-      } else {
-        this.$bus.$emit('msg.error', 'Import snapshot ' + file.name + ' error: ' + res.message)
-      }
-    },
-    handlerUploadError (error, file) {
-      this.$bus.$emit('msg.error', 'Import snapshot ' + file.name + ' error: ' + error)
-    },
-    countNodeChildren (node) {
-      let count = 0
-      if (!node.children || node.children.length===0) {
-        return 0
-      }
-      for (const child of node.children) {
-        count += this.countNodeChildren(child)
-      }
-      return count + node.children.length
     }
   }
 }
@@ -398,6 +277,27 @@ export default {
 .ivu-upload > .ivu-upload-select {
   width: 100%;
 }
+.toggle-icon-status {
+  transform:rotate(-90deg);
+  /* animation-name: loading-icon-rotate;
+  animation-duration: 800ms;
+  animation-timing-function: linear;
+  animation-iteration-count: infinite; */
+}
+.loading-icon {
+  animation-name: loading-icon-rotate;
+  animation-duration: 800ms;
+  animation-timing-function: linear;
+  animation-iteration-count: infinite;
+}
+@keyframes loading-icon-rotate {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
 .status-point {
   display: inline-block;
   width: 10px;
diff --git a/frontend/src/components/DocumentTreeNodeMenu.vue b/frontend/src/components/DocumentTreeNodeMenu.vue
new file mode 100644
index 000000000..422c73735
--- /dev/null
+++ b/frontend/src/components/DocumentTreeNodeMenu.vue
@@ -0,0 +1,209 @@
+<template>
+  <v-menu
+    v-model="isShownNodeMenu"
+    offset-y
+    bottom
+    left
+    allow-overflow
+    offset-overflow
+    absolute
+    :position-x="menuPositionX"
+    :position-y="menuPositionY"
+  >
+    <v-list dense>
+
+      <v-list-item key="cut" link @click="onTreeNodeCut">
+        <v-list-item-title>Cut</v-list-item-title>
+      </v-list-item>
+
+      <v-list-item key="copy" link @click="onTreeNodeCopy">
+        <v-list-item-title>Copy</v-list-item-title>
+      </v-list-item>
+
+      <v-list-item
+        key="paste"
+        link
+        v-show="data.type==='group'"
+        :disabled="!pasteButtonEnable"
+        @click="onTreeNodePaste"
+      >
+        <v-list-item-title>Paste</v-list-item-title>
+      </v-list-item>
+
+      <v-list-item
+        key="duplicate"
+        link
+        :disabled="!duplicateButtonEnable"
+        @click="onTreeNodeDuplicate"
+      >
+        <v-list-item-title>Duplicate</v-list-item-title>
+      </v-list-item>
+
+      <v-divider v-show="data.type==='group'"/>
+
+      <v-list-item
+        key="addGroup"
+        link
+        v-show="data.type==='group'"
+        @click="onTreeNodeAddGroup"
+      >
+        <v-list-item-title>Add</v-list-item-title>
+      </v-list-item>
+
+      <v-divider v-show="data.type==='group'"/>
+
+      <v-list-item
+        key="import"
+        link
+        v-show="data.type==='group'"
+        style="padding:0px"
+      >
+        <v-list-item-title>
+          <Upload
+            :on-success="handlerUploadSuccess"
+            :on-error="handlerUploadError"
+            action="/api/snapshot/import"
+            :format="['lb']"
+            accept=".lb"
+            :data="{parent_id: data.id}"
+            :show-upload-list="false"
+            style="width: 100%;"
+          >
+            <div style="padding: 7px 16px; width:100%;">
+              Import
+            </div>
+          </Upload>
+        </v-list-item-title>
+      </v-list-item>
+
+      <v-list-item
+        key="export"
+        link
+        v-show="data.type==='group'"
+        style="padding:0px;"
+      >
+        <v-list-item-title>
+          <a :href="'/api/snapshot/export/' + data.id"
+            :download="data.name + '.lb'"
+            class="dropdown-menu-item-link"
+            style="color:#000520"
+          >Export</a>
+        </v-list-item-title>
+      </v-list-item>
+
+    </v-list>
+  </v-menu>
+</template>
+
+<script>
+
+export default {
+  computed: {
+    data () {
+      return this.$store.state.dataManager.focusNodeInfo
+    },
+    isShownNodeMenu: {
+      get () {
+        return this.$store.state.dataManager.isShownNodeMenu
+      },
+      set (val) {
+        this.$store.commit('setIsShownNodeMenu', val)
+      }
+    },
+    menuPositionX () {
+      if (this.$store.state.dataManager.shownNodeMenuPosition) {
+        return this.$store.state.dataManager.shownNodeMenuPosition.x
+      }
+    },
+    menuPositionY () {
+      if (this.$store.state.dataManager.shownNodeMenuPosition) {
+        return this.$store.state.dataManager.shownNodeMenuPosition.y
+      }
+    },
+    isSelectableStatus () {
+      return this.$store.state.dataManager.isSelectableStatus
+    },
+    pasteButtonEnable () {
+      const pasteTarget = this.$store.state.dataManager.pasteTarget
+      if (pasteTarget === null) {
+        return false
+      } else {
+        // Paste target should not be it self or it's children
+        return !this.containsPasteTarget(pasteTarget, this.data)
+      }
+    },
+    duplicateButtonEnable () {
+      return this.data.parent_id
+    },
+    shownNodeMenuPosition () {
+      return this.$store.state.dataManager.shownNodeMenuPosition
+    }
+  },
+  watch: {
+  },
+  methods: {
+    containsPasteTarget (target, node) {
+      if (node.id === target.id) {
+        return true
+      }
+      if (node.parent) {
+        return this.containsPasteTarget(target, node.parent)
+      } else {
+        return false
+      }
+    },
+    onTreeNodeCut () {
+      this.$store.dispatch('cutGroupOrData', this.data)
+    },
+    onTreeNodeCopy () {
+      this.$store.dispatch('copyGroupOrData', this.data)
+    },
+    onTreeNodePaste () {
+      this.$store.dispatch('pasteGroupOrData', this.data)
+    },
+    onTreeNodeDuplicate () {
+      if (this.duplicateNodeChildrenCount >= this.shownDuplicateDialogCount) {
+        this.$store.commit('setIsShownDuplicateDialog', true)
+        return
+      }
+      this.$store.dispatch('duplicateGroupOrData', this.data)
+    },
+    onTreeNodeAddGroup () {
+      this.$store.commit('setIsShownCreateDialog', true)
+    },
+    handlerUploadSuccess (res, file) {
+      if (res.code === 1000) {
+        this.$bus.$emit('msg.success', 'Import snapshot ' + file.name + ' success!')
+        this.$store.dispatch('loadDataMap')
+      } else {
+        this.$bus.$emit('msg.error', 'Import snapshot ' + file.name + ' error: ' + res.message)
+      }
+    },
+    handlerUploadError (error, file) {
+      this.$bus.$emit('msg.error', 'Import snapshot ' + file.name + ' error: ' + error)
+    },
+  }
+}
+</script>
+
+<style>
+.data-list-tree-node .v-btn--icon.v-size--default {
+  height: 20px;
+  width: 20px;
+}
+.dropdown-menu-item-link {
+  position: relative;
+  color: #515a6e;
+  display: block;
+  padding: 7px 16px;
+}
+.ivu-upload > .ivu-upload-select {
+  width: 100%;
+}
+</style>
+
+<style lang='scss' scoped>
+  .v-application ol, .v-application ul {
+    padding-left: 0px;
+  }
+</style>
diff --git a/frontend/src/store/datamanager.js b/frontend/src/store/datamanager.js
index fcdc769f9..99ea4309b 100644
--- a/frontend/src/store/datamanager.js
+++ b/frontend/src/store/datamanager.js
@@ -20,6 +20,8 @@ export default {
     isShownCreateDialog: false,
     isShownDuplicateDialog: false,
     isShownDeleteDialog: false,
+    isShownNodeMenu: false,
+    shownNodeMenuPosition: null,
     importSnapshotParentNode: {},
     snapshotName: '',
     labels: [],
@@ -31,9 +33,10 @@ export default {
     deleteNode: [],
     dataListSelectedLabel: [],
     isLabelDisplay: true,
-    isCloseReloadWhenEnter: false,
+    isDisplayConfiguration: false,
+    isLoadTreeAsync: false,
     isReloadTreeWhenUpdate: false,
-    undisplayedKey: ['children', 'type', 'parent_id', 'abs_parent_path', 'parent'],
+    undisplayedKey: ['children', 'type', 'parent_id', 'abs_parent_path', 'parent', 'link'],
     undeletableKey: ['id', 'rule', 'name', 'label', 'category', 'super_by'],
     uneditableKey: ['id', 'rule', 'super_by'],
     stickyTopKey: ['id', 'rule', 'super_id', 'name', 'label', 'super_by'],
@@ -133,6 +136,12 @@ export default {
     setIsShownDeleteDialog (state, isShownDeleteDialog) {
       state.isShownDeleteDialog = isShownDeleteDialog
     },
+    setIsShownNodeMenu (state, isShownNodeMenu) {
+      state.isShownNodeMenu = isShownNodeMenu
+    },
+    setShownNodeMenuPosition (state, shownNodeMenuPosition) {
+      state.shownNodeMenuPosition = shownNodeMenuPosition
+    },
     setDeleteDialogSource (state, deleteDialogSource) {
       state.deleteDialogSource = deleteDialogSource
     },
@@ -145,8 +154,11 @@ export default {
     setIsLabelDisplay (state, isLabelDisplay) {
       state.isLabelDisplay = isLabelDisplay
     },
-    setIsCloseReloadWhenEnter (state, isCloseReloadWhenEnter) {
-      state.isCloseReloadWhenEnter = isCloseReloadWhenEnter
+    setIsDisplayConfiguration (state, isDisplayConfiguration) {
+      state.isDisplayConfiguration = isDisplayConfiguration
+    },
+    setIsTreeLoadAsync (state, isLoadTreeAsync) {
+      state.isLoadTreeAsync = isLoadTreeAsync
     },
     setUndisplayedKey (state, undisplayedKey) {
       state.undisplayedKey = undisplayedKey
@@ -184,17 +196,44 @@ export default {
       return new Promise((resolve, reject) => {
         setTimeout(() => {
           commit('setIsLoading', true)
-          api.getGroupMap({labels: state.dataListSelectedLabel})
-            .then(response => {
-              commit('addGroupListOpenNode', response.data.data.id)
-              commit('setGroupList', [response.data.data])
-              commit('concatTreeUndeletableId', response.data.data.id)
-              commit('setIsLoading', false)
-            })
-            .catch(error => {
-              commit('setIsLoading', false)
-              bus.$emit('msg.error', 'Load data failed: ' + error.data.message)
-            })
+          commit('setGroupListOpenNode', [])
+          if (state.isLoadTreeAsync) {
+            api.getGroupMap({labels: state.dataListSelectedLabel})
+              .then(response => {
+                commit('setGroupList', [response.data.data])
+                commit('concatTreeUndeletableId', response.data.data.id)
+
+                api.getGroupChildren(response.data.data.id)
+                  .then(r => {
+                    state.groupList[0].children = []
+                    state.groupList[0].children.push(...r.data.data)
+                    commit('addGroupListOpenNode', response.data.data.id)
+                    commit('setIsLoading', false)
+                  })
+                  .catch(error => {
+                    bus.$emit('msg.error', 'Load group ' + state.groupList[0].name + ' children error: ' + error)
+                    commit('setIsLoading', false)
+                  })
+
+                commit('setIsLoading', false)
+              })
+              .catch(error => {
+                commit('setIsLoading', false)
+                bus.$emit('msg.error', 'Load data failed: ' + error.data.message)
+              })
+          } else {
+            api.getGroupMap({labels: state.dataListSelectedLabel})
+              .then(response => {
+                commit('addGroupListOpenNode', response.data.data.id)
+                commit('setGroupList', [response.data.data])
+                commit('concatTreeUndeletableId', response.data.data.id)
+                commit('setIsLoading', false)
+              })
+              .catch(error => {
+                commit('setIsLoading', false)
+                bus.$emit('msg.error', 'Load data failed: ' + error.data.message)
+              })
+          }
           resolve()
         }, 1)
       })
diff --git a/frontend/src/store/inspector.js b/frontend/src/store/inspector.js
index b514dd630..e8a08a33e 100644
--- a/frontend/src/store/inspector.js
+++ b/frontend/src/store/inspector.js
@@ -162,9 +162,10 @@ export default {
         })
       bus.$emit('msg.success', 'Clear Inspector success!')
     },
-    saveSelectedFlow ({ state }) {
+    saveSelectedFlow ({ state, dispatch }) {
       api.saveSelectedFlow(state.selectedIds)
         .then(response => {
+          dispatch('loadDataMap')
           bus.$emit('msg.success', state.selectedIds.length + ' flow saved!')
         })
         .catch(error => {
diff --git a/frontend/src/store/settings.js b/frontend/src/store/settings.js
index e2b42f3e4..8417e38e2 100644
--- a/frontend/src/store/settings.js
+++ b/frontend/src/store/settings.js
@@ -4,7 +4,8 @@ import { bus } from '@/eventbus'
 var configCommitMap = [
   {'name': 'mock.mode', 'commit': 'setDiffMode'},
   {'name': 'mock.data.showLabel', 'commit': 'setIsLabelDisplay'},
-  {'name': 'mock.data.tree.closeReload', 'commit': 'setIsCloseReloadWhenEnter'},
+  {'name': 'mock.data.tree.asynchronous', 'commit': 'setIsTreeLoadAsync'},
+  {'name': 'mock.data.shownConfig', 'commit': 'setIsDisplayConfiguration'},
   {'name': 'mock.request.keep_origin_data', 'commit': 'setIsRequestKeepOriginData'},
   {'name': 'mock.data.tree.undeletableId', 'commit': 'concatTreeUndeletableId'},
   {'name': 'mock.data.detail.stickyTopKey', 'commit': 'concatStickyTopKey'},
@@ -56,10 +57,10 @@ export default {
             for (const config of configPreLoad) {
               if (response.data.hasOwnProperty(config.name) && response.data[config.name]) {
                 commit('addPreLoadFuncSet', config.commit, { root: true })
-                commit('setInitialized', true)
                 dispatch(config.commit, { root: true })
               }
             }
+            commit('setInitialized', true)
           }
         })
         .catch(error => {
@@ -76,7 +77,7 @@ export default {
           bus.$emit('msg.error', `Update config failed ${error.data.message}`)
         })
     },
-    commitAndupdateConfigByKey({ dispatch, commit }, { command, val }) {
+    commitAndupdateConfigByKey({ dispatch, commit }, { command, isShowMessage, val }) {
       let updateConfig = {}
       for (const config of configCommitMap) {
         if (config.commit == command) {
@@ -88,7 +89,9 @@ export default {
       api.updateConfigByKey(updateConfig)
         .then(_ => {
           dispatch('loadConfig')
-          bus.$emit('msg.success', `Update config success!`)
+          if (isShowMessage) {
+            bus.$emit('msg.success', `Update config success!`)
+          }
         })
         .catch(error => {
           bus.$emit('msg.error', `Update config failed ${error.data.message}`)
diff --git a/frontend/src/views/Main.vue b/frontend/src/views/Main.vue
index e4e12ebe4..a10f329d4 100644
--- a/frontend/src/views/Main.vue
+++ b/frontend/src/views/Main.vue
@@ -78,6 +78,7 @@ export default {
   beforeDestroy() {
     document.removeEventListener('keydown', this._keydownListener)
     this.$io.removeListener('statusBarUpdate', this.loadAllStatusList)
+    this.$io.removeListener('datamanagerUpdate', this.loadDataMap)
     this.$io.removeListener('msgSuccess', this.successMessage)
     this.$io.removeListener('msgInfo', this.infoMessage)
     this.$io.removeListener('msgError', this.errorMessage)
@@ -94,6 +95,7 @@ export default {
     this.$bus.$on('msg.error', this.errorMessage)
     this.$bus.$on('msg.destroy', this.destroyMessage)
     this.$io.on('statusBarUpdate', this.loadAllStatusList)
+    this.$io.on('datamanagerUpdate', this.loadDataMap)
     this.$io.on('msgSuccess', this.successMessage)
     this.$io.on('msgInfo', this.infoMessage)
     this.$io.on('msgError', this.errorMessage)
@@ -159,6 +161,9 @@ export default {
     loadAllStatusList() {
       this.$store.dispatch('loadAllStatusList')
     },
+    loadDataMap() {
+      this.$store.dispatch('loadDataMap')
+    },
     successMessage(msg) {
       this.$Message.success({
         content: msg,
diff --git a/frontend/src/views/datamanager/DataDetail.vue b/frontend/src/views/datamanager/DataDetail.vue
index af73db5fb..6807b1a32 100644
--- a/frontend/src/views/datamanager/DataDetail.vue
+++ b/frontend/src/views/datamanager/DataDetail.vue
@@ -22,12 +22,14 @@
 <script>
 import DataDetailHttpData from '@/views/datamanager/DataDetailHttpData.vue'
 import DataDetailPlainJSON from '@/views/datamanager/DataDetailPlainJSON.vue'
+import DataDetailPlainConfig from '@/views/datamanager/DataDetailPlainConfig.vue'
 import DataDetailFolder from '@/views/datamanager/DataDetailFolder.vue'
 import JsonPathBar from '@/views/datamanager/JsonPathBar.vue'
 import { getGroupDetail } from '@/api'
 
 export default {
   components: {
+    DataDetailPlainConfig,
     DataDetailPlainJSON,
     DataDetailHttpData,
     DataDetailFolder,
@@ -50,6 +52,8 @@ export default {
         return 'DataDetailHttpData'
       } else if (payload.type === 'json') {
         return 'DataDetailPlainJSON'
+      } else if (payload.type === 'config') {
+        return 'DataDetailPlainConfig'
       } else if (payload.type === 'group') {
         return 'DataDetailFolder'
       } else {
diff --git a/frontend/src/views/datamanager/DataDetailPlainConfig.vue b/frontend/src/views/datamanager/DataDetailPlainConfig.vue
new file mode 100644
index 000000000..1411f707b
--- /dev/null
+++ b/frontend/src/views/datamanager/DataDetailPlainConfig.vue
@@ -0,0 +1,145 @@
+<template>
+  <div class="small-tab">
+    <tabs v-model="currentTab" :animated="false" size="small">
+      <tab-pane label="Information" name="info" />
+      <tab-pane label="Settings" name="json" />
+    </tabs>
+    <div>
+      <CodeEditor
+        class="data-detail"
+        :language="currentTabContentType"
+        v-model="editorContent"
+        v-on:on-jsonpath-change="onJsonPathChange"
+      ></CodeEditor>
+    </div>
+    <div class="save-btn" v-if="dataDetail">
+      <v-tooltip top>
+        <template v-slot:activator="{ on, attrs }">
+          <v-btn
+            v-bind="attrs"
+            v-on="on"
+            fab
+            dark
+            color="primary"
+            class="save-btn-detail"
+            @click="save"
+          >
+            <v-icon 
+            class="save-btn-icon"
+            dark>
+              mdi-content-save-outline
+            </v-icon>
+          </v-btn>
+        </template>
+        <span>Save (⌘+s)</span>
+      </v-tooltip>
+    </div>
+  </div>
+</template>
+
+<script>
+import DataDetailInfo from '@/views/datamanager/DataDetailInfo.vue'
+import CodeEditor from '@/components/CodeEditor.vue'
+import Icon from 'vue-svg-icon/Icon.vue'
+
+export default {
+  components: {
+    DataDetailInfo,
+    CodeEditor,
+    'svg-icon': Icon
+  },
+  data () {
+    return {
+      editorCache: {
+        info: null,
+        json: null
+      }
+    }
+  },
+  mounted () {
+    this.$bus.$on('keydown', this.onKeyDown)
+    this.setDataDetailEditorCache(this.dataDetail)
+  },
+  beforeDestroy () {
+    this.$bus.$off('keydown', this.onKeyDown)
+  },
+  activated () {
+    this.$bus.$on('keydown', this.onKeyDown)
+  },
+  deactivated () {
+    this.$bus.$off('keydown', this.onKeyDown)
+  },
+  computed: {
+    currentTab: {
+      get () {
+        const dataDetailFocuedTab = this.$store.state.dataManager.dataDetailFocuedTab
+        if (this.editorCache.hasOwnProperty(dataDetailFocuedTab)) {
+          return dataDetailFocuedTab
+        }
+        return 'info'
+      },
+      set (val) {
+        this.$store.commit('setDataDetailFocuedTab', val)
+      }
+    },
+    currentTabContentType () {
+      return 'json'
+    },
+    dataDetail () {
+      return this.$store.state.dataManager.dataDetail
+    },
+    editorContent: {
+      get () {
+        const content = this.editorCache[this.currentTab]
+        if (!content) {
+          return ''
+        }
+        return content
+      },
+      set (val) {
+        this.editorCache[this.currentTab] = val
+      }
+    }
+  },
+  watch: {
+    dataDetail (val) {
+      this.setDataDetailEditorCache(val)
+    }
+  },
+  methods: {
+    save () {
+      const newData = {}
+      Object.assign(newData, JSON.parse(this.editorCache.info))
+      newData['json'] = this.editorCache.json
+      this.$store.commit('setIsReloadTreeWhenUpdate', false)
+      this.$store.dispatch('saveDataDetail', newData)
+    },
+    onJsonPathChange (payload) {
+      this.$store.commit('setJsonPath', payload.jsonPath)
+    },
+    onKeyDown (event) {
+      if (event.code !== "KeyS" || !event.metaKey) {
+        return
+      }
+      this.save()
+      event.preventDefault()
+    },
+    setDataDetailEditorCache (val) {
+      if (val === null || Object.keys(val).length === 0) {
+        return
+      }
+      this.editorCache.info = JSON.stringify({
+        id: val.id,
+        name: val.name
+      })
+      this.editorCache.json = typeof (val.json) == 'object' ? JSON.stringify(val.json) : val.json
+    }
+  }
+}
+</script>
+
+<style scoped>
+.small-tab > .ivu-tabs > .ivu-tabs-bar {
+  margin-bottom: 0;
+}
+</style>
diff --git a/frontend/src/views/datamanager/DataList.vue b/frontend/src/views/datamanager/DataList.vue
index 72fd62c85..22133d2c5 100644
--- a/frontend/src/views/datamanager/DataList.vue
+++ b/frontend/src/views/datamanager/DataList.vue
@@ -78,6 +78,17 @@
           </template>
 
           <v-list dense>
+            <v-list-item>
+              <v-list-item-action>
+                <v-switch v-model="isLoadTreeAsync"/>
+              </v-list-item-action>
+
+              <v-list-item-content>
+                <v-list-item-title>Load asyn</v-list-item-title>
+                <v-list-item-subtitle>Load data asynchronous</v-list-item-subtitle>
+              </v-list-item-content>
+            </v-list-item>
+
             <v-list-item>
               <v-list-item-action>
                 <v-switch v-model="isPreloadDataMap"/>
@@ -91,25 +102,26 @@
 
             <v-list-item>
               <v-list-item-action>
-                <v-switch v-model="isReloadWhenEnter"/>
+                <v-switch v-model="isLabelDisplay"/>
               </v-list-item-action>
 
               <v-list-item-content>
-                <v-list-item-title>Reload</v-list-item-title>
-                <v-list-item-subtitle>Reload when entering DataManager</v-list-item-subtitle>
+                <v-list-item-title>Labels</v-list-item-title>
+                <v-list-item-subtitle>Display labels in each tree node</v-list-item-subtitle>
               </v-list-item-content>
             </v-list-item>
 
             <v-list-item>
               <v-list-item-action>
-                <v-switch v-model="isLabelDisplay"/>
+                <v-switch v-model="isDisplayConfiguration"/>
               </v-list-item-action>
 
               <v-list-item-content>
-                <v-list-item-title>Labels</v-list-item-title>
-                <v-list-item-subtitle>Display labels in each tree nodes</v-list-item-subtitle>
+                <v-list-item-title>Configuration</v-list-item-title>
+                <v-list-item-subtitle>Display configuration file in each group</v-list-item-subtitle>
               </v-list-item-content>
             </v-list-item>
+
           </v-list>
 
         </v-menu>
@@ -134,6 +146,7 @@
       </v-overlay>
       <DocumentTree :treeData="treeData" class="overflow-auto data-list" :searchStr="searchStr"/>
     </Row>
+    <NodeMenu/>
     <DeleteDialog/>
     <CreateDialog/>
     <DuplicateDialog/>
@@ -143,6 +156,7 @@
 <script>
 import LabelDropdown from '@/components/LabelDropdown.vue'
 import DocumentTree from '@/components/DocumentTree.vue'
+import NodeMenu from '@/components/DocumentTreeNodeMenu.vue'
 import DeleteDialog from '@/components/DocumentTreeDialogDelete.vue'
 import CreateDialog from '@/components/DocumentTreeDialogCreate.vue'
 import DuplicateDialog from '@/components/DocumentTreeDialogDuplicate.vue'
@@ -152,6 +166,7 @@ export default {
   components: {
     LabelDropdown,
     DocumentTree,
+    NodeMenu,
     CreateDialog,
     DuplicateDialog,
     DeleteDialog,
@@ -185,16 +200,28 @@ export default {
         })
       }
     },
-    isReloadWhenEnter: {
+    isDisplayConfiguration: {
+      get () {
+        return this.$store.state.dataManager.isDisplayConfiguration
+      },
+      set (val) {
+        this.$store.commit('setIsDisplayConfiguration', val)
+        this.$store.dispatch('updateConfigByKey', {
+          'mock.data.shownConfig': val
+        })
+        this.$store.dispatch('loadDataMap')
+      }
+    },
+    isLoadTreeAsync: {
       get () {
-        return !this.$store.state.dataManager.isCloseReloadWhenEnter
+        return this.$store.state.dataManager.isLoadTreeAsync
       },
       set (val) {
-        const isCloseReloadWhenEnter = !val
-        this.$store.commit('setIsCloseReloadWhenEnter', isCloseReloadWhenEnter)
+        this.$store.commit('setIsTreeLoadAsync', val)
         this.$store.dispatch('updateConfigByKey', {
-          'mock.data.tree.closeReload': isCloseReloadWhenEnter
+          'mock.data.tree.asynchronous': val
         })
+        this.$store.dispatch('loadDataMap')
       }
     },
     isPreloadDataMap: {
@@ -268,6 +295,10 @@ export default {
         })
     },
     editLabel (payload) {
+      // When label is not empty, close isLoadTreeAsync
+      if (payload.labels.length > 0) {
+        this.isLoadTreeAsync = false
+      }
       this.$store.commit('setDataListSelectedLabel', {})
       let labels = []
       for (const id of payload.labels) {
diff --git a/frontend/src/views/datamanager/DataManager.vue b/frontend/src/views/datamanager/DataManager.vue
index 317748b61..57dd5266f 100644
--- a/frontend/src/views/datamanager/DataManager.vue
+++ b/frontend/src/views/datamanager/DataManager.vue
@@ -48,14 +48,12 @@ export default {
     SnapshotImportSelector,
   },
   activated () {
-    if (this.groupList.length == 0 || this.isReloadWhenEnter) {
+    this.$io.on('datamanagerUpdateMessage', this.onDatamanagerUpdateMessage)
+    if (this.settingsInitialized && !this.isPreloadDataMap) {
       this.loadDataMap()
     }
-    this.$io.on('datamanagerUpdate', this.loadDataMap)
-    this.$io.on('datamanagerUpdateMessage', this.onDatamanagerUpdateMessage)
   },
   deactivated() {
-    this.$io.removeListener('datamanagerUpdate', this.loadDataMap)
     this.$io.removeListener('datamanagerUpdateMessage', this.onDatamanagerUpdateMessage)
   },
   data () {
@@ -69,8 +67,22 @@ export default {
     groupList () {
       return this.$store.state.dataManager.groupList
     },
-    isReloadWhenEnter () {
-      return !this.$store.state.dataManager.isCloseReloadWhenEnter
+    isPreloadDataMap () {
+      return this.$store.state.settings.preLoadFuncSet.has('loadDataMap')
+    },
+    settingsInitialized () {
+      return this.$store.state.settings.initialized
+    }
+  },
+  watch: {
+    settingsInitialized (val) {
+      // `activated` might be earlier than settings init
+      if (!val) { 
+        return 
+      }
+      if (!this.isPreloadDataMap) {
+        this.loadDataMap()
+      }
     }
   },
   methods: {
diff --git a/frontend/src/views/inspector/ButtonBar.vue b/frontend/src/views/inspector/ButtonBar.vue
index 63a60c656..415ab7ef3 100644
--- a/frontend/src/views/inspector/ButtonBar.vue
+++ b/frontend/src/views/inspector/ButtonBar.vue
@@ -215,6 +215,7 @@ export default {
       set (val) {
         this.$store.dispatch('commitAndupdateConfigByKey', {
           'command': 'setIsRequestKeepOriginData',
+          'isShowMessage': true,
           val
         })
       }
diff --git a/lyrebird/config.py b/lyrebird/config.py
deleted file mode 100644
index e73593abf..000000000
--- a/lyrebird/config.py
+++ /dev/null
@@ -1,111 +0,0 @@
-from pathlib import Path
-from os import path
-import codecs
-import json
-from packaging import version
-import jinja2
-from lyrebird import log as nlog
-from lyrebird.mock import context
-
-logger = nlog.get_logger()
-
-config_template = {
-    "version": "0.10.5",
-    "proxy.filters": [],
-    "proxy.port": 4272,
-    "mock.port": 9090,
-    "mock.data": path.join("{{current_dir}}", "mock_data", "personal"),
-    "mock.proxy_headers": {
-        "scheme": "MKScheme",
-        "host": "MKOriginHost",
-        "port": "MKOriginPort"
-    }
-}
-
-
-class ConfigManager():
-    ROOT = Path('~/.lyrebird').expanduser()
-    DEFAULT_FILENAME = 'conf.json'
-    BASE_CONFIG = ROOT / DEFAULT_FILENAME
-    FORBIDDEN_MODIFY_FIELDS_IN_CONFIG = set(['version', 'proxy.port', 'mock.port'])
-
-    def __init__(self, conf_path_list=None, custom_conf=None):
-        self.config = config_template
-        self.config_root = self.ROOT
-        self.conf_file = self.BASE_CONFIG
-
-        self.update_base_config()
-        self.read_config()
-        if conf_path_list:
-            for conf_path in conf_path_list:
-                self.update_conf_source(conf_path)
-        if custom_conf:
-            self.config.update(custom_conf)
-
-    def update_conf_source(self, path):
-        input_path: Path = Path(path).expanduser().absolute()
-        if input_path.is_dir():
-            input_root = input_path
-            input_file = input_path / self.DEFAULT_FILENAME
-        else:
-            input_root = input_path.parent
-            input_file = input_path
-
-        if not input_file.exists():
-            logger.error(f'Config {input_file} not found!')
-        else:
-            self.config_root = input_root
-            self.conf_file = input_file
-            self.read_config()
-
-    def contains_forbidden_modify_field(self, update_conf: dict):
-        union_fields = self.FORBIDDEN_MODIFY_FIELDS_IN_CONFIG & update_conf.keys()
-        return union_fields if len(union_fields) > 0 else None
-
-    def override_config_field(self, update_conf: dict):
-        """
-        Update Application config by ``config.update(update_conf)``.
-        If update_conf contains ``FORBIDDEN_MODIFY_FIELDS_IN_CONFIG``, raise ``ConfigException``.
-        """
-        if not update_conf:
-            return
-
-        forbidden_modify_fields = self.contains_forbidden_modify_field(update_conf)
-        if forbidden_modify_fields:
-            raise ConfigException(f'Config field cannot be modified: {forbidden_modify_fields}')
-
-        # TODO handle bug diff mode not effect
-        # Remove bellow code next version
-        if 'mock.mode' in update_conf:
-            context.application.is_diff_mode = update_conf['mock.mode']
-
-        logger.debug(f'Need update config fields: {update_conf}')
-        self.config.update(update_conf)
-        logger.debug(f'Update done. config: {self.config}')
-
-    def read_config(self):
-        template_env = jinja2.Environment(loader=jinja2.FileSystemLoader(str(self.config_root)))
-        template = template_env.get_template(self.conf_file.name)
-        current_dir = str(self.config_root)
-        download_dir = str(self.ROOT / 'downloads')
-        conf_str = template.render(current_dir=json.dumps(current_dir).strip('"'), download_dir=json.dumps(download_dir).strip('"'))
-        loaded_config = json.loads(conf_str)
-        self.config.update(loaded_config)
-
-    def write_config(self):
-        self.config_root.mkdir(parents=True, exist_ok=True)
-        with codecs.open(self.conf_file, 'w', 'utf-8') as f:
-            f.write(json.dumps(self.config, indent=4, ensure_ascii=False))
-
-    def update_base_config(self):
-        if self.BASE_CONFIG.exists() and self.BASE_CONFIG.is_file():
-            with codecs.open(self.BASE_CONFIG, 'r', 'utf-8') as f:
-                base_conf = json.load(f)
-                if version.parse(base_conf.get('version', '0.0.0')) < version.parse(config_template.get('version', '0.0.0')):
-                    self.write_config()
-        else:
-            self.write_config()
-
-
-class ConfigException(Exception):
-    pass
diff --git a/lyrebird/config/__init__.py b/lyrebird/config/__init__.py
new file mode 100644
index 000000000..1b1166e63
--- /dev/null
+++ b/lyrebird/config/__init__.py
@@ -0,0 +1,233 @@
+import json
+import codecs
+import jinja2
+from os import path
+from pathlib import Path
+from copy import deepcopy
+from packaging import version
+from lyrebird import log as nlog
+from lyrebird import application
+
+from lyrebird.config.diff_mode import SettingDiffMode
+from lyrebird.config.checker_switch import SettingCheckerSwitch
+
+from .keywords import CONFIG_TREE_SHOW_CONFIG, CONFIG_TREE_LOAD_CHILDREN_ASYNC
+
+logger = nlog.get_logger()
+
+config_template = {
+    "version": "0.10.5",
+    "proxy.filters": [],
+    "proxy.port": 4272,
+    "mock.port": 9090,
+    "mock.data": path.join("{{current_dir}}", "mock_data", "personal"),
+    "mock.proxy_headers": {
+        "scheme": "MKScheme",
+        "host": "MKOriginHost",
+        "port": "MKOriginPort"
+    }
+}
+
+CONFIG_FUNC_MAP = {
+    'checker.switch': SettingCheckerSwitch,
+    'mock.mode': SettingDiffMode
+}
+
+
+class ConfigManager():
+    ROOT = Path('~/.lyrebird').expanduser()
+    DEFAULT_FILENAME = 'conf.json'
+    BASE_CONFIG = ROOT / DEFAULT_FILENAME
+    FORBIDDEN_MODIFY_FIELDS_IN_CONFIG = set(['version', 'proxy.port', 'mock.port'])
+
+    def __init__(self, conf_path_list=None, custom_conf=None):
+        self.config = config_template
+        self.config_root = self.ROOT
+        self.conf_file = self.BASE_CONFIG
+        self.config_list = []
+
+        self.update_base_config()
+        self.read_config()
+        if conf_path_list:
+            for conf_path in conf_path_list:
+                self.update_conf_source(conf_path)
+        if custom_conf:
+            self.update_conf_custom(custom_conf)
+
+    def update_conf_source(self, path):
+        input_path: Path = Path(path).expanduser().absolute()
+        if input_path.is_dir():
+            input_root = input_path
+            input_file = input_path / self.DEFAULT_FILENAME
+        else:
+            input_root = input_path.parent
+            input_file = input_path
+
+        if not input_file.exists():
+            logger.error(f'Config {input_file} not found!')
+        else:
+            self.config_root = input_root
+            self.conf_file = input_file
+            self.read_config()
+
+    def update_conf_custom(self, custom_conf):
+        self.add_config(custom_conf, rank=-1)
+
+    def contains_forbidden_modify_field(self, update_conf: dict):
+        union_fields = self.FORBIDDEN_MODIFY_FIELDS_IN_CONFIG & update_conf.keys()
+        return union_fields if len(union_fields) > 0 else None
+
+    def override_config_field(self, update_conf: dict):
+        """
+        Update Application config by ``config.update(update_conf)``.
+        If update_conf contains ``FORBIDDEN_MODIFY_FIELDS_IN_CONFIG``, raise ``ConfigException``.
+        """
+        if not update_conf:
+            return
+
+        forbidden_modify_fields = self.contains_forbidden_modify_field(update_conf)
+        if forbidden_modify_fields:
+            raise ConfigException(f'Config field cannot be modified: {forbidden_modify_fields}')
+
+        self.add_config(update_conf, type='api_patch', apply_now=True)
+
+        logger.debug(f'Need update config fields: {update_conf}')
+        self.config.update(update_conf)
+        logger.debug(f'Update done. config: {self.config}')
+
+    def read_config(self):
+        template_env = jinja2.Environment(loader=jinja2.FileSystemLoader(str(self.config_root)))
+        template = template_env.get_template(self.conf_file.name)
+        current_dir = str(self.config_root)
+        download_dir = str(self.ROOT / 'downloads')
+        conf_str = template.render(current_dir=json.dumps(current_dir).strip('"'), download_dir=json.dumps(download_dir).strip('"'))
+        loaded_config = json.loads(conf_str)
+
+        self.add_config(loaded_config, rank=-10)
+
+    def write_config(self):
+        self.config_root.mkdir(parents=True, exist_ok=True)
+        with codecs.open(self.conf_file, 'w', 'utf-8') as f:
+            f.write(json.dumps(self.config, indent=4, ensure_ascii=False))
+
+    def update_base_config(self):
+        if self.BASE_CONFIG.exists() and self.BASE_CONFIG.is_file():
+            with codecs.open(self.BASE_CONFIG, 'r', 'utf-8') as f:
+                base_conf = json.load(f)
+                if version.parse(base_conf.get('version', '0.0.0')) < version.parse(config_template.get('version', '0.0.0')):
+                    self.write_config()
+        else:
+            self.write_config()
+
+    def add_config(self, config_dict: dict, rank=0, type='', override_same_type=False, level=1, apply_now=False) -> None:
+        config = Config(config_dict)
+        config.type = type
+
+        if override_same_type:
+            for c in self.config_list[::-1]:
+                if c.type == type:
+                    self.config_list.remove(c)
+        self.config_list.append(config)
+
+        self.merge_config(self.config, config.config, level=level, apply_now=apply_now)
+
+    def merge_config(self, origin_config, new_config, level=-1, apply_now=False):
+        for key_child in list(new_config.keys()):
+            self.merge_generator(key_child, origin_config, new_config, level)
+
+        if apply_now:
+            self.add_each_config_item(new_config)
+
+    def merge_generator(self, key, origin_config, new_config, level):
+        if level == 0:
+            return
+
+        if key not in origin_config:
+            origin_config[key] = deepcopy(new_config[key])
+
+        elif origin_config[key] == new_config[key]:
+            return
+
+        elif level == 1:
+            origin_config[key] = deepcopy(new_config[key])
+
+        elif type(origin_config[key]) != type(new_config[key]):
+            origin_config[key] = deepcopy(new_config[key])
+
+        elif isinstance(new_config[key], list):
+            origin_config[key] = deepcopy(new_config[key])
+
+        elif isinstance(new_config[key], dict):
+            for key_child in list(new_config[key].keys()):
+                self.merge_generator(key_child, origin_config[key], new_config[key], level-1)
+
+        else:
+            origin_config[key] = new_config[key]
+
+    def add_each_config_item(self, config):
+        # 处理第一层的key
+        for key, value in config.items():
+            if key not in CONFIG_FUNC_MAP:
+                continue
+            CONFIG_FUNC_MAP[key].add(value)
+
+    def remove_config(self, config, type='', level=-1, apply_now=False):
+        remove_config = None
+        recover_config = None
+        for c in self.config_list[::-1]:
+            if remove_config:
+                recover_config = c
+                break
+
+            if c.type == type:
+                remove_config = c
+
+        self.unmerge_config(self.config, remove_config.config, level=level, apply_now=apply_now)
+
+        self.merge_config(self.config, recover_config.config, level=level, apply_now=apply_now)
+
+        # todo handle the config added after remove_config
+
+        self.config_list.remove(remove_config)
+
+    def unmerge_config(self, origin_config, remove_config, level=-1, apply_now=False):
+        for key_child in list(remove_config.keys()):
+            self.unmerge_generator(key_child, origin_config, remove_config, level=level)
+
+        if apply_now:
+            self.remove_each_config_item(remove_config)
+
+    def unmerge_generator(self, key, origin_config, remove_config, level):
+        if level == 0:
+            return
+
+        if key not in origin_config:
+            return
+
+        if level == 1:
+            origin_config.pop(key, None)
+
+        elif isinstance(remove_config[key], dict):
+            for key_child in list(remove_config[key].keys()):
+                self.unmerge_generator(key_child, origin_config[key], remove_config[key], level-1)
+
+        else:
+            origin_config.pop(key, None)
+
+    def remove_each_config_item(self, config):
+        # 处理第一层的key
+        for key, value in config.items():
+            if key not in CONFIG_FUNC_MAP:
+                continue
+            CONFIG_FUNC_MAP[key].remove(value)
+
+
+class Config:
+    def __init__(self, config):
+        self.rank = 0
+        self.type = ''
+        self.config = config
+
+
+class ConfigException(Exception):
+    pass
diff --git a/lyrebird/config/checker_switch.py b/lyrebird/config/checker_switch.py
new file mode 100644
index 000000000..8725c0c7f
--- /dev/null
+++ b/lyrebird/config/checker_switch.py
@@ -0,0 +1,44 @@
+from lyrebird import application
+from lyrebird.log import get_logger
+
+
+logger = get_logger()
+
+
+class SettingCheckerSwitch:
+
+    @staticmethod
+    def add(config):
+        checker_id_set = set(config.keys()) | set(application.checkers.keys())
+        for checker_id in checker_id_set:
+            if checker_id not in application.checkers:
+                logger.error(f'Extension {checker_id} in mock data not found! ')
+                continue
+
+            checker = application.checkers[checker_id]
+            config_status = config.get(checker_id)
+            if config_status is None:
+                continue
+
+            SettingCheckerSwitch.handle_checker(checker, config_status)
+
+    @staticmethod
+    def remove(config):
+        checker_id_set = set(config.keys()) | set(application.checkers.keys())
+        for checker_id in checker_id_set:
+            if checker_id not in application.checkers:
+                continue
+
+            checker = application.checkers[checker_id]
+            config_status = config.get(checker_id)
+            if not config_status:
+                continue
+            SettingCheckerSwitch.handle_checker(checker, not config_status)
+
+    @staticmethod
+    def handle_checker(checker, target_status):
+        context_status = checker.activated
+        if target_status == context_status:
+            return
+
+        checker.activate() if target_status else checker.deactivate()
diff --git a/lyrebird/config/diff_mode.py b/lyrebird/config/diff_mode.py
new file mode 100644
index 000000000..2fb79b75e
--- /dev/null
+++ b/lyrebird/config/diff_mode.py
@@ -0,0 +1,12 @@
+from lyrebird.mock import context
+
+
+class SettingDiffMode:
+
+    @staticmethod
+    def add(mode):
+        context.application.is_diff_mode = mode
+
+    @staticmethod
+    def remove(mode):
+        context.application.is_diff_mode = mode
diff --git a/lyrebird/config/keywords.py b/lyrebird/config/keywords.py
new file mode 100644
index 000000000..f7ff0dd7f
--- /dev/null
+++ b/lyrebird/config/keywords.py
@@ -0,0 +1,2 @@
+CONFIG_TREE_SHOW_CONFIG = 'mock.data.shownConfig'
+CONFIG_TREE_LOAD_CHILDREN_ASYNC= 'mock.data.tree.asynchronous'
diff --git a/lyrebird/mock/blueprints/apis/menu.py b/lyrebird/mock/blueprints/apis/menu.py
index 0f5988d98..e24271497 100644
--- a/lyrebird/mock/blueprints/apis/menu.py
+++ b/lyrebird/mock/blueprints/apis/menu.py
@@ -40,6 +40,9 @@ def get(self):
         # Load plugins from new plugin manager
         _pm = application.server['plugin']
         for plugin_id, plugin in _pm.plugins.items():
+            if plugin.manifest.no_frontend:
+                continue
+
             menu.append({
                 'name': 'plugin-container',
                 'title': plugin.manifest.name,
@@ -56,7 +59,14 @@ def get(self):
             self.set_active_menu(menu[0])
         active_menu = application.active_menu
         for index, menu_item in enumerate(menu):
-            if menu_item['name'] == active_menu.get('name'):
+            if active_menu.get('name') == 'plugin-container' and 'params' in active_menu:
+                if 'params' not in menu_item:
+                    continue
+                if menu_item['params'].get('name') != active_menu['params'].get('name'):
+                    continue
+                active_menu_index = index
+                break
+            elif menu_item['name'] == active_menu.get('name'):
                 active_menu_index = index
                 break
         return context.make_ok_response(menu=menu, activeMenuItem=active_menu, activeMenuItemIndex=active_menu_index)
diff --git a/lyrebird/mock/blueprints/apis/mock.py b/lyrebird/mock/blueprints/apis/mock.py
index 7ad9518ff..c69b47fc9 100644
--- a/lyrebird/mock/blueprints/apis/mock.py
+++ b/lyrebird/mock/blueprints/apis/mock.py
@@ -3,6 +3,7 @@
 from flask import request
 import traceback
 from lyrebird import application, log
+from lyrebird.config import CONFIG_TREE_LOAD_CHILDREN_ASYNC
 
 logger = log.get_logger()
 
@@ -14,6 +15,11 @@ class MockGroup(Resource):
 
     def get(self, group_id=None, label=None):
         if group_id:
+            query = request.args
+            if query and query.get('childrenOnly') == 'true':
+                children = context.application.data_manager._get_group_children(group_id) or []
+                return application.make_ok_response(data=children)
+
             _group = context.application.data_manager.get(group_id)
             if not _group:
                 return context.make_fail_response('Not found group')
@@ -21,26 +27,32 @@ def get(self, group_id=None, label=None):
             return application.make_ok_response(data=_group)
 
         context.application.data_manager.reload()
-        root = context.application.data_manager.root
-        if not label:
-            return application.make_ok_response(data=root)
 
-        # update mock data tree with label
-        groups_set = set()
+        if label:
+            # update mock data tree with label
+            groups_set = set()
 
-        label_list = label.split('+')
-        for label_id in label_list:
-            label = application.labels.label_map.get(label_id)
-            if not label:
-                return application.make_fail_response(f'Label {label_id} is not found!')
+            label_list = label.split('+')
+            for label_id in label_list:
+                label = application.labels.label_map.get(label_id)
+                if not label:
+                    return application.make_fail_response(f'Label {label_id} is not found!')
 
-            if not groups_set:
-                groups_set = set(label['groups'])
-            else:
-                groups_set = groups_set & set(label['groups'])
+                if not groups_set:
+                    groups_set = set(label['groups'])
+                else:
+                    groups_set = groups_set & set(label['groups'])
 
-        data_map = context.application.data_manager.make_data_map_by_group(groups_set)
-        return application.make_ok_response(data=data_map)
+            data_map = context.application.data_manager.make_data_map_by_group(groups_set)
+            return application.make_ok_response(data=data_map)
+
+        if application.config.get(CONFIG_TREE_LOAD_CHILDREN_ASYNC):
+            # Although async, reload is needed
+            data_map = context.application.data_manager.root_without_children()
+            return application.make_ok_response(data=data_map)
+
+        root = context.application.data_manager.root
+        return application.make_ok_response(data=root)
 
     def post(self):
         data = request.json.get('data')
diff --git a/lyrebird/mock/dm/__init__.py b/lyrebird/mock/dm/__init__.py
index 93256fe98..c1bddc531 100644
--- a/lyrebird/mock/dm/__init__.py
+++ b/lyrebird/mock/dm/__init__.py
@@ -13,6 +13,7 @@
 from lyrebird.application import config
 from lyrebird.mock import context
 from lyrebird.mock.dm.match import MatchRules
+from lyrebird.config import CONFIG_TREE_SHOW_CONFIG
 
 PROP_FILE_NAME = '.lyrebird_prop'
 logger = get_logger()
@@ -39,7 +40,10 @@ def __init__(self):
 
         self.add_group_ignore_keys = set(['id', 'type', 'children'])
         self.update_group_ignore_keys = set(['id', 'parent_id', 'type', 'children'])
-        self.supported_data_type = ['data', 'json']
+        self.supported_data_type = ['data', 'json', 'config']
+        self.virtual_node_data_type = set(['config']) # TODO Next is `super``
+
+        self.virtual_base_config_id = None
 
         self.unsave_keys = set()
 
@@ -77,14 +81,112 @@ def set_root(self, uri):
 
     def reload(self):
         self._adapter._reload()
-        self.add_parent_into_node()
+        self.handle_node_type_config()
+        self.add_parent()
         self.add_super_by()
 
-    def add_parent_into_node(self):
-        self.add_parent(self.root)
+    def _get_group_children(self, group_id):
+        children = self._adapter._get_group_children(group_id)
+        parent_node = self.id_map.get(group_id)
+        if not parent_node:
+            raise IDNotFound(group_id)
+        self.handle_group_config(children, parent_node['id'])
+
+        for child in children:
+            # update id_map
+            if child['id'] not in self.id_map:
+                self.id_map.update({
+                    child['id']: child
+                })
+
+            self.add_parent_generator(child, parent_node)
+            self.add_super_by(node=child)
+
+        children.sort(key=lambda sub_node: sub_node['name'])
+        return children
+
+    def init_config_base_node(self):
+        if self.virtual_base_config_id:
+            return
+
+        root_id = self.root['id']
+        root_node = self.id_map.get(root_id)
+        if not root_node:
+            return
+
+        root_children = root_node.get('children', [])
+        for node in root_children:
+            if node['type'] == 'config':
+                self.virtual_base_config_id = node['id']
+                return
+
+    def handle_node_type_config(self):
+        self.init_config_base_node()
+        if not self.virtual_base_config_id:
+            return
+
+        all_new_config_node = {}
+        for id_, node in self.id_map.items():
+            if node['type'] != 'group':
+                continue
+
+            if 'children' not in node:
+                node['children'] = []
+
+            new_config_node = self.handle_group_config(node['children'], id_)
+            if not new_config_node:
+                continue
+
+            all_new_config_node.update(new_config_node)
+
+        if all_new_config_node:
+            self.id_map.update(all_new_config_node)
+
+    def handle_group_config(self, node_list, node_id):
+        has_config_index = -1
+        for index, node in enumerate(node_list):
+            if node['type'] == 'config':
+                has_config_index = index
+                break
+
+        is_show_config = application.config.get(CONFIG_TREE_SHOW_CONFIG)
+        has_config = has_config_index != -1
+        if is_show_config == has_config:
+            return
+
+        elif has_config and not is_show_config:
+            del node_list[has_config_index]
+            return
+
+        elif is_show_config and not has_config:
+            if not self.virtual_base_config_id:
+                return
+            new_config_node = {}
+
+            config_node_id = str(uuid.uuid4())
+            config_node = {
+                'id': config_node_id,
+                'name': '.Settings',
+                'type': 'config',
+                'parent_id': node_id,
+                'link': self.virtual_base_config_id
+            }
+            node_list.append(config_node)
+            new_config_node[config_node_id] = config_node
+
+            return new_config_node
+
+    def add_parent(self, node=None):
+        if not node:
+            root_id = self.root['id']
+            root = self.id_map.get(root_id)
+            self.add_parent_generator(root)
+        else:
+            parent_node = self.id_map.get(node['parent_id'])
+            self.add_parent_generator(node, parent_node=parent_node)
         self.unsave_keys.update(['parent', 'abs_parent_path'])
 
-    def add_parent(self, node, parent_node=None):
+    def add_parent_generator(self, node, parent_node=None):
         parent_node_parent = parent_node['parent'] if parent_node and parent_node.get('parent') else []
         parent_obj = parent_node_parent + [{
             'id': node['id'],
@@ -93,7 +195,7 @@ def add_parent(self, node, parent_node=None):
             'parent_id': node['parent_id']
         }]
 
-        abs_parent_path = f"{parent_node['abs_parent_path']}{node['name']}/" if parent_node else '/'
+        abs_parent_path = f"{parent_node['abs_parent_path']}{node['name']}/" if parent_node and parent_node.get('abs_parent_path') else '/'
 
         node.update({
             'parent': parent_obj,
@@ -104,10 +206,12 @@ def add_parent(self, node, parent_node=None):
             return
 
         for child in node['children']:
-            self.add_parent(child, node)
+            self.add_parent_generator(child, node)
+
+    def add_super_by(self, node=None):
+        node_list = [node] if node else self.id_map.values()
 
-    def add_super_by(self):
-        for node in self.id_map.values():
+        for node in node_list:
             if not node.get('super_id'):
                 continue
             super_parent_node = self.id_map.get(node['super_id'])
@@ -130,15 +234,38 @@ def get(self, _id):
         node = self.id_map.get(_id)
         if not node:
             raise IDNotFound(_id)
+
+        link = node.get('link')
+        if link:
+            link_node = self.id_map.get(_id)
+            if not link_node:
+                logger.error('link node not found!')
+                raise IDNotFound(link_node)
+            data = self.get(node['link'])
+            data['link'] = data['id']
+            data['id'] = link_node['id']
+            return data
+
         if node.get('type') == 'group' or node.get('type') == None:
             return self._adapter._get_group(_id)
         elif node.get('type') == 'data':
             return self._adapter._load_data(_id)
         elif node.get('type') == 'json':
             return self._adapter._load_data(_id)
+        elif node.get('type') == 'config':
+            data = self._adapter._load_data(_id)
+            data.pop('name', None)
+            return data
         else:
             raise UnsupportedType
 
+    def is_data_virtual_node(self, node):
+        if node['type'] == 'config':
+            if 'link' in node:
+                return node['link'] == self.virtual_base_config_id
+ 
+        return False
+
     # -----
     # Mock operations
     # -----
@@ -179,8 +306,15 @@ def make_data_map_by_group(self, group_ids):
             node = self.id_map.get(group_id)
             map_pointer.append(node)
 
+        self._sort_tree_children_by_name(self.display_data_map)
+
         return self.display_data_map
 
+    def root_without_children(self):
+        async_tree = {k: v for k,v in self.root.items() if k not in ['children']}
+        async_tree['children'] = []
+        return async_tree
+
     def activate(self, search_id, **kwargs):
         """
         Activite data by id
@@ -208,6 +342,11 @@ def activate(self, search_id, **kwargs):
         self.activated_data.update({i: data_map[i] for i in ordered_data_id if data_map.get(i)})
         self.activated_group[_id] = _node
 
+        # Apply config
+        config = self._get_activated_data_config()
+        if config:
+            application._cm.add_config(config, type='dm', level=-1, apply_now=True)
+
         # After activate
         self._check_activated_data_rules_contains_request_data()
         self._adapter._after_activate(**kwargs)
@@ -243,6 +382,8 @@ def _collect_activate_node(self, node, level_lefted=1):
 
     def _collect_data_in_node(self, node):
         id_list = []
+        if self.is_data_virtual_node(node):
+            return []
         if node.get('type') in self.supported_data_type:
             return [node['id']]
         elif node.get('type', '') == 'group':
@@ -255,6 +396,10 @@ def deactivate(self):
         """
         Clear activated data
         """
+        config = self._get_activated_data_config()
+        if config:
+            application._cm.remove_config(config, type='dm', apply_now=True)
+
         self.activated_data = OrderedDict()
         self.activated_group = {}
         self._check_activated_data_rules_contains_request_data()
@@ -304,6 +449,30 @@ def _format_respose_data(flow):
     def _is_match_rule(self, flow, rules):
         return MatchRules.match(flow, rules)
 
+    def _get_activated_data_config(self):
+        config_id = None
+        for id_, data in self.activated_data.items():
+            if 'json' not in data:
+                continue
+
+            node = self.id_map.get(id_)
+            if not node:
+                continue
+            if node['type'] == 'config':
+                config_id = id_
+                break
+
+        if not config_id:
+            return
+        config_node = self.activated_data.get(config_id)
+        if not config_node:
+            return
+
+        try:
+            return json.loads(config_node['json'])
+        except Exception:
+            logger.error(f'Load config {config_node["id"]} error! \n {traceback.format_exc()}')
+
     # -----
     # Data tree operations
     # -----
@@ -324,6 +493,8 @@ def _make_data(self, raw_data, **kwargs):
 
         if data.get('type') == 'json':
             self._make_data_json(raw_data, data)
+        elif data.get('type') == 'config':
+            self._make_data_config(raw_data, data)
         elif data.get('type') == 'data':
             self._make_data_http_data(raw_data, data)
         else:
@@ -367,6 +538,12 @@ def _make_data_json(self, raw_data, data):
 
         data['name'] = data['name'] if data.get('name') else 'Unnamed JSON'
 
+    def _make_data_config(self, raw_data, data):
+        if 'json' not in data:
+            data['json'] = {}
+
+        data['name'] = '.Settings'
+
     def add_data(self, parent_id, raw_data, **kwargs):
         if not isinstance(raw_data, dict):
             raise DataObjectShouldBeADict
@@ -387,7 +564,7 @@ def add_data(self, parent_id, raw_data, **kwargs):
             if parent_node['type'] != 'group':
                 raise OnlyGroupCanContainAnyOtherObject
 
-        data = self._make_data(raw_data)
+        data = self._make_data(raw_data, **kwargs)
         data['parent_id'] = parent_id
         _data_id = data['id']
         _data_name = data.get('name')
@@ -556,6 +733,9 @@ def duplicate(self, _id, **kwargs):
         return self._adapter.duplicate(_id)
 
     def _copy_node(self, parent_node, node, **kwargs):
+        if self.is_data_virtual_node(node):
+            return
+
         new_node = {}
         new_node.update(node)
         new_node['id'] = str(uuid.uuid4())
@@ -612,6 +792,13 @@ def _sort_children_by_name(self):
                 continue
             node['children'] = sorted(node['children'], key=lambda sub_node: sub_node['name'])
 
+    def _sort_tree_children_by_name(self, node):
+        if not node.get('children'):
+            return
+        node['children'].sort(key=lambda sub_node: sub_node['name'])
+        for child in node['children']:
+            self._sort_tree_children_by_name(child)
+
     # -----
     # Conflict checker
     # -----
@@ -758,7 +945,14 @@ def update_data(self, _id, data):
         node = self.id_map.get(_id)
         if not node:
             raise IDNotFound(_id)
-        node['name'] = data['name']
+
+        if node.get('link'):
+            data['type'] = node['type']
+            self.add_data(node['parent_id'], data, data_id=data['id'])
+            return
+
+        if 'name' in data:
+            node['name'] = data['name']
         self._adapter._update_data(data)
         self._adapter._update_group(node)
 
@@ -852,7 +1046,8 @@ def _get_type_hashmap(self, ids):
         type_map = {
             'group': [],
             'data': [],
-            'json': []
+            'json': [],
+            'config': []
         }
         for id_ in ids:
             node = self.id_map.get(id_)
@@ -893,8 +1088,8 @@ def delete_by_query(self, query):
             })
 
             type_map = self._get_type_hashmap(id_list)
-            node_delete_group_ids = type_map['group'] + type_map['data'] + type_map['json']
-            node_delete_data_ids = type_map['data'] + type_map['json']
+            node_delete_group_ids = type_map['group'] + type_map['data'] + type_map['json'] + type_map['config']
+            node_delete_data_ids = type_map['data'] + type_map['json'] + type_map['config']
 
             for id_ in id_list:
                 # Delete from parent
@@ -968,6 +1163,10 @@ class IDNotFound(Exception):
     pass
 
 
+class BaseConfigNodeNotFound(Exception):
+    pass
+
+
 class NoneClipbord(Exception):
     pass
 
diff --git a/lyrebird/mock/dm/file_data_adapter.py b/lyrebird/mock/dm/file_data_adapter.py
index 3d01f5a24..77d355c4c 100644
--- a/lyrebird/mock/dm/file_data_adapter.py
+++ b/lyrebird/mock/dm/file_data_adapter.py
@@ -3,6 +3,11 @@
 import codecs
 from pathlib import Path
 from urllib.parse import urlparse
+from lyrebird.log import get_logger
+from lyrebird.mock.dm import mock_data_upgrade
+
+
+logger = get_logger()
 
 
 PROP_FILE_NAME = '.lyrebird_prop'
@@ -28,6 +33,9 @@ def _set_root(self, root_path):
         self.context.root_path = _root_path
         self.context.reload()
 
+        mock_data_upgrade.upgrade(self)
+        self.context.reload()
+
     def _reload(self):
         self.context.id_map = {}
         self._load_prop()
@@ -52,10 +60,31 @@ def _init_id_map(self, node):
     def _get_group(self, id_):
         return self.context.id_map.get(id_)
 
+    def _get_group_children(self, id_):
+        node = self.context.id_map.get(id_)
+        return node.get('children')
+
     def _add_group(self, data, **kwargs):
         self._save_prop()
 
     def _update_group(self, data):
+        id_ = data['id']
+        node = self.context.id_map.get(id_)
+
+        # 1. Add new key into node
+        update_data = {k: data[k] for k in data if k not in self.context.update_group_ignore_keys}
+        node.update(update_data)
+
+        # 2. Remove deleted key in node
+        delete_keys = [k for k in data if k not in data and k not in self.context.update_group_ignore_keys]
+        for key in delete_keys:
+            node.pop(key)
+
+        # 3. Update existed value
+        for key, value in data.items():
+            if key in node:
+                node[key] = value
+
         self._save_prop()
 
     def _delete_group(self, data):
@@ -102,6 +131,9 @@ def _save_prop(self):
         prop_writer = PropWriter()
         prop_writer.dict_ignore_key.update(self.context.unsave_keys)
 
+        # handle link node
+        prop_writer.dict_ignore_child_key.add('link')
+
         prop_str = prop_writer.parse(self.context.root)
         prop_file = self.context.root_path / PROP_FILE_NAME
         with codecs.open(prop_file, 'w') as f:
@@ -201,6 +233,7 @@ def __init__(self):
             'NoneType': self.none_parser
         }
         self.dict_ignore_key = set()
+        self.dict_ignore_child_key = set()
 
     def parse(self, prop):
         prop_type = type(prop)
@@ -252,6 +285,8 @@ def children_parser(self, val):
         self.indent += 1
         children_str = '"children":['
         for child in val:
+            if self.dict_ignore_child_key & set(child.keys()):
+                continue
             child_str = self.parse(child)
             children_str += '\n' + '  '*self.indent + child_str + ','
         if children_str.endswith(','):
diff --git a/lyrebird/mock/dm/mock_data_upgrade.py b/lyrebird/mock/dm/mock_data_upgrade.py
new file mode 100644
index 000000000..4cb11289b
--- /dev/null
+++ b/lyrebird/mock/dm/mock_data_upgrade.py
@@ -0,0 +1,30 @@
+import uuid
+from lyrebird.log import get_logger
+
+
+logger = get_logger()
+
+
+def upgrade(self):
+    MockData_2_13_0_to_2_14_0.upgrade(self)
+
+
+class MockData_2_13_0_to_2_14_0:
+
+    @staticmethod
+    def upgrade(self):
+        root_id = self.context.root['id']
+
+        for node in self.context.id_map.values():
+            if node['type'] == 'config' and node['parent_id'] == root_id:
+                return
+
+        logger.warning('Upgrade mock data from 2.13.0 to 2.14.0 start')
+        new_node = {
+            'id': str(uuid.uuid4()),
+            'type': 'config',
+            'parent_id': root_id,
+            'name': '.Settings'
+        }
+        self.context.add_data(root_id, new_node)
+        logger.warning('Upgrade mock data from 2.13.0 to 2.14.0 completed')
diff --git a/lyrebird/plugins/plugin.py b/lyrebird/plugins/plugin.py
index 343286812..bbc696dab 100644
--- a/lyrebird/plugins/plugin.py
+++ b/lyrebird/plugins/plugin.py
@@ -16,6 +16,7 @@ def default():
             view=('dist', 'index.html'),
             icon='mdi-widgets',
             api=[],
+            no_frontend=False,
             background=[],
             event=[],
             on_request=[],
diff --git a/lyrebird/version.py b/lyrebird/version.py
index 95e4334d1..71c692855 100644
--- a/lyrebird/version.py
+++ b/lyrebird/version.py
@@ -1,3 +1,3 @@
-IVERSION = (2, 14, 1)
+IVERSION = (2, 15, 0)
 VERSION = ".".join(str(i) for i in IVERSION)
 LYREBIRD = "Lyrebird " + VERSION
diff --git a/tests/test_dm.py b/tests/test_dm.py
index 10bfa0a99..279cca176 100644
--- a/tests/test_dm.py
+++ b/tests/test_dm.py
@@ -1,6 +1,7 @@
+import re
+import json
 import pytest
 import codecs
-import json
 import tarfile
 import lyrebird
 from pathlib import Path
@@ -115,7 +116,7 @@
         'url': 'http://unittest.com/api/search'
     },
     'response': {
-        'data': '"keyA":"valueA","keyB":"{{config.get(\'custom.8df051be-4381-41b6-9252-120d9b558bf6\')}}","keyC":"valueC"'
+        'data': '{"keyA":"valueA","keyB":"{{config.get(\'custom.8df051be-4381-41b6-9252-120d9b558bf6\')}}","keyC":"valueC"}'
     }
 }
 
@@ -376,6 +377,14 @@ def data_manager(root, tmpdir):
 
 
 def test_load_from_path(root):
+    _conf = {
+        'ip': '127.0.0.1',
+        'mock.port': 9090,
+        'config.value.tojsonKey': ['custom.[a-z0-9]{8}(-[a-z0-9]{4}){3}-[a-z0-9]{12}'],
+        'custom.8df051be-4381-41b6-9252-120d9b558bf6': {"key": "value"}
+    }
+    application._cm = MockConfigManager(config=_conf)
+
     _dm = dm.DataManager()
     _dm.set_adapter(data_adapter)
     _dm.set_root(root)
@@ -388,6 +397,16 @@ def test_load_from_path(root):
     assert 'groupC-UUID' in _dm.id_map
 
 
+def test_load(data_manager):
+    data_manager.reload()
+    assert 'dataA-UUID' in data_manager.id_map
+    assert 'dataB-UUID' in data_manager.id_map
+    assert 'dataC-UUID' in data_manager.id_map
+    assert 'groupA-UUID' in data_manager.id_map
+    assert 'groupB-UUID' in data_manager.id_map
+    assert 'groupC-UUID' in data_manager.id_map
+
+
 def test_activate(data_manager):
     data_manager.activate('groupE-UUID')
     assert len(data_manager.activated_data) == 2
@@ -662,6 +681,14 @@ def test_conflict_checker(data_manager):
     assert len(conflict_rules) == 2
 
 
+def test_get_group_children(data_manager):
+    children = data_manager._get_group_children('groupF-UUID')
+    assert len(children) == 2
+
+    children = data_manager._get_group_children('groupG-UUID')
+    assert len(children) == 1
+
+
 def test_add_group(data_manager):
     new_group_id = data_manager.add_group({
         'name': 'root_group',
@@ -1007,6 +1034,10 @@ def test_prop_writer_with_dict_ignore_key(data_manager):
     prop_writer = dm.file_data_adapter.PropWriter()
     prop_writer.dict_ignore_key.update(data_manager.unsave_keys)
     prop_str = prop_writer.parse(data_manager.root)
+
+    pattern = r'{"id":"[0-9a-fA-F-]+","name":".Settings","type":"config","parent_id":"root"},\n  '
+    prop_str = re.sub(pattern, '', prop_str)
+
     assert prop_str == prop_str_correct
     new_prop = json.loads(prop_str)
     assert prop == new_prop
diff --git a/tests/test_dm_api.py b/tests/test_dm_api.py
index abfd22f50..f301d0033 100644
--- a/tests/test_dm_api.py
+++ b/tests/test_dm_api.py
@@ -87,6 +87,14 @@ def test_group_get_with_group_id(client):
     assert resp.json['code'] == 1000
 
 
+def test_group_get_children(client):
+    group_id = 'groupA-UUID'
+    resp = client.get(f'/api/group/{group_id}?childrenOnly=true')
+    assert resp.json['code'] == 1000
+    data = resp.json['data']
+    assert len(data) == 1
+
+
 def test_group_get_without_group_id(client):
     resp = client.get('/api/group')
     assert resp.json['code'] == 1000
diff --git a/tests/test_dm_config.py b/tests/test_dm_config.py
new file mode 100644
index 000000000..4cdcfb4e1
--- /dev/null
+++ b/tests/test_dm_config.py
@@ -0,0 +1,290 @@
+import re
+import pytest
+import codecs
+import json
+from copy import deepcopy
+import lyrebird
+from lyrebird.mock import dm
+from lyrebird.event import EventServer
+from lyrebird.config import ConfigManager
+from lyrebird.checker import LyrebirdCheckerServer
+from lyrebird.config import CONFIG_TREE_SHOW_CONFIG
+from lyrebird.mock.dm.file_data_adapter import data_adapter
+from lyrebird.mock.handlers.encoder_decoder_handler import EncoderDecoder
+from lyrebird import application
+
+
+data_a = {
+    'id': 'dataA-UUID',
+    'name': 'dataA',
+    'rule': {
+        'request.url': '/api/search'
+    },
+    'request': {
+        'url': 'http://unittest.com/api/search'
+    }
+}
+
+data_b = {
+    'id': 'dataB-UUID',
+    'name': '.Settings',
+    'json': '{\n    \"checker.switch\": {\n        \"checker_a.py\": true,\n        \"checker_b.py\": false\n    }\n}'
+}
+
+
+prop = {
+    'id': 'root',
+    'name': 'root',
+    'type': 'group',
+    'parent_id': None,
+    'children': [
+        {
+            'id': 'groupA-UUID',
+            'name': 'groupA',
+            'type': 'group',
+            'parent_id': 'root',
+            'children': [
+                {
+                    'id': 'dataA-UUID',
+                    'name': 'dataA',
+                    'type': 'data',
+                    'parent_id': 'groupA-UUID'
+                },
+                {
+                    'id': 'dataB-UUID',
+                    'name': '.Settings',
+                    'type': 'config',
+                    'parent_id': 'groupA-UUID'
+                },
+            ]
+        },
+        {
+            'id': 'groupB-UUID',
+            'name': 'groupC',
+            'type': 'group',
+            'parent_id': 'root',
+            'children': []
+        }
+    ]
+}
+
+
+class FakeSocketio:
+
+    def emit(self, event, *args, **kwargs): {
+        print(f'Send event {event} args={args} kw={kwargs}')
+    }
+
+
+@pytest.fixture
+def root(tmpdir):
+    with codecs.open(tmpdir / 'dataA-UUID', 'w') as f:
+        json.dump(data_a, f)
+    with codecs.open(tmpdir / 'dataB-UUID', 'w') as f:
+        json.dump(data_b, f)
+    with codecs.open(tmpdir / '.lyrebird_prop', 'w') as f:
+        json.dump(prop, f)
+    return tmpdir
+
+
+@pytest.fixture
+def data_manager(root, tmpdir):
+    application._cm = ConfigManager()
+    lyrebird.mock.context.application.socket_io = FakeSocketio()
+    application.encoders_decoders = EncoderDecoder()
+    _dm = dm.DataManager()
+    _dm.snapshot_workspace = tmpdir
+    _dm.set_adapter(data_adapter)
+    _dm.set_root(root)
+    return _dm
+
+
+
+CHECKER_A_FILENAME = 'checker_a.py'
+CHECKER_B_FILENAME = 'checker_b.py'
+CHECKER_A_SWITCH = False
+CHECKER_B_SWITCH = True
+
+CONTENT = u"from lyrebird import event\n@event('flow')\ndef test_func():\n\tpass"
+
+@pytest.fixture
+def checker_init(tmp_path, tmpdir):
+    config = {
+        'checker.workspace': tmp_path,
+        'checker.switch': {
+            CHECKER_A_FILENAME: CHECKER_A_SWITCH,
+            CHECKER_B_FILENAME: CHECKER_B_SWITCH
+        }
+    }
+
+    checker_a_file = tmp_path / CHECKER_A_FILENAME
+    checker_a_file.write_text(CONTENT)
+    checker_b_file = tmp_path / CHECKER_B_FILENAME
+    checker_b_file.write_text(CONTENT)
+
+    application._cm.config.update(config)
+
+    return application.checkers
+
+@pytest.fixture
+def checker_server(checker_init, tmp_path):
+    server = LyrebirdCheckerServer()
+    server.start()
+    server.SCRIPTS_DIR = tmp_path
+    application.server['checker'] = server
+    yield server
+    server.stop()
+
+
+@pytest.fixture
+def event_server():
+    server = EventServer()
+    application.server['event'] = server
+    yield server
+
+
+def test_mock_data_upgrade_2_14_to_2_15(data_manager):
+    prop_str_correct = '{"id":"root","name":"root","type":"group","parent_id":null,"children":[\n  {"id":"groupA-UUID","name":"groupA","type":"group","parent_id":"root","children":[\n    {"id":"dataA-UUID","name":"dataA","type":"data","parent_id":"groupA-UUID"}]},\n  {"id":"groupB-UUID","name":"groupC","type":"group","parent_id":"root","children":[]}]}'
+
+    prop_writer = dm.file_data_adapter.PropWriter()
+    prop_writer.dict_ignore_key.update(data_manager.unsave_keys)
+    prop_str = prop_writer.parse(data_manager.root)
+
+    assert prop_str == prop_str_correct
+
+    application._cm.config[CONFIG_TREE_SHOW_CONFIG] = True
+
+    data_manager.reload()
+
+    prop_str_correct_with_config = '{"id":"root","name":"root","type":"group","parent_id":null,"children":[\n  {"id":"*","name":".Settings","type":"config","parent_id":"root"},\n  {"id":"groupA-UUID","name":"groupA","type":"group","parent_id":"root","children":[\n    {"id":"dataB-UUID","name":".Settings","type":"config","parent_id":"groupA-UUID"},\n    {"id":"dataA-UUID","name":"dataA","type":"data","parent_id":"groupA-UUID"}]},\n  {"id":"groupB-UUID","name":"groupC","type":"group","parent_id":"root","children":[]}]}'
+    prop_writer = dm.file_data_adapter.PropWriter()
+    prop_writer.dict_ignore_key.update(data_manager.unsave_keys)
+    prop_writer.dict_ignore_child_key.add('link')
+    prop_str = prop_writer.parse(data_manager.root)
+
+    pattern = r'"id":"[0-9a-fA-F-]+","name":".Settings","type":"config","parent_id":"root"},\n  '
+    replacement = '"id":"*","name":".Settings","type":"config","parent_id":"root"},\n  '
+    prop_str = re.sub(pattern, replacement, prop_str)
+
+    assert prop_str == prop_str_correct_with_config
+
+
+def test_get_all_group_close_show_config(data_manager):
+    application._cm.config[CONFIG_TREE_SHOW_CONFIG] = False
+    data_manager.reload()
+    dm_root_child = set([c['id'] for c in data_manager.root['children']])
+    prop_root_child = set([c['id'] for c in prop['children']])
+    assert dm_root_child == prop_root_child
+
+    dm_group_a_child = set([c['id'] for c in data_manager.id_map['groupA-UUID']['children']])
+    prop_group_a_child = set([c['id'] for c in prop['children'][0]['children']])
+    assert dm_group_a_child == prop_group_a_child - set(['dataB-UUID'])
+
+
+def test_get_all_group_open_show_config(data_manager):
+    application._cm.config[CONFIG_TREE_SHOW_CONFIG] = True
+    data_manager.reload()
+
+    dm_root_children = data_manager.root['children']
+    dm_group_a_children = data_manager.id_map['groupA-UUID']['children']
+    dm_group_b_children = data_manager.id_map['groupB-UUID']['children']
+
+    prop_root_children = prop['children']
+    prop_gruop_a_children = prop_root_children[0]['children']
+    prop_gruop_b_children = prop_root_children[1]['children']
+
+    dm_child_id = set([c['id'] for c in dm_root_children])
+    prop_child_id = set([c['id'] for c in prop_root_children])
+    assert len(prop_child_id - dm_child_id) == 0
+    assert len(dm_child_id - prop_child_id) == 1
+
+    dm_child_id = set([c['id'] for c in dm_group_a_children])
+    prop_child_id = set([c['id'] for c in prop_gruop_a_children])
+    assert prop_child_id == dm_child_id
+
+    dm_child_id = set([c['id'] for c in dm_group_b_children])
+    prop_child_id = set([c['id'] for c in prop_gruop_b_children])
+    assert len(prop_child_id - dm_child_id) == 0
+    assert len(dm_child_id - prop_child_id) == 1
+
+    application._cm.config[CONFIG_TREE_SHOW_CONFIG] = False
+    data_manager.reload()
+
+    dm_root_children = data_manager.root['children']
+    dm_group_a_children = data_manager.id_map['groupA-UUID']['children']
+    dm_group_b_children = data_manager.id_map['groupB-UUID']['children']
+
+    prop_root_children = prop['children']
+    prop_gruop_a_children = prop_root_children[0]['children']
+    prop_gruop_b_children = prop_root_children[1]['children']
+
+    dm_child_id = set([c['id'] for c in dm_root_children])
+    prop_child_id = set([c['id'] for c in prop_root_children])
+    assert prop_child_id == dm_child_id
+
+    dm_child_id = set([c['id'] for c in dm_group_a_children])
+    prop_child_id = set([c['id'] for c in prop_gruop_a_children])
+    assert dm_child_id == prop_child_id - set(['dataB-UUID'])
+
+    dm_child_id = set([c['id'] for c in dm_group_b_children])
+    prop_child_id = set([c['id'] for c in prop_gruop_b_children])
+    assert prop_child_id == dm_child_id
+
+
+def test_get_group_children_close_show_config(data_manager):
+    children = data_manager._get_group_children('root')
+    assert len(children) == 2
+
+    children = data_manager._get_group_children('groupA-UUID')
+    assert len(children) == 2 - 1
+
+    children = data_manager._get_group_children('groupB-UUID')
+    assert len(children) == 0
+
+
+def test_get_group_children_open_show_config(data_manager):
+    application._cm.config[CONFIG_TREE_SHOW_CONFIG] = True
+
+    children = data_manager._get_group_children('root')
+    assert len(children) == 2 + 1
+
+    children = data_manager._get_group_children('groupA-UUID')
+    assert len(children) == 2
+
+    children = data_manager._get_group_children('groupB-UUID')
+    assert len(children) == 0 + 1
+
+    application._cm.config[CONFIG_TREE_SHOW_CONFIG] = False
+
+    children = data_manager._get_group_children('root')
+    assert len(children) == 2
+
+    children = data_manager._get_group_children('groupA-UUID')
+    assert len(children) == 2 - 1
+
+    children = data_manager._get_group_children('groupB-UUID')
+    assert len(children) == 0
+
+
+def test_add_config_name(data_manager):
+    application._cm.config[CONFIG_TREE_SHOW_CONFIG] = True
+    data_manager.reload()
+
+    group = data_manager.id_map['groupB-UUID']
+    config_id = group['children'][0]['id']
+    data = data_manager.id_map[config_id]
+
+    new_data = deepcopy(data)
+    new_data['name'] = 'dataB-new-name'
+    data_manager.update_data(config_id, new_data)
+
+    assert data_manager.id_map[config_id]['name'] == '.Settings'
+
+
+def test_activate_with_config_contains_extension(data_manager, event_server, checker_server):
+    assert application.checkers[CHECKER_A_FILENAME].activated  == False
+    assert application.checkers[CHECKER_B_FILENAME].activated == True
+    data_manager.activate('groupA-UUID')
+
+    assert application.checkers[CHECKER_A_FILENAME].activated  == True
+    assert application.checkers[CHECKER_B_FILENAME].activated == False