diff --git a/src/components/AvatarView.svelte b/src/components/AvatarView.svelte
index 6db6f9e..0e5da02 100644
--- a/src/components/AvatarView.svelte
+++ b/src/components/AvatarView.svelte
@@ -2,8 +2,7 @@
 	import {
 		App,
 		MarkdownPostProcessorContext,
-		MarkdownRenderer,
-		MarkdownView,
+		MarkdownRenderer, MarkdownView,
 		TFile
 	} from "obsidian";
 	import Fab from "./Fab.svelte";
@@ -11,6 +10,7 @@
 	import type {SetState, State} from "../core/stateProviders";
 	import {SelectImageModal} from "./SelectImageModal";
 	import {AvatarPlugin} from "../plugin";
+	import {onMount} from "svelte";
 
 	interface AvatarViewState {
 		image: string;
@@ -29,12 +29,20 @@
 	let descriptionEditEl: HTMLElement;
 	let descriptionPreviewEl: HTMLElement;
 
-	$: inSourceMode = app ? isSourceMode(app) : false;
+	let inSourceMode = false;
 	$: fallbackImage = `https://ui-avatars.com/api/?name=${ctx?.sourcePath.split("/").at(-1) ?? "::"}&size=240`;
 
-	function isSourceMode(app: App) {
-		const view = app.workspace.getMostRecentLeaf()?.view as MarkdownView;
-		return view?.getMode() === "source";
+	onMount(() => {
+		inSourceMode = isSourceMode();
+		let x = app.workspace.on("layout-change", () => {
+			inSourceMode = isSourceMode();
+		});
+		return () => app.workspace.offref(x);
+	});
+
+	function isSourceMode() {
+		const view = app.workspace.getActiveViewOfType(MarkdownView);
+		return view?.getMode?.() === "source";
 	}
 
 	function enterEditMode() {
diff --git a/src/core/renderCodeBlockProcessor.ts b/src/core/renderCodeBlockProcessor.ts
index 97a4f1c..0d623ba 100644
--- a/src/core/renderCodeBlockProcessor.ts
+++ b/src/core/renderCodeBlockProcessor.ts
@@ -1,6 +1,7 @@
 import type {App, MarkdownPostProcessorContext, Plugin} from "obsidian";
 import type {SvelteComponent} from "svelte";
 import type {StateProvider} from "./stateProviders";
+import {MarkdownRenderChild} from "obsidian";
 
 export interface CodeBlockProcessorProps extends Record<string, any> {
 	app: App;
@@ -20,7 +21,7 @@ export function renderCodeBlockProcessor<S>(
 ) {
 	return (source: string, containerEl: HTMLElement, ctx: MarkdownPostProcessorContext) => {
 		const node = containerEl.createEl("div");
-		new component({
+		const svelteComponent = new component({
 			target: containerEl,
 			props: {
 				...props,
@@ -28,5 +29,13 @@ export function renderCodeBlockProcessor<S>(
 				ctx
 			}
 		});
+
+		class UnloadSvelteComponent extends MarkdownRenderChild {
+			onunload() {
+				svelteComponent.$destroy();
+			}
+		}
+
+		ctx.addChild(new UnloadSvelteComponent(node));
 	}
 }