diff --git a/src/components/Simulation.tsx b/src/components/Simulation.tsx
index b24bf81..ec67052 100644
--- a/src/components/Simulation.tsx
+++ b/src/components/Simulation.tsx
@@ -10,6 +10,10 @@ import vertexShader from '../shaders/vert.glsl';
 import fragmentShader from '../shaders/frag.glsl';
 import { OutgoingMessage } from '../workers/modelWorkerMessage';
 
+// WebGPU imports
+import { default as WebGPU } from 'three/addons/capabilities/WebGPU.js';
+import { default as WebGPURenderer } from 'three/addons/renderers/webgpu/WebGPURenderer.js';
+
 class SimulationParams {
   // render options
   densityLowColour: t.Color = new t.Color('blue');
@@ -60,6 +64,15 @@ function DiffusionPlane(
 ): React.ReactElement {
   // INITIALISATION
 
+  // WebGPU capability test
+  if (WebGPU.isAvailable() === true) {
+    const webgpuRenderer = new WebGPURenderer({ antialias: true });
+    console.log('browser supports webgpu rendering');
+    console.log('webgpu renderer context', webgpuRenderer);
+  } else {
+    console.log('browser does not support webgpu rendering');
+  }
+
   // reference to the parent mesh
   const ref = useRef<t.Mesh>(null!);
 
diff --git a/src/declaration.d.ts b/src/declaration.d.ts
index 2b885ea..ec9487d 100644
--- a/src/declaration.d.ts
+++ b/src/declaration.d.ts
@@ -6,3 +6,15 @@ declare module '*.md' {
   const html: string;
   export default html;
 }
+
+declare module 'three/addons/capabilities/WebGPU.js' {
+  export default class WebGPU {
+    static isAvailable(): boolean;
+    static getErrorMessage(): HTMLDivElement;
+  }
+}
+declare module 'three/addons/renderers/webgpu/WebGPURenderer.js' {
+  export default class WebGPURenderer {
+    constructor(parameters: object);
+  }
+}
diff --git a/tsconfig.json b/tsconfig.json
index 4e6fea0..96143ed 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,8 +1,8 @@
 {
   "compilerOptions": {
-    "target": "ES2020",
+    "target": "ESNext",
     "useDefineForClassFields": true,
-    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "lib": ["ESNext", "DOM", "DOM.Iterable"],
     "module": "ESNext",
     "skipLibCheck": true,
     "types": [
diff --git a/vite.config.ts b/vite.config.ts
index 9194679..00b4960 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -13,4 +13,12 @@ export default defineConfig({
       rehypePlugins: [rehypeSanitize],
     }),
   ],
+  optimizeDeps: {
+    esbuildOptions: {
+      target: 'esnext',
+    },
+  },
+  build: {
+    target: 'esnext',
+  },
 });