diff --git a/web-vis/www/src/app.js b/web-vis/www/src/app.js
index c4050bc1f..5ea57e875 100644
--- a/web-vis/www/src/app.js
+++ b/web-vis/www/src/app.js
@@ -1,5 +1,6 @@
 import "./styles.css";
-import { WasmDecorator, VectorVis } from "./vector";
+import { VectorVis, Vector } from "./vector";
+import { WasmDecorator } from "./wasm";
 
 class VectorComponent extends HTMLElement {
   constructor(vectorVis) {
@@ -263,7 +264,10 @@ const addVectorToGrid = (vector, nextSibling) => {
 };
 
 const addVector = (button) => {
-  const vector = wasmDecorator.add(64);
+  const vecId = wasmDecorator.pushVec();
+  const vector = new Vector(vecId, wasmDecorator);
+  vector.setSize(64);
+
   addVectorToGrid(vector, button);
 };
 addVectorButton.onClick = addVector;
diff --git a/web-vis/www/src/vector.js b/web-vis/www/src/vector.js
index 05ef8cf9c..6d0530826 100644
--- a/web-vis/www/src/vector.js
+++ b/web-vis/www/src/vector.js
@@ -1,54 +1,4 @@
 import { RrbVec } from "./rrbvec.js";
-import * as wasm from "web-vis";
-
-export class WasmDecorator {
-  constructor(listener) {
-    this.listener = listener;
-  }
-
-  add(initialSize) {
-    const vecId = wasm.len();
-    wasm.push_vec();
-
-    const vector = new Vector(vecId, this);
-    if (initialSize !== undefined) {
-      vector.setSize(initialSize);
-    }
-
-    this.listener();
-
-    return vector;
-  }
-
-  setSize(id, size) {
-    wasm.set_vec_size(id, size);
-    this.listener();
-  }
-
-  splitOffVec(id, index) {
-    const other = wasm.split_off_vec(id, index);
-    this.listener();
-
-    return other;
-  }
-
-  getVecSize(id) {
-    return wasm.get_vec_size(id);
-  }
-
-  get(id) {
-    return wasm.get(id);
-  }
-
-  concatenatAll() {
-    wasm.concatenat_all();
-    this.listener();
-  }
-
-  len() {
-    return wasm.len();
-  }
-}
 
 export class Vector {
   constructor(id, wasmDecorator) {
@@ -61,7 +11,7 @@ export class Vector {
   }
 
   setSize(size) {
-    this.wasmDecorator.setSize(this._id, size);
+    this.wasmDecorator.setVecSize(this._id, size);
   }
 
   splitAt(index) {
diff --git a/web-vis/www/src/wasm.js b/web-vis/www/src/wasm.js
new file mode 100644
index 000000000..94971046a
--- /dev/null
+++ b/web-vis/www/src/wasm.js
@@ -0,0 +1,45 @@
+import * as wasm from "web-vis";
+
+export class WasmDecorator {
+  constructor(listener) {
+    this.listener = listener;
+  }
+
+  pushVec() {
+    const vecId = wasm.len();
+
+    wasm.push_vec();
+    this.listener();
+
+    return vecId;
+  }
+
+  setVecSize(id, size) {
+    wasm.set_vec_size(id, size);
+    this.listener();
+  }
+
+  splitOffVec(id, index) {
+    const other = wasm.split_off_vec(id, index);
+    this.listener();
+
+    return other;
+  }
+
+  concatenatAll() {
+    wasm.concatenat_all();
+    this.listener();
+  }
+
+  getVecSize(id) {
+    return wasm.get_vec_size(id);
+  }
+
+  get(id) {
+    return wasm.get(id);
+  }
+
+  len() {
+    return wasm.len();
+  }
+}