Browse Source

Get most of yew in place

Doesn't actually run though...
Bradlee Speice 8 months ago
parent
commit
ab6e31770d
44 changed files with 431 additions and 1972754 deletions
  1. 0
    5
      electron_percy_emscripten/app/.gitignore
  2. 0
    8
      electron_percy_emscripten/app/app_loader.js
  3. 0
    11
      electron_percy_emscripten/src/lib.rs
  4. 0
    91
      electron_percy_emscripten/test.js
  5. 0
    1972593
      electron_percy_emscripten/test.log
  6. 0
    4
      electron_yew_wasm/app/.gitignore
  7. 0
    10
      electron_yew_wasm/app/electron_yew_wasm.js
  8. 0
    0
      percy/.compilerc
  9. 0
    0
      percy/.eslintrc
  10. 0
    0
      percy/.gitignore
  11. 0
    0
      percy/Cargo.toml
  12. 0
    0
      percy/build.sh
  13. 0
    0
      percy/package.json
  14. 0
    0
      percy/src/lib.rs
  15. 0
    0
      percy/static/app.js
  16. 0
    0
      percy/static/app_loader.js
  17. 0
    0
      percy/static/index.html
  18. 0
    0
      percy/static/index.js
  19. 0
    0
      percy/yarn.lock
  20. 0
    0
      percy_patched_webpack/.compilerc
  21. 0
    0
      percy_patched_webpack/.eslintrc
  22. 2
    1
      percy_patched_webpack/.gitignore
  23. 4
    2
      percy_patched_webpack/Cargo.toml
  24. 372
    0
      percy_patched_webpack/WasmMainTemplatePlugin.patched.js
  25. 8
    11
      percy_patched_webpack/build.sh
  26. 2
    2
      percy_patched_webpack/package.json
  27. 20
    0
      percy_patched_webpack/src/lib.rs
  28. 5
    0
      percy_patched_webpack/static/app.js
  29. 7
    0
      percy_patched_webpack/static/app_loader.js
  30. 0
    0
      percy_patched_webpack/static/index.html
  31. 0
    0
      percy_patched_webpack/static/index.js
  32. 0
    0
      percy_patched_webpack/yarn.lock
  33. 0
    0
      yew/.compilerc
  34. 0
    0
      yew/.eslintrc
  35. 1
    1
      yew/.gitignore
  36. 0
    0
      yew/Cargo.toml
  37. 5
    5
      yew/build.sh
  38. 2
    2
      yew/package.json
  39. 2
    7
      yew/src/lib.rs
  40. 0
    0
      yew/static/app.js
  41. 0
    0
      yew/static/app_loader.js
  42. 1
    1
      yew/static/index.html
  43. 0
    0
      yew/static/index.js
  44. 0
    0
      yew/yarn.lock

+ 0
- 5
electron_percy_emscripten/app/.gitignore View File

@@ -1,5 +0,0 @@
1
-*.wasm
2
-*.bundle.js
3
-bundle.js
4
-electron_percy_wasm.js
5
-app.js

+ 0
- 8
electron_percy_emscripten/app/app_loader.js View File

@@ -1,8 +0,0 @@
1
-import { main } from "./app"
2
-
3
-console.log(main(24))
4
-
5
-console.log("app_loader entrance")
6
-let rootNode = document.getElementById('root')
7
-//rootNode.parentElement.replaceChild(main(), rootNode)
8
-rootNode = document.getElementById('root')

+ 0
- 11
electron_percy_emscripten/src/lib.rs View File

@@ -1,11 +0,0 @@
1
-#![no_std]
2
-
3
-#[macro_use]
4
-extern crate stdweb;
5
-
6
-use stdweb::web::Element;
7
-
8
-#[no_mangle]
9
-pub extern "C" fn main(x: i32) -> i32 {
10
-    x * 2
11
-}

+ 0
- 91
electron_percy_emscripten/test.js View File

@@ -1,91 +0,0 @@
1
-function asmFunc(global, env, buffer) {
2
- "almost asm";
3
- var HEAP8 = new global.Int8Array(buffer);
4
- var HEAP16 = new global.Int16Array(buffer);
5
- var HEAP32 = new global.Int32Array(buffer);
6
- var HEAPU8 = new global.Uint8Array(buffer);
7
- var HEAPU16 = new global.Uint16Array(buffer);
8
- var HEAPU32 = new global.Uint32Array(buffer);
9
- var HEAPF32 = new global.Float32Array(buffer);
10
- var HEAPF64 = new global.Float64Array(buffer);
11
- var Math_imul = global.Math.imul;
12
- var Math_fround = global.Math.fround;
13
- var Math_abs = global.Math.abs;
14
- var Math_clz32 = global.Math.clz32;
15
- var Math_min = global.Math.min;
16
- var Math_max = global.Math.max;
17
- var Math_floor = global.Math.floor;
18
- var Math_ceil = global.Math.ceil;
19
- var Math_sqrt = global.Math.sqrt;
20
- var abort = env.abort;
21
- var nan = global.NaN;
22
- var infinity = global.Infinity;
23
- var global$0 = 1048576;
24
- var global$1 = 1048610;
25
- var global$2 = 1048610;
26
- var global$3 = 1048576;
27
- var i64toi32_i32$HIGH_BITS = 0;
28
- function __wasm_call_ctors() {
29
-  
30
- }
31
- 
32
- function __wasm_grow_memory(pagesToAdd) {
33
-  pagesToAdd = pagesToAdd | 0;
34
-  var oldPages = __wasm_current_memory() | 0;
35
-  var newPages = oldPages + pagesToAdd | 0;
36
-  if ((oldPages < newPages) && (newPages < 65535)) {
37
-   var newBuffer = new ArrayBuffer(Math_imul(newPages, 65536));
38
-   var newHEAP8 = new global.Int8Array(newBuffer);
39
-   newHEAP8.set(HEAP8);
40
-   HEAP8 = newHEAP8;
41
-   HEAP16 = new global.Int16Array(newBuffer);
42
-   HEAP32 = new global.Int32Array(newBuffer);
43
-   HEAPU8 = new global.Uint8Array(newBuffer);
44
-   HEAPU16 = new global.Uint16Array(newBuffer);
45
-   HEAPU32 = new global.Uint32Array(newBuffer);
46
-   HEAPF32 = new global.Float32Array(newBuffer);
47
-   HEAPF64 = new global.Float64Array(newBuffer);
48
-   buffer = newBuffer;
49
-  }
50
-  return oldPages;
51
- }
52
- 
53
- function __wasm_current_memory() {
54
-  return buffer.byteLength / 65536 | 0;
55
- }
56
- 
57
- return {
58
-  memory: Object.create(Object.prototype, {
59
-   grow: {
60
-    value: __wasm_grow_memory
61
-   }, 
62
-   buffer: {
63
-    get: function () {
64
-     return buffer;
65
-    }
66
-    
67
-   }
68
-  })
69
- };
70
-}
71
-
72
-const memasmFunc = new ArrayBuffer(1114112);
73
-const assignasmFunc = (
74
-      function(mem) {
75
-        const _mem = new Uint8Array(mem);
76
-        return function(offset, s) {
77
-          if (typeof Buffer === 'undefined') {
78
-            const bytes = atob(s);
79
-            for (let i = 0; i < bytes.length; i++)
80
-              _mem[offset + i] = bytes.charCodeAt(i);
81
-          } else {
82
-            const bytes = Buffer.from(s, 'base64');
83
-            for (let i = 0; i < bytes.length; i++)
84
-              _mem[offset + i] = bytes[i];
85
-          }
86
-        }
87
-      }
88
-    )(memasmFunc);
89
-assignasmFunc(1048576, "AWdkYl9sb2FkX3J1c3RfcHJldHR5X3ByaW50ZXJzLnB5AA==");
90
-const retasmFunc = asmFunc({Math,Int8Array,Uint8Array,Int16Array,Uint16Array,Int32Array,Uint32Array,Float32Array,Float64Array,NaN,Infinity}, {abort:function() { throw new Error('abort'); }},memasmFunc);
91
-export const memory = retasmFunc.memory;

+ 0
- 1972593
electron_percy_emscripten/test.log
File diff suppressed because it is too large
View File


+ 0
- 4
electron_yew_wasm/app/.gitignore View File

@@ -1,4 +0,0 @@
1
-*.wasm
2
-*.bundle.js
3
-bundle.js
4
-electron_percy_wasm.js

+ 0
- 10
electron_yew_wasm/app/electron_yew_wasm.js View File

@@ -1,10 +0,0 @@
1
-/* tslint:disable */
2
-import * as wasm from './electron_yew_wasm_bg';
3
-
4
-/**
5
-* @returns {void}
6
-*/
7
-export function main() {
8
-    return wasm.main();
9
-}
10
-

electron_percy_emscripten/.compilerc → percy/.compilerc View File


electron_percy_emscripten/.eslintrc → percy/.eslintrc View File


percy_wasm/.gitignore → percy/.gitignore View File


percy_wasm/Cargo.toml → percy/Cargo.toml View File


percy_wasm/build.sh → percy/build.sh View File


percy_wasm/package.json → percy/package.json View File


percy_wasm/src/lib.rs → percy/src/lib.rs View File


percy_wasm/static/app.js → percy/static/app.js View File


percy_wasm/static/app_loader.js → percy/static/app_loader.js View File


electron_yew_wasm/app/index.html → percy/static/index.html View File


electron_percy_emscripten/app/index.js → percy/static/index.js View File


electron_percy_emscripten/yarn.lock → percy/yarn.lock View File


electron_yew_wasm/.compilerc → percy_patched_webpack/.compilerc View File


electron_yew_wasm/.eslintrc → percy_patched_webpack/.eslintrc View File


electron_yew_wasm/.gitignore → percy_patched_webpack/.gitignore View File

@@ -1,3 +1,4 @@
1 1
 node_modules/
2 2
 Cargo.lock
3
-target/
3
+target/
4
+dist/

electron_percy_emscripten/Cargo.toml → percy_patched_webpack/Cargo.toml View File

@@ -1,5 +1,5 @@
1 1
 [package]
2
-name = "electron_percy_emscripten"
2
+name = "electron_percy_wasm"
3 3
 version = "0.1.0"
4 4
 authors = ["Bradlee Speice <bradlee@speice.io>"]
5 5
 
@@ -7,4 +7,6 @@ authors = ["Bradlee Speice <bradlee@speice.io>"]
7 7
 crate-type = ["cdylib"]
8 8
 
9 9
 [dependencies]
10
-stdweb = "0.4"
10
+percy-webapis = "0.0.1"
11
+virtual-dom-rs = "0.1"
12
+wasm-bindgen = "0.2"

+ 372
- 0
percy_patched_webpack/WasmMainTemplatePlugin.patched.js View File

@@ -0,0 +1,372 @@
1
+/*
2
+	MIT License http://www.opensource.org/licenses/mit-license.php
3
+	Author Tobias Koppers @sokra
4
+*/
5
+"use strict";
6
+
7
+const Template = require("../Template");
8
+const WebAssemblyUtils = require("./WebAssemblyUtils");
9
+
10
+/** @typedef {import("../Module")} Module */
11
+/** @typedef {import("../MainTemplate")} MainTemplate */
12
+
13
+// Get all wasm modules
14
+const getAllWasmModules = chunk => {
15
+	const wasmModules = chunk.getAllAsyncChunks();
16
+	const array = [];
17
+	for (const chunk of wasmModules) {
18
+		for (const m of chunk.modulesIterable) {
19
+			if (m.type.startsWith("webassembly")) {
20
+				array.push(m);
21
+			}
22
+		}
23
+	}
24
+
25
+	return array;
26
+};
27
+
28
+/**
29
+ * generates the import object function for a module
30
+ * @param {Module} module the module
31
+ * @param {boolean} mangle mangle imports
32
+ * @returns {string} source code
33
+ */
34
+const generateImportObject = (module, mangle) => {
35
+	const waitForInstances = new Map();
36
+	const properties = [];
37
+	const usedWasmDependencies = WebAssemblyUtils.getUsedDependencies(
38
+		module,
39
+		mangle
40
+	);
41
+	for (const usedDep of usedWasmDependencies) {
42
+		const dep = usedDep.dependency;
43
+		const importedModule = dep.module;
44
+		const exportName = dep.name;
45
+		const usedName = importedModule && importedModule.isUsed(exportName);
46
+		const description = dep.description;
47
+		const direct = dep.onlyDirectImport;
48
+
49
+		const module = usedDep.module;
50
+		const name = usedDep.name;
51
+
52
+		if (direct) {
53
+			const instanceVar = `m${waitForInstances.size}`;
54
+			waitForInstances.set(instanceVar, importedModule.id);
55
+			properties.push({
56
+				module,
57
+				name,
58
+				value: `${instanceVar}[${JSON.stringify(usedName)}]`
59
+			});
60
+		} else {
61
+			const params = description.signature.params.map(
62
+				(param, k) => "p" + k + param.valtype
63
+			);
64
+
65
+			const mod = `installedModules[${JSON.stringify(importedModule.id)}]`;
66
+			const func = `${mod}.exports[${JSON.stringify(usedName)}]`;
67
+
68
+			properties.push({
69
+				module,
70
+				name,
71
+				value: Template.asString([
72
+					(importedModule.type.startsWith("webassembly")
73
+						? `${mod} ? ${func} : `
74
+						: "") + `function(${params}) {`,
75
+					Template.indent([`return ${func}(${params});`]),
76
+					"}"
77
+				])
78
+			});
79
+		}
80
+	}
81
+
82
+	let importObject;
83
+	if (mangle) {
84
+		importObject = [
85
+			"return {",
86
+			Template.indent([
87
+				properties.map(p => `${JSON.stringify(p.name)}: ${p.value}`).join(",\n")
88
+			]),
89
+			"};"
90
+		];
91
+	} else {
92
+		const propertiesByModule = new Map();
93
+		for (const p of properties) {
94
+			let list = propertiesByModule.get(p.module);
95
+			if (list === undefined) {
96
+				propertiesByModule.set(p.module, (list = []));
97
+			}
98
+			list.push(p);
99
+		}
100
+		importObject = [
101
+			"return {",
102
+			Template.indent([
103
+				Array.from(propertiesByModule, ([module, list]) => {
104
+					return Template.asString([
105
+						`${JSON.stringify(module)}: {`,
106
+						Template.indent([
107
+							list.map(p => `${JSON.stringify(p.name)}: ${p.value}`).join(",\n")
108
+						]),
109
+						"}"
110
+					]);
111
+				}).join(",\n")
112
+			]),
113
+			"};"
114
+		];
115
+	}
116
+
117
+	if (waitForInstances.size === 1) {
118
+		const moduleId = Array.from(waitForInstances.values())[0];
119
+		const promise = `installedWasmModules[${JSON.stringify(moduleId)}]`;
120
+		const variable = Array.from(waitForInstances.keys())[0];
121
+		return Template.asString([
122
+			`${JSON.stringify(module.id)}: function() {`,
123
+			Template.indent([
124
+				`return promiseResolve().then(function() { return ${promise}; }).then(function(${variable}) {`,
125
+				Template.indent(importObject),
126
+				"});"
127
+			]),
128
+			"},"
129
+		]);
130
+	} else if (waitForInstances.size > 0) {
131
+		const promises = Array.from(
132
+			waitForInstances.values(),
133
+			id => `installedWasmModules[${JSON.stringify(id)}]`
134
+		).join(", ");
135
+		const variables = Array.from(
136
+			waitForInstances.keys(),
137
+			(name, i) => `${name} = array[${i}]`
138
+		).join(", ");
139
+		return Template.asString([
140
+			`${JSON.stringify(module.id)}: function() {`,
141
+			Template.indent([
142
+				`return promiseResolve().then(function() { return Promise.all([${promises}]); }).then(function(array) {`,
143
+				Template.indent([`var ${variables};`, ...importObject]),
144
+				"});"
145
+			]),
146
+			"},"
147
+		]);
148
+	} else {
149
+		return Template.asString([
150
+			`${JSON.stringify(module.id)}: function() {`,
151
+			Template.indent(importObject),
152
+			"},"
153
+		]);
154
+	}
155
+};
156
+
157
+class WasmMainTemplatePlugin {
158
+	constructor({ generateLoadBinaryCode, supportsStreaming, mangleImports }) {
159
+		this.generateLoadBinaryCode = generateLoadBinaryCode;
160
+		this.supportsStreaming = supportsStreaming;
161
+		this.mangleImports = mangleImports;
162
+	}
163
+
164
+	/**
165
+	 * @param {MainTemplate} mainTemplate main template
166
+	 * @returns {void}
167
+	 */
168
+	apply(mainTemplate) {
169
+		mainTemplate.hooks.localVars.tap(
170
+			"WasmMainTemplatePlugin",
171
+			(source, chunk) => {
172
+				const wasmModules = getAllWasmModules(chunk);
173
+				if (wasmModules.length === 0) return source;
174
+				const importObjects = wasmModules.map(module => {
175
+					return generateImportObject(module, this.mangleImports);
176
+				});
177
+				return Template.asString([
178
+					source,
179
+					"",
180
+					"// object to store loaded and loading wasm modules",
181
+					"var installedWasmModules = {};",
182
+					"",
183
+					// This function is used to delay reading the installed wasm module promises
184
+					// by a microtask. Sorting them doesn't help because there are egdecases where
185
+					// sorting is not possible (modules splitted into different chunks).
186
+					// So we not even trying and solve this by a microtask delay.
187
+					"function promiseResolve() { return Promise.resolve(); }",
188
+					"",
189
+					"var wasmImportObjects = {",
190
+					Template.indent(importObjects),
191
+					"};"
192
+				]);
193
+			}
194
+		);
195
+		mainTemplate.hooks.requireEnsure.tap(
196
+			"WasmMainTemplatePlugin",
197
+			(source, chunk, hash) => {
198
+				const webassemblyModuleFilename =
199
+					mainTemplate.outputOptions.webassemblyModuleFilename;
200
+
201
+				const chunkModuleMaps = chunk.getChunkModuleMaps(m =>
202
+					m.type.startsWith("webassembly")
203
+				);
204
+				if (Object.keys(chunkModuleMaps.id).length === 0) return source;
205
+				const wasmModuleSrcPath = mainTemplate.getAssetPath(
206
+					JSON.stringify(webassemblyModuleFilename),
207
+					{
208
+						hash: `" + ${mainTemplate.renderCurrentHashCode(hash)} + "`,
209
+						hashWithLength: length =>
210
+							`" + ${mainTemplate.renderCurrentHashCode(hash, length)} + "`,
211
+						module: {
212
+							id: '" + wasmModuleId + "',
213
+							hash: `" + ${JSON.stringify(
214
+								chunkModuleMaps.hash
215
+							)}[wasmModuleId] + "`,
216
+							hashWithLength(length) {
217
+								const shortChunkHashMap = Object.create(null);
218
+								for (const wasmModuleId of Object.keys(chunkModuleMaps.hash)) {
219
+									if (typeof chunkModuleMaps.hash[wasmModuleId] === "string") {
220
+										shortChunkHashMap[wasmModuleId] = chunkModuleMaps.hash[
221
+											wasmModuleId
222
+										].substr(0, length);
223
+									}
224
+								}
225
+								return `" + ${JSON.stringify(
226
+									shortChunkHashMap
227
+								)}[wasmModuleId] + "`;
228
+							}
229
+						}
230
+					}
231
+				);
232
+				const createImportObject = content =>
233
+					this.mangleImports
234
+						? `{ ${JSON.stringify(
235
+								WebAssemblyUtils.MANGLED_MODULE
236
+						  )}: ${content} }`
237
+						: content;
238
+				return Template.asString([
239
+					source,
240
+					"",
241
+					"// Fetch + compile chunk loading for webassembly",
242
+					"",
243
+					`var wasmModules = ${JSON.stringify(
244
+						chunkModuleMaps.id
245
+					)}[chunkId] || [];`,
246
+					"",
247
+					"wasmModules.forEach(function(wasmModuleId) {",
248
+					Template.indent([
249
+						"var installedWasmModuleData = installedWasmModules[wasmModuleId];",
250
+						"",
251
+						'// a Promise means "currently loading" or "already loaded".',
252
+						"if(installedWasmModuleData)",
253
+						Template.indent(["promises.push(installedWasmModuleData);"]),
254
+						"else {",
255
+						Template.indent([
256
+							`var importObject = wasmImportObjects[wasmModuleId]();`,
257
+							`var req = ${this.generateLoadBinaryCode(wasmModuleSrcPath)};`,
258
+							"var promise;",
259
+							this.supportsStreaming
260
+								? Template.asString([
261
+										"if(importObject instanceof Promise && typeof WebAssembly.compileStreaming === 'function') {",
262
+										Template.indent([
263
+											"promise = Promise.all([WebAssembly.compileStreaming(req), importObject]).then(function(items) {",
264
+											Template.indent([
265
+												`return WebAssembly.instantiate(items[0], ${createImportObject(
266
+													"items[1]"
267
+												)});`
268
+											]),
269
+											"});"
270
+										]),
271
+										"} else if(typeof WebAssembly.instantiateStreaming === 'function') {",
272
+										Template.indent([
273
+											`promise = WebAssembly.instantiateStreaming(req, ${createImportObject(
274
+												"importObject"
275
+											)}).catch(function(reason) {`,
276
+											Template.indent([
277
+												`if (reason.name === "TypeError") {`,
278
+												Template.indent([
279
+													`console.log("Potential WASM MIME issue detected, falling back to arrayBuffer instantiation");`,
280
+													"return req.then(function(x) { return x.arrayBuffer(); }).then(function(bytes) {",
281
+													Template.indent([
282
+														"return WebAssembly.instantiate(bytes, importObject);"
283
+													]),
284
+													"});"
285
+												]),
286
+												"}",
287
+												"throw reason;"
288
+											]),
289
+											"});"
290
+										])
291
+								  ])
292
+								: Template.asString([
293
+										"if(importObject instanceof Promise) {",
294
+										Template.indent([
295
+											"var bytesPromise = req.then(function(x) { return x.arrayBuffer(); });",
296
+											"promise = Promise.all([",
297
+											Template.indent([
298
+												"bytesPromise.then(function(bytes) { return WebAssembly.compile(bytes); }),",
299
+												"importObject"
300
+											]),
301
+											"]).then(function(items) {",
302
+											Template.indent([
303
+												`return WebAssembly.instantiate(items[0], ${createImportObject(
304
+													"items[1]"
305
+												)});`
306
+											]),
307
+											"});"
308
+										])
309
+								  ]),
310
+							"} else {",
311
+							Template.indent([
312
+								"var bytesPromise = req.then(function(x) { return x.arrayBuffer(); });",
313
+								"promise = bytesPromise.then(function(bytes) {",
314
+								Template.indent([
315
+									`return WebAssembly.instantiate(bytes, ${createImportObject(
316
+										"importObject"
317
+									)});`
318
+								]),
319
+								"});"
320
+							]),
321
+							"}",
322
+							"promises.push(installedWasmModules[wasmModuleId] = promise.then(function(res) {",
323
+							Template.indent([
324
+								`return ${
325
+									mainTemplate.requireFn
326
+								}.w[wasmModuleId] = (res.instance || res).exports;`
327
+							]),
328
+							"}));"
329
+						]),
330
+						"}"
331
+					]),
332
+					"});"
333
+				]);
334
+			}
335
+		);
336
+		mainTemplate.hooks.requireExtensions.tap(
337
+			"WasmMainTemplatePlugin",
338
+			(source, chunk) => {
339
+				if (!chunk.hasModuleInGraph(m => m.type.startsWith("webassembly"))) {
340
+					return source;
341
+				}
342
+				return Template.asString([
343
+					source,
344
+					"",
345
+					"// object with all WebAssembly.instance exports",
346
+					`${mainTemplate.requireFn}.w = {};`
347
+				]);
348
+			}
349
+		);
350
+		mainTemplate.hooks.hash.tap("WasmMainTemplatePlugin", hash => {
351
+			hash.update("WasmMainTemplatePlugin");
352
+			hash.update("1");
353
+			hash.update(`${mainTemplate.outputOptions.webassemblyModuleFilename}`);
354
+			hash.update(`${this.mangleImports}`);
355
+		});
356
+		mainTemplate.hooks.hashForChunk.tap(
357
+			"WasmMainTemplatePlugin",
358
+			(hash, chunk) => {
359
+				const chunkModuleMaps = chunk.getChunkModuleMaps(m =>
360
+					m.type.startsWith("webassembly")
361
+				);
362
+				hash.update(JSON.stringify(chunkModuleMaps.id));
363
+				const wasmModules = getAllWasmModules(chunk);
364
+				for (const module of wasmModules) {
365
+					hash.update(module.hash);
366
+				}
367
+			}
368
+		);
369
+	}
370
+}
371
+
372
+module.exports = WasmMainTemplatePlugin;

electron_percy_emscripten/build_wasm.sh → percy_patched_webpack/build.sh View File

@@ -1,19 +1,12 @@
1
-#!/bin/bash
2 1
 DIR="$(dirname $0)"
3 2
 WASM_DIR="$DIR/target/wasm32-unknown-unknown"
4 3
 WASM_NAME="$(cat "$DIR/Cargo.toml" | grep name | sed 's/name = "//' | sed 's/"//g')"
5
-APP_DIR="$DIR/app/"
6
-
7
-if [ ! -f "$DIR/binaryen/bin/wasm2js" ]; then
8
-    git clone https://github.com/WebAssembly/binaryen "$DIR/binaryen"
9
-    pushd "$DIR/binaryen"
10
-    cmake . && make -j8
11
-    popd
12
-fi
4
+APP_DIR="$DIR/dist/"
13 5
 
14 6
 if [ ! -d "$APP_DIR" ]; then
15 7
     mkdir "$APP_DIR"
16 8
 fi
9
+cp "$DIR/static/"* "$APP_DIR"
17 10
 
18 11
 if [ -z "$(which cargo)" ]; then
19 12
     echo 'Must install `cargo` before proceeding. Please see https://rustup.rs/ for more information.'
@@ -25,6 +18,10 @@ if [ -z "$(which wasm-bindgen)" ]; then
25 18
     cargo install wasm-bindgen-cli
26 19
 fi
27 20
 
21
+# Patch from: https://github.com/webpack/webpack/pull/7983
22
+cp "$DIR/WasmMainTemplatePlugin.patched.js" "$DIR/node_modules/webpack/lib/wasm/WasmMainTemplatePlugin.js"
23
+
28 24
 cargo +nightly build --target=wasm32-unknown-unknown && \
29
-    "$DIR/binaryen/bin/wasm2js" --pedantic "$WASM_DIR/debug/$WASM_NAME.wasm" -o "$WASM_DIR/debug/$WASM_NAME.js" && \
30
-    "$DIR/node_modules/webpack-cli/bin/cli.js" "$WASM_DIR/debug/$WASM_NAME.js" -o "$APP_DIR/app.js"
25
+    wasm-bindgen "$WASM_DIR/debug/$WASM_NAME.wasm" --out-dir "$APP_DIR" --no-typescript && \
26
+    # Still doesn't work with mode=production, not sure why
27
+    "$DIR/node_modules/webpack-cli/bin/cli.js" --mode=production "$APP_DIR/app_loader.js" -o "$APP_DIR/bundle.js"

electron_percy_emscripten/package.json → percy_patched_webpack/package.json View File

@@ -3,9 +3,9 @@
3 3
     "productName": "electron_percy_wasm",
4 4
     "version": "1.0.0",
5 5
     "description": "My Electron application description",
6
-    "main": "app/index.js",
6
+    "main": "dist/index.js",
7 7
     "scripts": {
8
-        "prestart": "./build_wasm.sh",
8
+        "prestart": "./build.sh",
9 9
         "start": "electron-forge start",
10 10
         "package": "electron-forge package",
11 11
         "make": "electron-forge make",

+ 20
- 0
percy_patched_webpack/src/lib.rs View File

@@ -0,0 +1,20 @@
1
+#[macro_use]
2
+extern crate virtual_dom_rs;
3
+
4
+extern crate percy_webapis;
5
+extern crate wasm_bindgen;
6
+
7
+use percy_webapis::log;
8
+use percy_webapis::Element;
9
+use wasm_bindgen::prelude::*;
10
+
11
+#[wasm_bindgen]
12
+pub fn main() -> Element {
13
+    log("Entered Rust code");
14
+
15
+    let elem = html! {
16
+        <span> {"It is alive!"} </span>
17
+    };
18
+
19
+    elem.create_element()
20
+}

+ 5
- 0
percy_patched_webpack/static/app.js View File

@@ -0,0 +1,5 @@
1
+import { main } from "./electron_percy_wasm"
2
+
3
+let rootNode = document.getElementById('root')
4
+rootNode.parentElement.replaceChild(main(), rootNode)
5
+rootNode = document.getElementById('root')

+ 7
- 0
percy_patched_webpack/static/app_loader.js View File

@@ -0,0 +1,7 @@
1
+const app = import("./app")
2
+app.then(() => {
3
+    console.log("Finished resolving application bundle")
4
+}, (e) => {
5
+    console.log("Unable to resolve application bundle: ")
6
+    console.log(e)
7
+})

percy_wasm/static/index.html → percy_patched_webpack/static/index.html View File


electron_yew_wasm/app/index.js → percy_patched_webpack/static/index.js View File


electron_yew_wasm/yarn.lock → percy_patched_webpack/yarn.lock View File


percy_wasm/.compilerc → yew/.compilerc View File


percy_wasm/.eslintrc → yew/.eslintrc View File


electron_percy_emscripten/.gitignore → yew/.gitignore View File

@@ -1,4 +1,4 @@
1 1
 node_modules/
2 2
 Cargo.lock
3 3
 target/
4
-binaryen/
4
+dist/

electron_yew_wasm/Cargo.toml → yew/Cargo.toml View File


electron_yew_wasm/build_wasm_bundle.sh → yew/build.sh View File

@@ -1,11 +1,12 @@
1 1
 DIR="$(dirname $0)"
2 2
 WASM_DIR="$DIR/target/wasm32-unknown-unknown"
3 3
 WASM_NAME="$(cat "$DIR/Cargo.toml" | grep name | sed 's/name = "//' | sed 's/"//g')"
4
-APP_DIR="$DIR/app/"
4
+APP_DIR="$DIR/dist/"
5 5
 
6 6
 if [ ! -d "$APP_DIR" ]; then
7 7
     mkdir "$APP_DIR"
8 8
 fi
9
+cp "$DIR/static/"* "$APP_DIR"
9 10
 
10 11
 if [ -z "$(which cargo)" ]; then
11 12
     echo 'Must install `cargo` before proceeding. Please see https://rustup.rs/ for more information.'
@@ -17,9 +18,8 @@ if [ -z "$(which wasm-bindgen)" ]; then
17 18
     cargo install wasm-bindgen-cli
18 19
 fi
19 20
 
20
-cargo web build --target=wasm32-unknown-unknown && \
21
+cargo +nightly build --target=wasm32-unknown-unknown && \
21 22
     wasm-bindgen "$WASM_DIR/debug/$WASM_NAME.wasm" --out-dir "$APP_DIR" --no-typescript && \
22 23
     # Have to use --mode=development so we can patch out the call to instantiateStreaming
23
-    "$DIR/node_modules/webpack-cli/bin/cli.js" --mode=development "$APP_DIR/app_loader.js" -o "$APP_DIR/bundle.js"
24
-    # Necessitated by https://github.com/webpack/webpack/issues/7918
25
-    sed -i '/.*instantiateStreaming.*/d' "$APP_DIR/bundle.js"
24
+    "$DIR/node_modules/webpack-cli/bin/cli.js" --mode=development "$APP_DIR/app_loader.js" -o "$APP_DIR/bundle.js" && \
25
+    sed -i 's/.*instantiateStreaming.*//g' "$APP_DIR/bundle.js"

electron_yew_wasm/package.json → yew/package.json View File

@@ -3,9 +3,9 @@
3 3
     "productName": "electron_percy_wasm",
4 4
     "version": "1.0.0",
5 5
     "description": "My Electron application description",
6
-    "main": "app/index.js",
6
+    "main": "dist/index.js",
7 7
     "scripts": {
8
-        "prestart": "./build_wasm_bundle.sh",
8
+        "prestart": "./build.sh",
9 9
         "start": "electron-forge start",
10 10
         "package": "electron-forge package",
11 11
         "make": "electron-forge make",

electron_yew_wasm/src/lib.rs → yew/src/lib.rs View File

@@ -1,14 +1,10 @@
1
-#[macro_use]
2
-extern crate stdweb;
3 1
 extern crate wasm_bindgen;
4 2
 #[macro_use]
5 3
 extern crate yew;
6 4
 
7
-use stdweb::console;
8 5
 use wasm_bindgen::prelude::*;
9 6
 use yew::prelude::*;
10 7
 
11
-type Context = ();
12 8
 struct Model {}
13 9
 enum Msg {
14 10
 }
@@ -37,9 +33,8 @@ impl Renderable<Model> for Model {
37 33
 
38 34
 #[wasm_bindgen]
39 35
 pub fn main() {
40
-    console!(log, "Entered Rust code");
41 36
     yew::initialize();
42
-    //let app: App<Model> = App::new(());
43
-    //app.mount_to_body();
37
+    let app: App<Model> = App::new();
38
+    app.mount_to_body();
44 39
     yew::run_loop();
45 40
 }

electron_yew_wasm/app/app.js → yew/static/app.js View File


electron_yew_wasm/app/app_loader.js → yew/static/app_loader.js View File


electron_percy_emscripten/app/index.html → yew/static/index.html View File

@@ -7,5 +7,5 @@
7 7
   <body>
8 8
     <div id="root">Loading...</div>
9 9
   </body>
10
-  <script src="./app_loader.js"/>
10
+  <script src="./bundle.js"/>
11 11
 </html>

percy_wasm/static/index.js → yew/static/index.js View File


percy_wasm/yarn.lock → yew/yarn.lock View File


Loading…
Cancel
Save