Show HN: Porting Terraria and Celeste to WebAssembly

338•coolelectronics•8mo ago

Comments

rlmineing_dead•8mo ago

Cool to see FNA/XNA projects projects working in the browser

dwattttt•8mo ago

It's really impressive how much worked out of the box, decompiling a C# binary, then recompiling it for a target as different as WASM.

underdeserver•8mo ago

And then it's also really impressive how much they did to get to the end.

jasonjmcghee•8mo ago

Getting firebase "bandwidth quota exceeded" error when trying the demo.

You shouldn't have to worry about this kind of stuff if it's just a static site.

I'd host this on a cdn like cloudflare or github pages (free!).

coolelectronics•8mo ago

My bad! Switched over to the github pages fallback. Cloudflare pages isn't suitable because the wasm files (100mb+) exceed the 25mb limit. (i could bypass this with service worker jank but that tends to be fragile). Github Pages also isn't suitable because it doesn't have a native way of sending the coi/coep headers that are required for SharedArrayBuffer to be available. Can also bypass that with service worker jank but I would prefer not to

hoten•8mo ago

btw: this results in a white page on the first load until you manually reload, since the SW has not been loaded yet. May want to force a page reload on the SW install event to fix.

also: this is incredibly cool. thanks for writing this up and sharing!

truemotive•8mo ago

Cloudflare R3 might suit the scenario better for you in terms of the heavy assets, it's like AWS S3 except for the cool part where you aren't charged for data egress (last I checked! haha)

I'm about to buy Terraria after all these years, just so I can get the assets and check this out. You're cool :)

vlovich123•8mo ago

NortySpock•8mo ago

Oh Terraria is totally worth it, especially when spelunking with friends.

Its better than Minecraft, in my opinion.

tech234a•8mo ago

Depending on how well the files compress, you could try: https://developer.mozilla.org/en-US/docs/Web/API/Compression...

bakkoting•8mo ago

The service worker jank, while conceptually hacky, is actually remarkably un-janky and not really noticeable to users! It's very much fire-and-forget unless you also wanted to have another service worker (in which case it's time for suffering; service workers aren't even a little bit composable).

For anyone wondering: https://github.com/gzuidhof/coi-serviceworker or https://github.com/WebReflection/mini-coi

01HNNWZ0MV43FF•8mo ago

This is very cool. However, the blog itself is not hitting 60 FPS on my Firefox. Probably that background effect?

dgb23•8mo ago

I found that effect disturbing and distracting. It's rendered in a canvas element that you can delete via the inspector.

caminanteblanco•8mo ago

This is absolutely amazing! I intend to use this on my Chromebook ASAP

71bw•8mo ago

Your (?) website is so resource-demanding it's insane. I'm struggling to run it at any decent framerate on an i5-7500T. Makes the entire browser just crumble

poink•8mo ago

I scrolled through the whole thing on my phone and it was fine

01HNNWZ0MV43FF•8mo ago

Weird huh

doix•8mo ago

You can disable javascript on the site and it works perfectly. I'm guessing it's this thing that destroys performance https://velzie.rip/static/background.js

kunwon1•8mo ago

The moving background is absolutely intolerable, I didn't last ten seconds

midzer•8mo ago

Celeste Classic in WASM https://midzer.de/wasm/celeste/

badmintonbaseba•8mo ago

For some reason that runs at like double speed for me, very challenging.

flohofwoe•8mo ago

Sounds like the game uses a fixed 60hz frame step but maybe you're on a 120hz display? Chrome and FF run requestAnimationFrame at 120hz in this case (while Safari sticks to 60hz)

badmintonbaseba•8mo ago

Possibly, I'm indeed on a 120Hz display. I still got up to 1600m, it's a good challenge.

edit: 2000m now that I revisited. Crazy hard.

badmintonbaseba•8mo ago

Made it to the summit at double speed.

  :strawberry:x14
  3:17:46
  deaths:1981

nottorp•8mo ago

Don't link your world status updates to the frame rate please.

Even "AI"s know to show you how to do it in spite of requestAnimationFrame. I know, I asked.

But you have to ask them specifically to decouple game world updates from drawing, or they'll give you the dumb solution.

flohofwoe•8mo ago

It's still a surprisingly tricky topic because simply measuring the frame duration (or using rAF's timestamp) gives significant timing jitter - which in turn introduces microstutter (and the other problem is that some browsers still limit timer precision to whole milliseconds due to the Specter/Meltdown fallout - but at least here the random jitter is useful because averaging over enough frames gives you the precise frame duration back, eg 16.667 or 8.333 ms instead of 15<=>17 or 7<=>9 ms

nottorp•8mo ago

That’s no excuse if you ask me. Browsers aren’t consoles with fixed hardware. TBH not even consoles are fixed hardware any more …

flohofwoe•8mo ago

Not an excuse, but the web platform should really offer better solutions to fix the microstutter problem when trying to implement a variable time step. Because currently there's no robust solution possible in "user space" (eg any type of noise removal filter will run into problems when the refresh rate suddenly changes, like moving the browser window to a display with different refresh rate).

delusional•8mo ago

> One of my favorite genres of weird project is "thing running in the browser that should absolutely not be running in the browser". Some of my favorites are the [...] the direct recompilation of Minecraft 1.12

Heh, you'd think Minecraft would be exactly the sort of thing that absolutely should be running in the browser, considering it was originally a Java applet.

I understand the point, I just find it amusing.

pjmlp•8mo ago

Even more interesting is this idea of running WebAssembly on the server, in containers, with orchestration services among them, and communicating across sandboxed environments.

Somehow it reminds me of something, but memory is getting fuzzier nowadays. /s

baq•8mo ago

You’re obviously talking about the 1972 VM/370 right?

pjmlp•8mo ago

Naturally.

pjc50•8mo ago

WebSphere!

voidUpdate•8mo ago

Early minecraft versions did run in the browser before it was made a standalone app, and they recreated it recently https://classic.minecraft.net

HelloUsername•8mo ago

> recently

6 years ago? https://news.ycombinator.com/item?id=19861584

James_K•8mo ago

I've recently started trying to do a bit of basic game development targeting the web through WASM+OpenGL+SDL, and I must say, I'm shocked with how easy it is. I spent more time fiddling with CMake files than I did trying to the code to run on the web. There are still some limitations and rough spots on the web platform, but I've honestly had a much harder time compiling things for Windows or MacOS than for WASM.

Fraterkes•8mo ago

Dumb question: do you have access to any of the nice text rendering features of the browser when you use Wasm, or is it basically just drawing to a canvas

James_K•8mo ago

There is an Emscripten library which cross-compiles things to WASM. The means you can generally just pull in a dependency for font rendering, such as SDL_ttf.

flohofwoe•8mo ago

There's no difference between WASM and JS in this situation.

Once you are in canvas land, you'll have to do the text rendering yourself - that's not the fault of JS or WASM though, but of the broken web API stack (what's there is not properly layered, and the whole layer stack is inverted, e.g. canvas sits on top of the DOM instead the DOM sitting on top of canvas).

parallax_error•8mo ago

Safari on ios really hates this, all 3 demos crash upon loading lol

kkukshtel•8mo ago

This post presupposes a bit of knowledge about C#/WASM and Native code linking in the C# ecosystem. I wrote a post a while back that could be a complement to this that does some more level setting about what's possible these days with compiling C#-based engines to the web for those that don't already have the context:

So You Want To Compile Your C# Game Engine To The Web With WASM

https://kylekukshtel.com/csharp-wasm-game-engine-compile-web...

modeless•8mo ago

Porting games to the web is a fun hobby! I've done Quake III [1] and Cave Story [2]. Just like in this story it's all about the details. Getting the game loading is just the start. Things like adding touch controls for mobile, handling multiplayer, managing save files, supporting modern screen resolutions and frame rates, they take more time than the initial port.

[1] Single player: https://thelongestyard.link/q3a-demo/ Multiplayer: https://thelongestyard.link/q3a-demo/?server=HN

[2] https://thelongestyard.link/cave-story/

Spunkie•8mo ago

It seems cool but haven't been able to get it working. I'm downloading terraria assets with the from steam option but its at only 5% after an hour.

acheong08•8mo ago

This is so cool. Last time I played Terraria was back in 2014. One minor complaint: the resolution is too high & everything is scaled down a ton. It would be nice if we could have it scaled at 200% so i can actually see the text and icons

inlinestyle_it•8mo ago

Amazing work. But I'm wondering, this is only for your own personal use right? Because the projects you are talking about here are still covered by copyright and thus even if you were the one who ported them to the web it's still not possibile to redistribute them for other people benefit.

If you are interested in taking a look, we run a cloud gaming service based on WASM at https://gaming.inlinestyle.it with cloud saves support. Many of things you discussed are related to what we had to do too, but we tried to do it only for opensource and freeware games so that everyone can benefit from them and play them on the cloud.

Appreciate any suggestion you have on how to improve the service!

OpenCiv3: Open-source, cross-platform reimagining of Civilization III

The Waymo World Model

Why I Joined OpenAI

Show HN: Look Ma, No Linux: Shell, App Installer, Vi, Cc on ESP32-S3 / BreezyBox

Monty: A minimal, secure Python interpreter written in Rust for use by AI

Dark Alley Mathematics

Show HN: I spent 4 years building a UI design tool with only the features I use

A century of hair samples proves leaded gas ban worked

Microsoft open-sources LiteBox, a security-focused library OS

Sheldon Brown's Bicycle Technical Info

Show HN: If you lose your memory, how to regain access to your computer?

Hackers (1995) Animated Experience

An Update on Heroku

Show HN: R3forth, a ColorForth-inspired language with a tiny VM

I spent 5 years in DevOps – Solutions engineering gave me what I was missing

How to effectively write quality code with AI

Introducing the Developer Knowledge API and MCP Server

Understanding Neural Network, Visually

I now assume that all ads on Apple news are scams

PC Floppy Copy Protection: Vault Prolok

Learning from context is harder than we thought

FORTH? Really!?

Evaluating and mitigating the growing risk of LLM-discovered 0-days

Show HN: Smooth CLI – Token-efficient browser for AI agents

I'm going to cure my girlfriend's brain tumor

The Oklahoma Architect Who Turned Kitsch into Art

Show HN: Slack CLI for Agents

Claude Composer

How virtual textures work

The Beauty of Slag

OpenCiv3: Open-source, cross-platform reimagining of Civilization III

The Waymo World Model

Why I Joined OpenAI

Show HN: Look Ma, No Linux: Shell, App Installer, Vi, Cc on ESP32-S3 / BreezyBox

Monty: A minimal, secure Python interpreter written in Rust for use by AI

Dark Alley Mathematics

Show HN: I spent 4 years building a UI design tool with only the features I use

A century of hair samples proves leaded gas ban worked

Microsoft open-sources LiteBox, a security-focused library OS

Sheldon Brown's Bicycle Technical Info

Show HN: If you lose your memory, how to regain access to your computer?

Hackers (1995) Animated Experience

An Update on Heroku

Show HN: R3forth, a ColorForth-inspired language with a tiny VM

I spent 5 years in DevOps – Solutions engineering gave me what I was missing

How to effectively write quality code with AI

Introducing the Developer Knowledge API and MCP Server

Understanding Neural Network, Visually

I now assume that all ads on Apple news are scams

PC Floppy Copy Protection: Vault Prolok

Learning from context is harder than we thought

FORTH? Really!?

Evaluating and mitigating the growing risk of LLM-discovered 0-days

Show HN: Smooth CLI – Token-efficient browser for AI agents

I'm going to cure my girlfriend's brain tumor

The Oklahoma Architect Who Turned Kitsch into Art

Show HN: Slack CLI for Agents

Claude Composer

How virtual textures work

The Beauty of Slag

Show HN: Porting Terraria and Celeste to WebAssembly

Comments