From bcc894ba98c69c3c00b5bbcc81d756fcf46e5ca1 Mon Sep 17 00:00:00 2001
From: pengzhanbo <volodymyr@foxmail.com>
Date: Fri, 29 Dec 2023 00:16:18 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E4=BC=98=E5=8C=96=E5=BC=80=E5=8F=91?=
 =?UTF-8?q?=E6=97=B6=E7=BC=96=E5=86=99md=E6=97=B6=E4=B8=80=E4=BA=9B?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=E7=9A=84=E7=83=AD=E6=9B=B4=E6=96=B0=E4=BA=A4?=
 =?UTF-8?q?=E4=BA=92?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 plugins/plugin-copy-code/package.json           |  4 ++--
 .../src/client/setupCopyCode.ts                 | 17 ++++++-----------
 theme/package.json                              | 11 ++++++-----
 theme/src/client/components/PageAside.vue       |  7 ++++++-
 theme/src/node/plugins.ts                       |  3 +++
 5 files changed, 23 insertions(+), 19 deletions(-)

diff --git a/plugins/plugin-copy-code/package.json b/plugins/plugin-copy-code/package.json
index 6ac38e16..733ee396 100644
--- a/plugins/plugin-copy-code/package.json
+++ b/plugins/plugin-copy-code/package.json
@@ -30,12 +30,12 @@
     "ts": "tsc -b tsconfig.build.json"
   },
   "dependencies": {
+    "@vuepress-plume/plugin-content-update": "workspace:*",
     "@vuepress/client": "2.0.0-rc.0",
     "@vuepress/core": "2.0.0-rc.0",
     "@vuepress/shared": "2.0.0-rc.0",
     "@vuepress/utils": "2.0.0-rc.0",
-    "vue": "^3.3.13",
-    "vue-router": "4.2.5"
+    "vue": "^3.3.13"
   },
   "publishConfig": {
     "access": "public"
diff --git a/plugins/plugin-copy-code/src/client/setupCopyCode.ts b/plugins/plugin-copy-code/src/client/setupCopyCode.ts
index 2ca7b951..18e5360c 100644
--- a/plugins/plugin-copy-code/src/client/setupCopyCode.ts
+++ b/plugins/plugin-copy-code/src/client/setupCopyCode.ts
@@ -1,5 +1,5 @@
-import { nextTick, onMounted, watch } from 'vue'
-import { usePageData } from '@vuepress/client'
+import { nextTick, onMounted } from 'vue'
+import { onContentUpdated } from '@vuepress-plume/plugin-content-update/client'
 import type { CopyCodeOptions } from '../shared/index.js'
 
 declare const __COPY_CODE_OPTIONS__: CopyCodeOptions
@@ -23,8 +23,6 @@ function sleep(ms: number): Promise<void> {
 }
 
 export function setupCopyCode(): void {
-  const page = usePageData()
-
   const insertBtn = (codeBlockEl: HTMLElement): void => {
     if (codeBlockEl.hasAttribute('has-copy-code'))
       return
@@ -92,13 +90,10 @@ export function setupCopyCode(): void {
     }
   })
 
-  watch(
-    () => page.value.path,
-    () => {
-      if (!isMobile() || options.showInMobile)
-        generateButton()
-    },
-  )
+  onContentUpdated(() => {
+    if (!isMobile() || options.showInMobile)
+      generateButton()
+  })
 }
 
 async function copyToClipboard(text: string) {
diff --git a/theme/package.json b/theme/package.json
index b221a64c..297b3f5c 100644
--- a/theme/package.json
+++ b/theme/package.json
@@ -48,6 +48,7 @@
     "@vuepress-plume/plugin-baidu-tongji": "workspace:*",
     "@vuepress-plume/plugin-blog-data": "workspace:*",
     "@vuepress-plume/plugin-caniuse": "workspace:*",
+    "@vuepress-plume/plugin-content-update": "workspace:*",
     "@vuepress-plume/plugin-copy-code": "workspace:*",
     "@vuepress-plume/plugin-iconify": "workspace:*",
     "@vuepress-plume/plugin-notes-data": "workspace:*",
@@ -74,11 +75,11 @@
     "ts-debounce": "^4.0.0",
     "vue": "^3.3.13",
     "vue-router": "4.2.5",
-    "vuepress-plugin-comment2": "2.0.0-rc.6",
-    "vuepress-plugin-md-enhance": "2.0.0-rc.6",
-    "vuepress-plugin-reading-time2": "2.0.0-rc.6",
-    "vuepress-plugin-seo2": "2.0.0-rc.6",
-    "vuepress-plugin-sitemap2": "2.0.0-rc.6"
+    "vuepress-plugin-comment2": "2.0.0-rc.7",
+    "vuepress-plugin-md-enhance": "2.0.0-rc.7",
+    "vuepress-plugin-reading-time2": "2.0.0-rc.7",
+    "vuepress-plugin-seo2": "2.0.0-rc.7",
+    "vuepress-plugin-sitemap2": "2.0.0-rc.7"
   },
   "devDependencies": {
     "@types/lodash.merge": "^4.6.9"
diff --git a/theme/src/client/components/PageAside.vue b/theme/src/client/components/PageAside.vue
index 04ae2b31..637de599 100644
--- a/theme/src/client/components/PageAside.vue
+++ b/theme/src/client/components/PageAside.vue
@@ -1,6 +1,7 @@
 <script lang="ts" setup>
 import { usePageData } from '@vuepress/client'
 import { computed, ref } from 'vue'
+import { onContentUpdated } from '@vuepress-plume/plugin-content-update/client'
 import { useActiveAnchor, useThemeLocaleData } from '../composables/index.js'
 import IconPrint from './icons/IconPrint.vue'
 import PageAsideItem from './PageAsideItem.vue'
@@ -8,9 +9,13 @@ import PageAsideItem from './PageAsideItem.vue'
 const page = usePageData()
 const theme = useThemeLocaleData()
 
-const headers = computed(() => page.value.headers)
+const headers = ref(page.value.headers)
 const hasOutline = computed(() => headers.value.length > 0)
 
+onContentUpdated(() => {
+  headers.value = page.value.headers
+})
+
 const container = ref()
 const marker = ref()
 
diff --git a/theme/src/node/plugins.ts b/theme/src/node/plugins.ts
index b7d70a41..e30d7311 100644
--- a/theme/src/node/plugins.ts
+++ b/theme/src/node/plugins.ts
@@ -22,6 +22,7 @@ import { type MarkdownEnhanceOptions, mdEnhancePlugin } from 'vuepress-plugin-md
 import { readingTimePlugin } from 'vuepress-plugin-reading-time2'
 import { seoPlugin } from 'vuepress-plugin-seo2'
 import { sitemapPlugin } from 'vuepress-plugin-sitemap2'
+import { contentUpdatePlugin } from '@vuepress-plume/plugin-content-update'
 import type {
   PlumeThemeLocaleOptions,
   PlumeThemePluginOptions,
@@ -85,6 +86,8 @@ export function setupPlugins(app: App, options: PlumeThemePluginOptions, localeO
 
     iconifyPlugin(),
 
+    contentUpdatePlugin(),
+
     activeHeaderLinksPlugin({
       headerLinkSelector: 'a.outline-link',
       headerAnchorSelector: '.header-anchor',