diff --git a/packages/client/composables/useViewTransition.ts b/packages/client/composables/useViewTransition.ts
index 8d0d7b4fea..bd1054508b 100644
--- a/packages/client/composables/useViewTransition.ts
+++ b/packages/client/composables/useViewTransition.ts
@@ -1,5 +1,6 @@
 import { ref } from 'vue'
 import { useRouter } from 'vue-router'
+import { getSlide } from '../logic/nav'
 
 export function useViewTransition() {
   const router = useRouter()
@@ -11,13 +12,15 @@ export function useViewTransition() {
   const supportViewTransition = typeof document !== 'undefined' && 'startViewTransition' in document
 
   router.beforeResolve((to, from) => {
-    const fromNo = from.meta.slide?.no
-    const toNo = to.meta.slide?.no
+    const fromMeta = getSlide(from.params.no as string)?.meta
+    const toMeta = getSlide(to.params.no as string)?.meta
+    const fromNo = fromMeta?.slide?.no
+    const toNo = toMeta?.slide?.no
     if (
       !(
         fromNo !== undefined && toNo !== undefined && (
-          (from.meta.transition === 'view-transition' && fromNo < toNo)
-          || (to.meta.transition === 'view-transition' && toNo < fromNo)
+          (fromMeta?.transition === 'view-transition' && fromNo < toNo)
+          || (toMeta?.transition === 'view-transition' && toNo < fromNo)
         )
       )
     ) {
diff --git a/packages/client/internals/PrintSlideClick.vue b/packages/client/internals/PrintSlideClick.vue
index 3233d1e55e..49dd1101d1 100644
--- a/packages/client/internals/PrintSlideClick.vue
+++ b/packages/client/internals/PrintSlideClick.vue
@@ -5,7 +5,7 @@ import { injectionSlidevContext } from '../constants'
 import { configs, slideHeight, slideWidth } from '../env'
 import { getSlideClass } from '../utils'
 import type { SlidevContextNav } from '../composables/useNav'
-import SlideWrapper from './SlideWrapper'
+import SlideWrapper from './SlideWrapper.vue'
 
 import GlobalTop from '#slidev/global-components/top'
 import GlobalBottom from '#slidev/global-components/bottom'
diff --git a/packages/client/internals/QuickOverview.vue b/packages/client/internals/QuickOverview.vue
index a57abffb7b..dfcce221d3 100644
--- a/packages/client/internals/QuickOverview.vue
+++ b/packages/client/internals/QuickOverview.vue
@@ -8,7 +8,7 @@ import { useFixedClicks } from '../composables/useClicks'
 import { getSlideClass } from '../utils'
 import { CLICKS_MAX } from '../constants'
 import SlideContainer from './SlideContainer.vue'
-import SlideWrapper from './SlideWrapper'
+import SlideWrapper from './SlideWrapper.vue'
 import DrawingPreview from './DrawingPreview.vue'
 import IconButton from './IconButton.vue'
 
diff --git a/packages/client/internals/SlideWrapper.ts b/packages/client/internals/SlideWrapper.ts
deleted file mode 100644
index b751f46984..0000000000
--- a/packages/client/internals/SlideWrapper.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-import { computed, defineAsyncComponent, defineComponent, h, ref, toRef } from 'vue'
-import type { PropType } from 'vue'
-import { provideLocal } from '@vueuse/core'
-import type { ClicksContext, RenderContext, SlideRoute } from '@slidev/types'
-import { injectionActive, injectionClicksContext, injectionCurrentPage, injectionRenderContext, injectionRoute } from '../constants'
-import SlideLoading from './SlideLoading.vue'
-
-export default defineComponent({
-  name: 'SlideWrapper',
-  props: {
-    clicksContext: {
-      type: Object as PropType<ClicksContext>,
-      required: true,
-    },
-    renderContext: {
-      type: String,
-      default: 'main',
-    },
-    active: {
-      type: Boolean,
-      default: false,
-    },
-    is: {
-      required: true,
-    },
-    route: {
-      type: Object as PropType<SlideRoute>,
-      required: true,
-    },
-  },
-  setup(props) {
-    provideLocal(injectionRoute, props.route)
-    provideLocal(injectionCurrentPage, ref(props.route.no))
-    provideLocal(injectionRenderContext, ref(props.renderContext as RenderContext))
-    provideLocal(injectionActive, toRef(props, 'active'))
-    provideLocal(injectionClicksContext, toRef(props, 'clicksContext'))
-
-    const style = computed(() => {
-      const zoom = props.route.meta?.slide?.frontmatter.zoom ?? 1
-      return zoom === 1
-        ? undefined
-        : {
-            width: `${100 / zoom}%`,
-            height: `${100 / zoom}%`,
-            transformOrigin: 'top left',
-            transform: `scale(${zoom})`,
-          }
-    })
-
-    const SlideComponent = defineAsyncComponent({
-      loader: (props.is as any),
-      delay: 300,
-      loadingComponent: SlideLoading,
-    })
-
-    return () => h(SlideComponent, { style: style.value })
-  },
-})
diff --git a/packages/client/internals/SlideWrapper.vue b/packages/client/internals/SlideWrapper.vue
new file mode 100644
index 0000000000..a6a999ffc9
--- /dev/null
+++ b/packages/client/internals/SlideWrapper.vue
@@ -0,0 +1,64 @@
+<script setup lang="ts">
+import { computed, defineAsyncComponent, ref, toRef } from 'vue'
+import type { PropType } from 'vue'
+import { provideLocal } from '@vueuse/core'
+import type { ClicksContext, RenderContext, SlideRoute } from '@slidev/types'
+import { injectionActive, injectionClicksContext, injectionCurrentPage, injectionRenderContext, injectionRoute } from '../constants'
+import SlideLoading from './SlideLoading.vue'
+
+const props = defineProps({
+  clicksContext: {
+    type: Object as PropType<ClicksContext>,
+    required: true,
+  },
+  renderContext: {
+    type: String as PropType<RenderContext>,
+    default: 'slide',
+  },
+  active: {
+    type: Boolean,
+    default: false,
+  },
+  is: {
+    required: true,
+  },
+  route: {
+    type: Object as PropType<SlideRoute>,
+    required: true,
+  },
+})
+
+provideLocal(injectionRoute, props.route)
+provideLocal(injectionCurrentPage, ref(props.route.no))
+provideLocal(injectionRenderContext, ref(props.renderContext as RenderContext))
+provideLocal(injectionActive, toRef(props, 'active'))
+provideLocal(injectionClicksContext, toRef(props, 'clicksContext'))
+
+const style = computed(() => {
+  const zoom = props.route.meta?.slide?.frontmatter.zoom ?? 1
+  return zoom === 1
+    ? undefined
+    : {
+        width: `${100 / zoom}%`,
+        height: `${100 / zoom}%`,
+        transformOrigin: 'top left',
+        transform: `scale(${zoom})`,
+      }
+})
+
+const SlideComponent = defineAsyncComponent({
+  loader: (props.is as any),
+  delay: 300,
+  loadingComponent: SlideLoading,
+})
+</script>
+
+<template>
+  <component :is="SlideComponent" :style="style" :class="{ 'disable-view-transition': !['slide', 'presenter'].includes(props.renderContext) }" />
+</template>
+
+<style scoped>
+.disable-view-transition:deep(*) {
+  view-transition-name: none !important;
+}
+</style>
diff --git a/packages/client/internals/SlidesShow.vue b/packages/client/internals/SlidesShow.vue
index 9a7ec32952..a4cad50fa1 100644
--- a/packages/client/internals/SlidesShow.vue
+++ b/packages/client/internals/SlidesShow.vue
@@ -5,7 +5,7 @@ import { getSlideClass } from '../utils'
 import { useViewTransition } from '../composables/useViewTransition'
 import { skipTransition } from '../composables/hmr'
 import { usePrimaryClicks } from '../composables/useClicks'
-import SlideWrapper from './SlideWrapper'
+import SlideWrapper from './SlideWrapper.vue'
 import PresenterMouse from './PresenterMouse.vue'
 
 import GlobalTop from '#slidev/global-components/top'
diff --git a/packages/client/pages/overview.vue b/packages/client/pages/overview.vue
index 34cf522ec7..83a9400313 100644
--- a/packages/client/pages/overview.vue
+++ b/packages/client/pages/overview.vue
@@ -8,7 +8,7 @@ import { useFixedClicks } from '../composables/useClicks'
 import { isColorSchemaConfigured, isDark, toggleDark } from '../logic/dark'
 import { getSlideClass } from '../utils'
 import SlideContainer from '../internals/SlideContainer.vue'
-import SlideWrapper from '../internals/SlideWrapper'
+import SlideWrapper from '../internals/SlideWrapper.vue'
 import DrawingPreview from '../internals/DrawingPreview.vue'
 import IconButton from '../internals/IconButton.vue'
 import NoteEditable from '../internals/NoteEditable.vue'
diff --git a/packages/client/pages/presenter.vue b/packages/client/pages/presenter.vue
index 7fd4f8fda1..a3e4e809e9 100644
--- a/packages/client/pages/presenter.vue
+++ b/packages/client/pages/presenter.vue
@@ -12,7 +12,7 @@ import { getSlideClass } from '../utils'
 import { useTimer } from '../logic/utils'
 import { isDrawing } from '../logic/drawings'
 import { useFixedClicks, usePrimaryClicks } from '../composables/useClicks'
-import SlideWrapper from '../internals/SlideWrapper'
+import SlideWrapper from '../internals/SlideWrapper.vue'
 import SlideContainer from '../internals/SlideContainer.vue'
 import NavControls from '../internals/NavControls.vue'
 import QuickOverview from '../internals/QuickOverview.vue'