diff --git a/www/worker/app-worker.less b/www/worker/app-worker.less
new file mode 100644
index 000000000..c21879f4f
--- /dev/null
+++ b/www/worker/app-worker.less
@@ -0,0 +1,40 @@
+@import (once) "../../customize/src/less2/include/browser.less";
+@import (once) "../../customize/src/less2/include/toolbar.less";
+@import (once) "../../customize/src/less2/include/markdown.less";
+@import (once) '../../customize/src/less2/include/fileupload.less';
+@import (once) '../../customize/src/less2/include/alertify.less';
+//@import (once) '../../customize/src/less/mixins.less';
+//@import (once) '../../customize/src/less/variables.less";
+
+@import (once) '../../customize/src/less2/include/avatar.less';
+
+
+.toolbar_main();
+.fileupload_main();
+.alertify_main();
+
+// body
+&.cp-app-worker {
+    display: flex;
+    flex-flow: column;
+
+    #cp-toolbar {
+        display: flex; // We need this to remove a 3px border at the bottom of the toolbar
+    }
+
+    .cp-cryptpad-toolbar {
+        padding: 0px;
+        display: inline-block;
+    }
+
+    #cp-app-worker-container {
+        display: flex;
+        flex: 1;
+        flex-flow: column;
+        padding: 20px;
+        align-items: center;
+        background-color: lighten(@colortheme_todo-bg, 15%);
+        min-height: 0;
+    }
+}
+
diff --git a/www/worker/index.html b/www/worker/index.html
new file mode 100644
index 000000000..e3f7eacc4
--- /dev/null
+++ b/www/worker/index.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>CryptPad</title>
+    <meta content="text/html; charset=utf-8" http-equiv="content-type"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="referrer" content="no-referrer" />
+    <script async data-bootload="main.js" data-main="/common/boot.js?ver=1.0" src="/bower_components/requirejs/require.js?ver=2.3.5"></script>
+    <style>
+        html, body {
+            margin: 0px;
+            padding: 0px;
+        }
+        #sbox-iframe {
+            position:fixed;
+            top:0px;
+            left:0px;
+            bottom:0px;
+            right:0px;
+            width:100%;
+            height:100%;
+            border:none;
+            margin:0;
+            padding:0;
+            overflow:hidden;
+        }
+        #sbox-filePicker-iframe {
+            position: fixed;
+            top:0; left:0;
+            bottom:0; right:0;
+            width:100%;
+            height: 100%;
+            border: 0;
+        }
+    </style>
+</head>
+<body>
+<iframe id="sbox-iframe">
diff --git a/www/worker/inner.html b/www/worker/inner.html
new file mode 100644
index 000000000..e01d19558
--- /dev/null
+++ b/www/worker/inner.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html class="cp-app-noscroll">
+<head>
+    <meta content="text/html; charset=utf-8" http-equiv="content-type"/>
+    <script async data-bootload="/worker/inner.js" data-main="/common/sframe-boot.js?ver=1.4" src="/bower_components/requirejs/require.js?ver=2.3.5"></script>
+    <style>
+        .loading-hidden { display: none; }
+    </style>
+</head>
+<body class="cp-app-worker">
+    <div id="cp-toolbar" class="cp-toolbar-container"></div>
+    <div id="cp-app-worker-container">
+        Hello world!
+    </div>
+</body>
+
diff --git a/www/worker/inner.js b/www/worker/inner.js
new file mode 100644
index 000000000..fd9c9ef34
--- /dev/null
+++ b/www/worker/inner.js
@@ -0,0 +1,68 @@
+define([
+    'jquery',
+    '/common/toolbar3.js',
+    '/common/cryptpad-common.js',
+    '/bower_components/nthen/index.js',
+    '/common/sframe-common.js',
+
+    'css!/bower_components/bootstrap/dist/css/bootstrap.min.css',
+    'less!/bower_components/components-font-awesome/css/font-awesome.min.css',
+    'less!/customize/src/less2/main.less',
+], function (
+    $,
+    Toolbar,
+    Cryptpad,
+    nThen,
+    SFCommon,
+    )
+{
+    var Messages = Cryptpad.Messages;
+    var APP = window.APP = {};
+
+    var common;
+    var sFrameChan;
+    nThen(function (waitFor) {
+        $(waitFor(Cryptpad.addLoadingScreen));
+        SFCommon.create(waitFor(function (c) { APP.common = common = c; }));
+    }).nThen(function (waitFor) {
+        sFrameChan = common.getSframeChannel();
+        sFrameChan.onReady(waitFor());
+    }).nThen(function (/*waitFor*/) {
+        var $body = $('body');
+        var $container = $('#cp-app-worker-container');
+        var $bar = $('.cp-toolbar-container');
+
+        var displayed = ['useradmin', 'newpad', 'limit', 'pageTitle'];
+        var configTb = {
+            displayed: displayed,
+            common: Cryptpad,
+            sfCommon: common,
+            $container: $bar,
+            pageTitle: 'Test WebWorkers',
+            metadataMgr: common.getMetadataMgr(),
+        };
+        APP.toolbar = Toolbar.create(configTb);
+        APP.toolbar.$rightside.hide();
+
+        Cryptpad.removeLoadingScreen();
+        if (!window.Worker) {
+            return void $container.text("WebWorkers not supported by your browser");
+        }
+        console.log('ready');
+        var myWorker = new SharedWorker('/worker/worker.js');
+        console.log(myWorker);
+        console.log(myWorker.port);
+        myWorker.onerror = function (e) { console.error(e); };
+        myWorker.port.onmessage = function (e) {
+            var data = e.data;
+            if (data && data.state === "READY") {
+                $container.append('<hr>worker.js ready');
+                myWorker.port.postMessage(["Hello worker"]);
+                return;
+            }
+            $container.append('<br>');
+            $container.append(e.data);
+        };
+        $container.append('<hr>inner.js ready');
+    });
+});
diff --git a/www/worker/main.js b/www/worker/main.js
new file mode 100644
index 000000000..d635e438a
--- /dev/null
+++ b/www/worker/main.js
@@ -0,0 +1,43 @@
+// Load #1, load as little as possible because we are in a race to get the loading screen up.
+define([
+    '/bower_components/nthen/index.js',
+    '/api/config',
+    'jquery',
+    '/common/requireconfig.js',
+    '/common/sframe-common-outer.js'
+], function (nThen, ApiConfig, $, RequireConfig, SFCommonO) {
+    var requireConfig = RequireConfig();
+
+    // Loaded in load #2
+    nThen(function (waitFor) {
+        $(waitFor());
+    }).nThen(function (waitFor) {
+        var req = {
+            cfg: requireConfig,
+            req: [ '/common/loading.js' ],
+            pfx: window.location.origin
+        };
+        window.rc = requireConfig;
+        window.apiconf = ApiConfig;
+        $('#sbox-iframe').attr('src',
+            ApiConfig.httpSafeOrigin + '/worker/inner.html?' + requireConfig.urlArgs +
+                '#' + encodeURIComponent(JSON.stringify(req)));
+
+        // This is a cheap trick to avoid loading sframe-channel in parallel with the
+        // loading screen setup.
+        var done = waitFor();
+        var onMsg = function (msg) {
+            var data = JSON.parse(msg.data);
+            if (data.q !== 'READY') { return; }
+            window.removeEventListener('message', onMsg);
+            var _done = done;
+            done = function () { };
+            _done();
+        };
+        window.addEventListener('message', onMsg);
+    }).nThen(function (/*waitFor*/) {
+        SFCommonO.start({
+            noRealtime: true,
+        });
+    });
+});
diff --git a/www/worker/messages.js b/www/worker/messages.js
new file mode 100644
index 000000000..244d2597e
--- /dev/null
+++ b/www/worker/messages.js
@@ -0,0 +1,7 @@
+define(function () {
+    var out = {};
+
+    out.test = "Key from /worker/messages.js";
+
+    return out;
+});
diff --git a/www/worker/todo.js b/www/worker/todo.js
new file mode 100644
index 000000000..07b9962cc
--- /dev/null
+++ b/www/worker/todo.js
@@ -0,0 +1,80 @@
+define([
+
+], function () {
+    var Todo = {};
+
+/*  data model
+{
+  "order": [
+    "123456789abcdef0",
+    "23456789abcdef01",
+    "0123456789abcedf"
+  ],
+  "data": {
+    "0123456789abcedf": {
+      "state": 0, // used to sort completed elements
+      "task": "pewpewpew",
+      "ctime": +new Date(), // used to display chronologically
+      "mtime": +new Date(), // used to display recent actions
+      // "deadline": +new Date() + 1000 * 60 * 60 * 24 * 7
+    },
+    "123456789abcdef0": {},
+    "23456789abcdef01": {}
+  }
+}
+*/
+
+    var val = function (proxy, id, k, v) {
+        var el = proxy.data[id];
+        if (!el) {
+            throw new Error('expected an element');
+        }
+        if (typeof(v) === 'function') { el[k] = v(el[k]); }
+        else { el[k] = v; }
+        return el[k];
+    };
+
+    var initialize = function (proxy) {
+        // run migration
+        if (typeof(proxy.data) !== 'object') { proxy.data = {}; }
+        if (!Array.isArray(proxy.order)) { proxy.order = []; }
+        if (typeof(proxy.type) !== 'string') { proxy.type = 'todo'; }
+    };
+
+    /*  add (id, obj) push id to order, add object to data */
+    var add = function (proxy, id, obj) {
+        if (!Array.isArray(proxy.order)) {
+            throw new Error('expected an array');
+        }
+        proxy.order.unshift(id);
+        proxy.data[id] = obj;
+    };
+
+    /*  delete (id) remove id from order, delete id from data */
+    var remove = function (proxy, id) {
+        if (Array.isArray(proxy.order)) {
+            var i = proxy.order.indexOf(id);
+            proxy.order.splice(i, 1);
+        }
+        if (proxy.data[id]) { delete proxy.data[id]; }
+    };
+
+    Todo.init = function (proxy) {
+        var api = {};
+        initialize(proxy);
+
+        api.val = function (id, k, v) {
+            return val(proxy, id, k, v);
+        };
+        api.add = function (id, obj) {
+            return add(proxy, id, obj);
+        };
+        api.remove = function (id) {
+            return remove(proxy, id);
+        };
+
+        return api;
+    };
+
+    return Todo;
+});
diff --git a/www/worker/worker.js b/www/worker/worker.js
new file mode 100644
index 000000000..27922594e
--- /dev/null
+++ b/www/worker/worker.js
@@ -0,0 +1,48 @@
+var window = self;
+var localStorage = {
+    setItem: function (k, v) { localStorage[k] = v; },
+    getItem: function (k) { return localStorage[k]; }
+};
+
+importScripts('/bower_components/requirejs/require.js');
+
+require.config({
+        // fix up locations so that relative urls work.
+        baseUrl: '/',
+        paths: { 
+            // jquery declares itself as literally "jquery" so it cannot be pulled by path :(
+            "jquery": "/bower_components/jquery/dist/jquery.min",
+            // json.sortify same
+            "json.sortify": "/bower_components/json.sortify/dist/JSON.sortify",
+            //"pdfjs-dist/build/pdf": "/bower_components/pdfjs-dist/build/pdf",
+            //"pdfjs-dist/build/pdf.worker": "/bower_components/pdfjs-dist/build/pdf.worker"
+            cm: '/bower_components/codemirror'
+        },
+        map: {
+            '*': {
+                'css': '/bower_components/require-css/css.js',
+                'less': '/common/RequireLess.js',
+            }
+        }
+});
+
+var i = 0;
+
+onconnect = function(e) {
+    console.log(e);
+    var port = e.ports[0];
+    console.log('here');
+    require([
+        '/customize/messages.js',
+    ], function (Messages) {
+        console.log(Messages);
+            var n = i;
+            port.postMessage({state: 'READY'});
+            port.onmessage = function (e) {
+                console.log('worker received');
+                console.log(e.data);
+                port.postMessage('hello CryptPad'+n+', ' + Messages.test);
+            };
+            i++;
+    });
+};
