diff --git a/frontend/src/lib/Molstar.svelte b/frontend/src/lib/Molstar.svelte
index 6456c48e..3e5ddd28 100644
--- a/frontend/src/lib/Molstar.svelte
+++ b/frontend/src/lib/Molstar.svelte
@@ -1,5 +1,7 @@
 <script lang="ts">
+	import { onDestroy } from "svelte";
 	import { PDBeMolstarPlugin } from "../../venome-molstar/lib";
+	import { loseWebGLContext } from "./venomeMolstarUtils";
 
 	export let url = "";
 	export let format = "pdb";
@@ -7,11 +9,11 @@
 	export let binary = false;
 	export let width = 500;
 	export let height = 500;
+	let m: PDBeMolstarPlugin;
 
 	let divEl: HTMLDivElement;
 	async function render() {
-		// @ts-ignore
-		const m = new PDBeMolstarPlugin(); // loaded through app.html
+		m = new PDBeMolstarPlugin();
 		// some bs for the whole thing to rerender. TODO: fix this.
 		divEl.innerHTML = "";
 		const div = document.createElement("div");
@@ -33,6 +35,11 @@
 		});
 	}
 
+	onDestroy(() => {
+		loseWebGLContext(divEl.querySelector("canvas")!);
+		m.plugin.dispose();
+	});
+
 	$: {
 		if (url && divEl) {
 			render();