diff --git a/js-src/bootstrap.ts b/js-src/bootstrap.ts
deleted file mode 100644
index d834c76..0000000
--- a/js-src/bootstrap.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-// @ts-ignore
-import("./index.ts").catch(e => console.error("Error importing `index.ts`:", e));
diff --git a/js-src/index.ts b/js-src/index.ts
index 21b2187..909554e 100644
--- a/js-src/index.ts
+++ b/js-src/index.ts
@@ -1,10 +1,45 @@
 import { updateFileStatuses } from "./fileStatus";
-import { upload } from "./upload";
+import {ChecksumCalculator, upload} from "./upload";
+
+const wasmSupported = (() => {
+    try {
+        if (
+            typeof WebAssembly === "object" &&
+            typeof WebAssembly.instantiate === "function"
+        ) {
+            const module = new WebAssembly.Module(
+                Uint8Array.of(0x0, 0x61, 0x73, 0x6d, 0x01, 0x00, 0x00, 0x00)
+            );
+            if (module instanceof WebAssembly.Module)
+                return (
+                    new WebAssembly.Instance(module) instanceof
+                    WebAssembly.Instance
+                );
+        }
+    } catch (e) {}
+    return false;
+})();
 
 window.onload = function() {
+    if (wasmSupported) {
+        // @ts-ignore
+        import("@nationalarchives/checksum-calculator")
+            .then(checksumModule => {
+                renderModules(checksumModule);
+            })
+            .catch(e => {
+                console.error("Error importing checksum module:", e);
+                renderModules()
+            });
+    } else {
+        renderModules();
+    }
+};
+
+const renderModules = (checksumCalculator?: ChecksumCalculator) => {
     const uploadContainer: HTMLDivElement | null = document.querySelector(".upload-form");
     if (uploadContainer) {
-        upload();
+        upload(checksumCalculator);
     }
     const fileStatusContainer: HTMLDivElement | null = document.querySelector(".file-status");
     if (fileStatusContainer) {
diff --git a/js-src/upload/index.ts b/js-src/upload/index.ts
index bb5896a..7f41b7f 100644
--- a/js-src/upload/index.ts
+++ b/js-src/upload/index.ts
@@ -1,8 +1,11 @@
 import Axios from "axios";
 import * as S3 from "aws-sdk/clients/s3";
-import * as wasm from "@nationalarchives/checksum-calculator";
 import { generateHash } from "./checksum";
 
+export interface ChecksumCalculator {
+    generate_checksum(blob: any): any;
+}
+
 interface HTMLInputTarget extends EventTarget {
     files?: InputElement;
 }
@@ -36,26 +39,7 @@ export interface IWebkitEntry extends DataTransferItem {
     file: (success: (file: File) => void) => void;
 }
 
-const wasmSupported = (() => {
-    try {
-        if (
-            typeof WebAssembly === "object" &&
-            typeof WebAssembly.instantiate === "function"
-        ) {
-            const module = new WebAssembly.Module(
-                Uint8Array.of(0x0, 0x61, 0x73, 0x6d, 0x01, 0x00, 0x00, 0x00)
-            );
-            if (module instanceof WebAssembly.Module)
-                return (
-                    new WebAssembly.Instance(module) instanceof
-                    WebAssembly.Instance
-                );
-        }
-    } catch (e) {}
-    return false;
-})();
-
-const upload: () => void = () => {
+const upload: (checksumCalculator?: ChecksumCalculator) => void = (checksumCalculator) => {
     const uploadForm: HTMLFormElement | null = document.querySelector(
         "#file-upload-form"
     );
@@ -68,7 +52,7 @@ const upload: () => void = () => {
             ev.preventDefault();
             const target: HTMLInputTarget | null = ev.currentTarget;
             const files: TdrFile[] = target!.files!.files!;
-            processFiles(files)
+            processFiles(files, checksumCalculator)
                 .then(() => {
                     if (commenceUploadForm) {
                         commenceUploadForm.submit();
@@ -87,9 +71,25 @@ const upload: () => void = () => {
                 });
         });
     }
+
+    const onDrop: (e: DragEvent) => void = async e => {
+        e.preventDefault();
+        e.stopPropagation();
+        setIsDragging(false);
+        const dataTransferItems: DataTransferItemList = e.dataTransfer!.items;
+
+        //Assume one folder in the drag and drop for now
+        const files: TdrFile[] = await getAllFiles(
+            dataTransferItems[0].webkitGetAsEntry(),
+            []
+        );
+        processFiles(files, checksumCalculator);
+    };
+
     const dragAndDrop: HTMLDivElement | null = document.querySelector(
         ".govuk-file-drop"
     );
+
     if (dragAndDrop) {
         dragAndDrop.ondragover = onDragOver;
         dragAndDrop.ondragleave = () => setIsDragging(false);
@@ -168,26 +168,13 @@ const getAllFiles: (
     return fileInfoInput;
 };
 
-const onDrop: (e: DragEvent) => void = async e => {
-    e.preventDefault();
-    e.stopPropagation();
-    setIsDragging(false);
-    const dataTransferItems: DataTransferItemList = e.dataTransfer!.items;
-
-    //Assume one folder in the drag and drop for now
-    const files: TdrFile[] = await getAllFiles(
-        dataTransferItems[0].webkitGetAsEntry(),
-        []
-    );
-    processFiles(files);
-};
-
 const getFileInfo: (
-    tdrFile: TdrFile
-) => Promise<CreateFileInput> = async tdrFile => {
+    tdrFile: TdrFile,
+    checksumCalculator?: ChecksumCalculator
+) => Promise<CreateFileInput> = async (tdrFile, checksumCalculator) => {
     let clientSideChecksum;
-    if (wasmSupported) {
-        clientSideChecksum = await wasm.generate_checksum(tdrFile);
+    if (checksumCalculator) {
+        clientSideChecksum = await checksumCalculator.generate_checksum(tdrFile);
     } else {
         clientSideChecksum = await generateHash(tdrFile);
     }
@@ -248,7 +235,7 @@ function uploadFileData(batches: CreateFileInput[][], consignmentId: number) {
     return Promise.all(responses);
 }
 
-async function processFiles(files: TdrFile[]) {
+async function processFiles(files: TdrFile[], checksumCalculator?: ChecksumCalculator) {
     const fileInfoList: CreateFileInput[] = [];
     const urlParams: URLSearchParams = new URLSearchParams(
         window.location.search
@@ -266,7 +253,7 @@ async function processFiles(files: TdrFile[]) {
                 console.log(`Got file info for ${fileInfoCount} files`);
             }
 
-            const fileInfo: CreateFileInput = await getFileInfo(tdrFile);
+            const fileInfo: CreateFileInput = await getFileInfo(tdrFile, checksumCalculator);
 
             fileInfoList.push(fileInfo);
             filePathToFile[fileInfo.path!] = tdrFile;
diff --git a/webpack.config.js b/webpack.config.js
index cd42570..d3b598c 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -2,7 +2,7 @@ const path = require('path');
 const webpack = require('webpack');
 
 module.exports = {
-  entry: './js-src/bootstrap.ts',
+  entry: './js-src/index.ts',
   output: {
     filename: 'main.js',
     path: path.resolve(__dirname, 'public/javascripts'),