feat: socket-worker

client/app.js

@@ -7,7 +7,7 @@ import {Stage} from '@avocado/graphics';
 import {ActionRegistry, InputPacket} from '@avocado/input';
 import {Vector} from '@avocado/math';
 import {EventEmitter, Property} from '@avocado/mixins';
-import {SocketClient} from '@avocado/net/client/socket';
+import {SocketClient} from '@avocado/net/client/socket-worker';
 import {SocketIoParser} from '@avocado/net';
 import {
   StateKeysPacket,
@@ -93,7 +93,7 @@ export class App extends decorate(class {}) {
     this.pointingAt = [-1, -1];
     this.pointerMovementHandle = undefined;
     // Net.
-    this.AugmentedParser = augmentParserWithThroughput(SocketIoParser);
+    // this.AugmentedParser = augmentParserWithThroughput(SocketIoParser);
     this.hasReceivedState = false;
     this.isConnected = false;
     this.socket = undefined;
@@ -167,7 +167,7 @@ export class App extends decorate(class {}) {
   connect() {
     const config = this.readConfig();
     this.socket = new SocketClient(config.connectionUrl, {
-      parser: this.AugmentedParser,
+      // parser: this.AugmentedParser,
     });
     this.socket.on('connect', () => {
       this.removeFromDom(document.querySelector('.app'));
@@ -428,7 +428,7 @@ export class App extends decorate(class {}) {
     const DebugUiComponent = <DebugUi
       actionRegistry={this.actionRegistry}
       app={this}
-      Parser={this.AugmentedParser}
+      // Parser={this.AugmentedParser}
       socket={this.socket}
       stage={this.stage}
     />;

client/ui/debug/index.js

@@ -8,7 +8,6 @@ import contempo from 'contempo';
 // 1st party.
 import {usePropertyChange} from '../hooks/use-property-change';
 import SelfEntity from './self-entity';
-import Connection from './connection';
 import Timers from './timers';
 
 const decorate = compose(
@@ -17,11 +16,7 @@ const decorate = compose(
 );
 
 const DebugUi = ({
-  actionRegistry,
   app,
-  socket,
-  stage,
-  Parser,
 }) => {
   const [size, setSize] = useState([0, 0]);
   const [position, setPosition] = useState([0, 0]);
@@ -30,20 +25,20 @@ const DebugUi = ({
   // Sync debug UI size with stage size.
   useEffect(() => {
     const onStageResized = (size) => {
-      const rect = stage.element.getBoundingClientRect();
+      const rect = app.stage.element.getBoundingClientRect();
       setPosition([rect.left, rect.top]);
       setSize(size);
-      setTransformRatio(stage.transformRatio);
+      setTransformRatio(app.stage.transformRatio);
     };
-    stage.on('displaySizeChanged', onStageResized);
+    app.stage.on('displaySizeChanged', onStageResized);
-    onStageResized(stage.displaySize);
+    onStageResized(app.stage.displaySize);
     return () => {
-      stage.off('displaySizeChanged', onStageResized);
+      app.stage.off('displaySizeChanged', onStageResized);
     };
   }, []);
   // Scale stage when debugging.
   useEffect(() => {
-    stage.element.style.transform = `scale(${isDebugging ? '0.5' : '1'})`;
+    app.stage.element.style.transform = `scale(${isDebugging ? '0.5' : '1'})`;
   }, [isDebugging]);
   return isDebugging && <div
     className="debug"
@@ -61,11 +56,10 @@ const DebugUi = ({
       style={{
         transform: `scale(${1 / transformRatio})`,
         transformOrigin: '0 0',
-        width: stage.size[0],
+        width: app.stage.size[0],
-        height: stage.size[1],
+        height: app.stage.size[1],
       }}
     >
-      <Connection Parser={Parser} socket={socket} />
       <Timers app={app} />
       <SelfEntity app={app} />
     </div>

server/index.js

@@ -3,7 +3,7 @@ import http from 'http';
 // 2nd party.
 import {SocketServer} from '@avocado/net/server/socket';
 // Import directly for HMR hierarchy.
-import '../register-traits';
+import 'register-traits';
 // Start game server.
 import Game from './game';
 const socketServer = new SocketServer();
@@ -35,7 +35,7 @@ createGame();
 if (module.hot) {
   module.hot.accept([
     './game',
-    '../register-traits'
+    'register-traits'
   ], () => {
     destroyGame(() => {
       createGame();

webpack.client.config.js

@@ -8,8 +8,8 @@ const config = require('./webpack.common.config');
 config.entry = {
   client: [
     '@babel/polyfill',
-    path.join(__dirname, 'register-packets.js'),
+    'register-packets',
-    path.join(__dirname, 'register-traits.js'),
+    'register-traits',
     '@avocado/behavior/item/initialize',
     path.join(__dirname, 'client', 'index.js'),
   ],

webpack.common.config.js

@@ -16,7 +16,7 @@ const config = {
         },
       },
       {
-        test: /register-packets\.js/,
+        test: /register-packets\.js$/,
         use: {
           loader: './defgen',
           options: {
@@ -35,7 +35,7 @@ const config = {
         },
       },
       {
-        test: /register-traits\.js/,
+        test: /register-traits\.js$/,
         use: {
           loader: './defgen',
           options: {
@@ -53,11 +53,16 @@ const config = {
     ],
   },
   output: {
+    globalObject: `(typeof self === 'undefined' ? this : self)`,
     path: path.resolve(__dirname, 'dist'),
     filename: '[name].js',
   },
   plugins: [],
   resolve: {
+    alias: {
+      'register-packets': path.resolve(__dirname, 'register-packets'),
+      'register-traits': path.resolve(__dirname, 'register-traits'),
+    },
     modules: [path.resolve(__dirname, 'node_modules')],
   },
   resolveLoader: {

yarn.lock

@@ -71,8 +71,8 @@
     "@avocado/core" "1.x"
 
 "@avocado/net@^1.0.0":
-  version "1.0.0"
+  version "1.0.1"
-  resolved "https://npm.i12e.cha0s.io/@avocado%2fnet/-/net-1.0.0.tgz#dc6b1bb090e52728fcd31233bcbbef78f42ed8c0"
+  resolved "https://npm.i12e.cha0s.io/@avocado%2fnet/-/net-1.0.1.tgz#43d8eb5f567bea704bcaed88acd6fed7643a5338"
   dependencies:
     "@avocado/core" "1.x"
     "@avocado/mixins" "1.x"
@@ -80,6 +80,7 @@
     schemapack "1.4.2"
     socket.io "2.2.0"
     socket.io-client "2.2.0"
+    worker-loader "2.0.0"
 
 "@avocado/physics@1.x":
   version "1.0.3"
@@ -2863,7 +2864,7 @@ loader-utils@^0.2.16:
     json5 "^0.5.0"
     object-assign "^4.0.1"
 
-loader-utils@^1.0.2, loader-utils@^1.1.0:
+loader-utils@^1.0.0, loader-utils@^1.0.2, loader-utils@^1.1.0:
   version "1.2.3"
   resolved "https://npm.i12e.cha0s.io/loader-utils/-/loader-utils-1.2.3.tgz#1ff5dc6911c9f0a062531a4c04b609406108c2c7"
   dependencies:
@@ -3967,6 +3968,13 @@ scheduler@^0.13.6:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
 
+schema-utils@^0.4.0:
+  version "0.4.7"
+  resolved "https://npm.i12e.cha0s.io/schema-utils/-/schema-utils-0.4.7.tgz#ba74f597d2be2ea880131746ee17d0a093c68187"
+  dependencies:
+    ajv "^6.1.0"
+    ajv-keywords "^3.1.0"
+
 schema-utils@^1.0.0:
   version "1.0.0"
   resolved "https://npm.i12e.cha0s.io/schema-utils/-/schema-utils-1.0.0.tgz#0b79a93204d7b600d4b2850d1f66c2a34951c770"
@@ -4778,6 +4786,13 @@ worker-farm@^1.5.2:
   dependencies:
     errno "~0.1.7"
 
+worker-loader@2.0.0:
+  version "2.0.0"
+  resolved "https://npm.i12e.cha0s.io/worker-loader/-/worker-loader-2.0.0.tgz#45fda3ef76aca815771a89107399ee4119b430ac"
+  dependencies:
+    loader-utils "^1.0.0"
+    schema-utils "^0.4.0"
+
 wrap-ansi@^2.0.0:
   version "2.1.0"
   resolved "https://npm.i12e.cha0s.io/wrap-ansi/-/wrap-ansi-2.1.0.tgz#d8fc3d284dd05794fe84973caecdd1cf824fdd85"