From 57a4d0924d57a0365d0e30d50c9065e4ddc3beb9 Mon Sep 17 00:00:00 2001 From: Robert Garrett Date: Fri, 3 Oct 2025 13:01:47 -0500 Subject: [PATCH 01/36] Fix: Missing destination in Docker copy instr. I don't really know how I did that, or how I got a build up on Fly.io without committing the fix. Well, anyway... it's done now. --- Dockerfile | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Dockerfile b/Dockerfile index 8d95a9e7..12dc7a5f 100644 --- a/Dockerfile +++ b/Dockerfile @@ -9,7 +9,7 @@ RUN cargo install --locked wasm-bindgen-cli # will cause Docker to re-run `cargo build` even when the source hasn't changed. COPY src/ ./src COPY Cargo.toml ./Cargo.toml -COPY Cargo.lock +COPY Cargo.lock ./Cargo.lock RUN cargo build --locked --target wasm32-unknown-unknown --profile=wasm-release RUN wasm-bindgen --no-typescript --target web --out-dir ./out/ --out-name "boids" target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm From 4eb4fefeb2d80cde4629a0db403d6fe25f8789c0 Mon Sep 17 00:00:00 2001 From: Robert Garrett Date: Tue, 28 Oct 2025 12:22:26 -0500 Subject: [PATCH 02/36] Add a Makefile to make web builds more ergonomic Call with `make -f makefile_web` to produce a web root for serving. Use target "boids_web_root.tar" to bundle the files into a tarball. For... publishing... or something. The `wasm-server-runner` program seems to supply it's own index.html and is doing *something* regarding MIME types -- hosting a dev build of the Boids program results in the browser complaining about "" (empty string) being an invalid MIME type. I want my own index.html during testing, and I can't figure out why the MIME type info is wrong. I've decided to automate the web-root build process and serve it up with whatever webserver I have on hand. --- .gitignore | 1 + makefile_web | 32 ++++++++++++++++++++++++++++++++ 2 files changed, 33 insertions(+) create mode 100644 makefile_web diff --git a/.gitignore b/.gitignore index ea8c4bf7..c2b9385c 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,2 @@ /target +/out \ No newline at end of file diff --git a/makefile_web b/makefile_web new file mode 100644 index 00000000..1384642a --- /dev/null +++ b/makefile_web @@ -0,0 +1,32 @@ +.PHONY: clean full-clean web tarball + +web: out/boids-sim.js out/boids-sim.wasm out/index.html + +tarball: boids_web_root.tar + +boids_web_root.tar: out/boids-sim.js out/boids-sim.wasm out/index.html + tar -caf $@ $< + +target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm: + cargo build --profile wasm-release --target wasm32-unknown-unknown + +out: + mkdir $@ + +# Both the JS and WASM files are generated by the wasm-bindgen call, so both +# get to be on the target half of this recipe. +out/boids-sim.js out/boids-sim.wasm: out target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm + wasm-bindgen --no-typescript --target web --out-dir ./out --out-name boids-sim.wasm target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm + +out/index.html: www/index.html + cp -a $< $@ + +# Clean the web build, but not the Cargo cache. Cargo handles it's own caching +# and I don't want to obliterate it all the time. +clean: + rm -rf out/ boids_web_root.tar + +# Delete everything, including the Cargo build cache. In case someone needs +# this, I guess. +full-clean: clean + cargo clean From 39925b0c4e3a3363ab61bb2722eaa454cf7d6b58 Mon Sep 17 00:00:00 2001 From: Robert Garrett Date: Tue, 28 Oct 2025 12:41:07 -0500 Subject: [PATCH 03/36] Rename WASM & JS output to match HTML The index.html file calls for a "boids.js", so I need the Makefile to produce one. I could change it, but that's off-topic for now so I won't. --- makefile_web | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/makefile_web b/makefile_web index 1384642a..4175e028 100644 --- a/makefile_web +++ b/makefile_web @@ -1,10 +1,10 @@ .PHONY: clean full-clean web tarball -web: out/boids-sim.js out/boids-sim.wasm out/index.html +web: out/boids.js out/boids.wasm out/index.html tarball: boids_web_root.tar -boids_web_root.tar: out/boids-sim.js out/boids-sim.wasm out/index.html +boids_web_root.tar: out/boids.js out/boids.wasm out/index.html tar -caf $@ $< target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm: @@ -15,8 +15,8 @@ out: # Both the JS and WASM files are generated by the wasm-bindgen call, so both # get to be on the target half of this recipe. -out/boids-sim.js out/boids-sim.wasm: out target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm - wasm-bindgen --no-typescript --target web --out-dir ./out --out-name boids-sim.wasm target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm +out/boids.js out/boids.wasm: out target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm + wasm-bindgen --no-typescript --target web --out-dir ./out/ --out-name boids.wasm target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm out/index.html: www/index.html cp -a $< $@ From 3c0cf85da5206c44ec1353745a3e0d761980508a Mon Sep 17 00:00:00 2001 From: Robert Garrett Date: Tue, 28 Oct 2025 12:42:44 -0500 Subject: [PATCH 04/36] Drop extra suffix in wasm-bindgen output name Oops, it's not supposed to have a file suffix! It's a bit annoying that it still produces both a WASM and JS file, just not the right ones (and no _bg.wasm at all). Especially without any warning that it is doing something different than normal. Oh well. --- makefile_web | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/makefile_web b/makefile_web index 4175e028..3ecc5b92 100644 --- a/makefile_web +++ b/makefile_web @@ -16,7 +16,7 @@ out: # Both the JS and WASM files are generated by the wasm-bindgen call, so both # get to be on the target half of this recipe. out/boids.js out/boids.wasm: out target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm - wasm-bindgen --no-typescript --target web --out-dir ./out/ --out-name boids.wasm target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm + wasm-bindgen --no-typescript --target web --out-dir ./out/ --out-name boids target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm out/index.html: www/index.html cp -a $< $@ From 943483503cf223f24836c8b1124edc7f6950c0c6 Mon Sep 17 00:00:00 2001 From: Robert Garrett Date: Tue, 28 Oct 2025 12:46:37 -0500 Subject: [PATCH 05/36] Turn output folder into an order-only prerequisite This makes the output folder "required to exist" and not "required to be more recent." The folder's timestamp is updated when files are written into it. The files inside depend on the folder existing. The result is that the WASM and JS files are considered very slightly older than the folder that contains them. The result is that the folder is up-to-date but it's contents are not, thus re-building them and *again* updating the folder timestamp. The makefile was stuck constantly rebuilding things that are actually up-to-date. --- makefile_web | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/makefile_web b/makefile_web index 3ecc5b92..58f7f1f5 100644 --- a/makefile_web +++ b/makefile_web @@ -15,7 +15,7 @@ out: # Both the JS and WASM files are generated by the wasm-bindgen call, so both # get to be on the target half of this recipe. -out/boids.js out/boids.wasm: out target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm +out/boids.js out/boids.wasm: target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm | out wasm-bindgen --no-typescript --target web --out-dir ./out/ --out-name boids target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm out/index.html: www/index.html From 370fe85d6c0909daff77a7a413f4cb97b2d7a632 Mon Sep 17 00:00:00 2001 From: Robert Garrett Date: Tue, 28 Oct 2025 14:59:47 -0500 Subject: [PATCH 06/36] Make wasm binary target depend on source files Now Make will know to rebuild the WASM binary if the source code changes... because I forgot to do that, too. :v --- makefile_web | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/makefile_web b/makefile_web index 58f7f1f5..4a4744c8 100644 --- a/makefile_web +++ b/makefile_web @@ -1,3 +1,6 @@ +SRC_DIR = ./src +SRCS := $(wildcard $(SRC_DIR)/**) + .PHONY: clean full-clean web tarball web: out/boids.js out/boids.wasm out/index.html @@ -7,7 +10,7 @@ tarball: boids_web_root.tar boids_web_root.tar: out/boids.js out/boids.wasm out/index.html tar -caf $@ $< -target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm: +target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm: $(SRCS) cargo build --profile wasm-release --target wasm32-unknown-unknown out: From 7408f056f65ed080eb5176f7a664bee1799cac7c Mon Sep 17 00:00:00 2001 From: Robert Garrett Date: Tue, 28 Oct 2025 15:00:28 -0500 Subject: [PATCH 07/36] Fix: use correct name suffix for the WASM file Maybe I should have spent more time manually running each of the steps. Eh, whatever. Bug found and fixed. --- makefile_web | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/makefile_web b/makefile_web index 4a4744c8..370d9c67 100644 --- a/makefile_web +++ b/makefile_web @@ -3,11 +3,11 @@ SRCS := $(wildcard $(SRC_DIR)/**) .PHONY: clean full-clean web tarball -web: out/boids.js out/boids.wasm out/index.html +web: out/boids.js out/boids_bg.wasm out/index.html tarball: boids_web_root.tar -boids_web_root.tar: out/boids.js out/boids.wasm out/index.html +boids_web_root.tar: out/boids.js out/boids_bg.wasm out/index.html tar -caf $@ $< target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm: $(SRCS) @@ -18,7 +18,7 @@ out: # Both the JS and WASM files are generated by the wasm-bindgen call, so both # get to be on the target half of this recipe. -out/boids.js out/boids.wasm: target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm | out +out/boids.js out/boids_bg.wasm: target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm | out wasm-bindgen --no-typescript --target web --out-dir ./out/ --out-name boids target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm out/index.html: www/index.html From 0358935bf6866c62cbae947bbbf7768d33e02da4 Mon Sep 17 00:00:00 2001 From: Robert Garrett Date: Tue, 28 Oct 2025 15:04:45 -0500 Subject: [PATCH 08/36] Group the WASM & JS targets so they're built once https://www.gnu.org/software/make/manual/html_node/Multiple-Targets.html The previous recipe told Make that each file could be produced by running wasm-bindgen. The more correct expression is that *both* files will be produced at the same time. Now Make knows to only invoke the command one time to get both files if either is out of date. Previously, multi-job builds (`-j2`) could build the files twice -- one invocation for each out-of-date file. --- makefile_web | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/makefile_web b/makefile_web index 370d9c67..4411489f 100644 --- a/makefile_web +++ b/makefile_web @@ -18,7 +18,7 @@ out: # Both the JS and WASM files are generated by the wasm-bindgen call, so both # get to be on the target half of this recipe. -out/boids.js out/boids_bg.wasm: target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm | out +out/boids.js out/boids_bg.wasm &: target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm | out wasm-bindgen --no-typescript --target web --out-dir ./out/ --out-name boids target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm out/index.html: www/index.html From eca864ec8ea09ae25600dc7f1f21f1da61b6628c Mon Sep 17 00:00:00 2001 From: Robert Garrett Date: Tue, 28 Oct 2025 16:07:24 -0500 Subject: [PATCH 09/36] Use vars to hold target & profile in makefile_web I might sometimes build different profiles, so this gives me somewhere to change them. It *does not work* for debug builds because of how cargo works. So that sucks. I can't think of a reason anyone would seriously want to change the target, but I've made that a variable, too. WASM64 exists, but I can't get a read on it's availability across browsers. The benefit seems to be accessing >4GB of memory, which is not important for this project. Other targets are for "desktop" platforms and so shouldn't be using the makefile. --- makefile_web | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/makefile_web b/makefile_web index 4411489f..73dddafb 100644 --- a/makefile_web +++ b/makefile_web @@ -1,6 +1,12 @@ SRC_DIR = ./src SRCS := $(wildcard $(SRC_DIR)/**) +# Patch these to select a different build profile or target +# The target shouldn't change any time soon. WASM64, I guess. Other targets +# aren't aimed at the web, so you shouldn't be using this makefile. +CARGO_TARGET := wasm32-unknown-unknown +CARGO_PROFILE := wasm-release + .PHONY: clean full-clean web tarball web: out/boids.js out/boids_bg.wasm out/index.html @@ -10,16 +16,16 @@ tarball: boids_web_root.tar boids_web_root.tar: out/boids.js out/boids_bg.wasm out/index.html tar -caf $@ $< -target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm: $(SRCS) - cargo build --profile wasm-release --target wasm32-unknown-unknown +target/$(CARGO_TARGET)/$(CARGO_PROFILE)/another-boids-in-rust.wasm: $(SRCS) + cargo build --profile $(CARGO_PROFILE) --target $(CARGO_TARGET) out: mkdir $@ # Both the JS and WASM files are generated by the wasm-bindgen call, so both # get to be on the target half of this recipe. -out/boids.js out/boids_bg.wasm &: target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm | out - wasm-bindgen --no-typescript --target web --out-dir ./out/ --out-name boids target/wasm32-unknown-unknown/wasm-release/another-boids-in-rust.wasm +out/boids.js out/boids_bg.wasm &: target/$(CARGO_TARGET)/$(CARGO_PROFILE)/another-boids-in-rust.wasm | out + wasm-bindgen --no-typescript --target web --out-dir ./out/ --out-name boids target/$(CARGO_TARGET)/$(CARGO_PROFILE)/another-boids-in-rust.wasm out/index.html: www/index.html cp -a $< $@ From e16c0e2e3231e4c664199f83b8261aa59e1f426a Mon Sep 17 00:00:00 2001 From: Robert Garrett Date: Tue, 28 Oct 2025 16:12:09 -0500 Subject: [PATCH 10/36] Add and use a custom canvas element on the page Tell bevy to find the canvas with ID "#boids-canvas" instead of creating it's own. --- src/main.rs | 1 + www/index.html | 1 + 2 files changed, 2 insertions(+) diff --git a/src/main.rs b/src/main.rs index 3f8e48b8..f3f134a6 100644 --- a/src/main.rs +++ b/src/main.rs @@ -10,6 +10,7 @@ fn main() { App::new() .add_plugins(DefaultPlugins.set(WindowPlugin { primary_window: Some(Window { + canvas: Some("#boids-canvas".to_owned()), fit_canvas_to_parent: true, prevent_default_event_handling: false, ..default() diff --git a/www/index.html b/www/index.html index 03edae38..c9928e09 100644 --- a/www/index.html +++ b/www/index.html @@ -2,6 +2,7 @@ +