[HN Gopher] 14kb WASM game written in D ___________________________________________________________________ 14kb WASM game written in D Author : Shadonototra Score : 272 points Date : 2021-09-14 12:36 UTC (10 hours ago) (HTM) web link (skoppe.github.io) (TXT) w3m dump (skoppe.github.io) | [deleted] | tester34 wrote: | this is great! | | but ff shows that underrun.wasm is 35KB, what's going on? | destructionator wrote: | headline put the one compressed number instead of the | uncompressed number. There's also ~10KB of javascript bridge it | requires as well. | lifthrasiir wrote: | Yes. As far as I see index.html + underrun.wasm + l1.png + | q2.png combined will compress into about 20.1 KB of ZIP. | Still very small, but not 14 KB. | chrismorgan wrote: | The original JavaScript implementation: | https://js13kgames.com/games/underrun/index.html | | (It was a js13kgames submission in 2018; I'm guessing that this | being submitted here now is in some way linked to how Q1K3 is | currently on the homepage, also a js13kgames submission, though | for 2021. Pure speculation.) | hatch_q wrote: | Quite interesting... no noticeable difference in performance | between the two. FPS capped at 72fps. And pretty much identical | cpu/gpu load. | PetahNZ wrote: | Just FYI, its the browser that caps the FPS, you need to | change some flags to go higher. | teddyh wrote: | Link to author's site: https://phoboslab.org/underrun/ | | Source code: https://github.com/phoboslab/underrun | dragonshed wrote: | I wonder why the rewrite doesn't have music. | | The original js13k game implemented a small sonant-x player for | the audio, both sound fx and music. | tacticaldev wrote: | A LITTLE SLOWER, BUT WAY LESS BUGGY. Thanks for sharing the | link. Very cool for a 1k game. | brundolf wrote: | D is garbage-collected, right? How does the game plus the whole | runtime fit into 14kb? | lifthrasiir wrote: | It is using the BetterC mode which disables all runtimes | including gc. Spasm framework used by this demo is designed for | such use case. | destructionator wrote: | I did D including a custom runtime in about +20 KB of | webassembly over this (I just wanted to take a straight | desktop program and port it over). The runtime doesn't have | to be that big. | adenozine wrote: | Wow, what an impressive game for the web browser, and in such a | small size! | | I'm particularly impressed by the variable lighting of the | bullets down hallways, that's really quite masterful work. | | Kudos! | | Edit: I am impressed because I'm impressed. I spent a few | weekends recently messing around with pygame, and I had a really | hard time organizing my code and my thoughts. I do primarily | numerical, technical work, and I see that there is something | challenging about writing a game that I haven't come across much | in 25+ years. | | Feel free to shit on my comment, but I still think it's a very | cool project, and seeing it run so smooth in a web browser, in a | vm, on a beat up box with a Celeron was surreal to me. | AnIdiotOnTheNet wrote: | Ok, I'm not trying to take anything away from the developer | here but calling this "masterful" makes me think you must have | incredibly low expectations for webtech games and/or | developers. | elb2020 wrote: | Or incredibly low expectations for programmers in general, | which is fair. If you pick 100 random run-of-the-mill | programmers from any corporation, and ask them to repeat this | exercise, 95 of them would not even get out of the starting | blocks. I liked it. | rapind wrote: | The remaining 5 would talk like an elitist about their | peers? | [deleted] | sireat wrote: | Making a sticky game is much harder that it seems. | | Many of us could code something like this technically but it | would play horribly and look worse - and would be more than | 14kb of WASM | | It is the little things, the lighting, the little sound | effects, even the unlimited ammo | pjmlp wrote: | Impressive? 2011 says hi. | | "Unreal Engine 3 Support for Adobe Flash Player - Epic Citadel" | | https://www.youtube.com/watch?v=xzyCTt5KLKU | flohofwoe wrote: | Epic Citadel was a _lot_ bigger than 14 KBytes ;) | pjmlp wrote: | True, the point was more about what was possible before | Flash was sacked and is yet to be common with WebGL/WASM. | Mikeb85 wrote: | Literally every major engine allows exporting to | WebGL/WASM. So Unreal, Unity, Godot, etc... graphics can | all be done in WebGL (without a few of the bleeding edge | Vulkan/DirectX features). | moonchrome wrote: | A few of the bleeding edge features ? You obviously don't | know what you're talking about - WebGL 2.0 is not | supported on Safari and iOS [1] and WebGL 1.0 is based on | an API that was released in 2007 ! Even WebGL 2.0 is | based on ES 3.0 which is from 2008... | | [1] https://caniuse.com/webgl2 | TazeTSchnitzel wrote: | Safari is already shipping experimental support for WebGL | 2. It will be months, not years, before it is enabled by | default. | | Also, OpenGL ES 3.0 is not from 2008. The specification | was publicly released in August 2012, and of course it | took years before enough devices supported it well enough | (lots of driver bugs...) for it to be worth targeting. | | The web is certainly a few years behind the native-code | state-of-the-art, but it's not a decade behind. There's a | lot you can do with these mature APIs. | pjmlp wrote: | And finally gets supported in Safari, on the year when | graphics card are moving into mesh shaders and | raytracing, with WebGPU still one year away as MVP 1.0. | moonchrome wrote: | >It will be months, not years, before it is enabled by | default. | | So in a few months we'll have feature parity with 2012 | mobile HW ? | | I have quit 3D development around 2015 but I remember | trying to use MRT on webgl to do some basic deferred | shading and you could run on FF and Chrome desktop only. | It's infuriating that 7 years later it's still the case. | I used this technique when I was learning 3D programming | in 2007. Calling this cutting edge is just... | pjmlp wrote: | And yet nothing that can match something like Citadel or | Infinity Blade has been produced. | | Those "bleeding edge" features, are all GPU hardware | advances since GL ES 3.0 was released. | aww_dang wrote: | Unreal 4 offers a WASM target. | | https://docs.unrealengine.com/4.27/en- | US/SharingAndReleasing... | pjmlp wrote: | I know, but that wasn't the question, rather what has | been actually produced with it, given that Infinity Blade | was created with Unreal 3 for iOS in 2008. | | An hardware that WebGL 2.0 is supposed to be much better. | | Instead most online games look like Amiga 500 stuff | instead. | badsectoracula wrote: | This is more because there isn't an incentive (monetary | or otherwise) to do that. When Flash gaming was big, web- | based games were on the desktop but web games never took | off on mobile which got pretty much all the audience they | used to have on the desktop. Instead mobile games are | largely native (or at least in app form). | | I agree that it took _many_ years for HTML5 /JS to reach | Flash's capabilities (and some stuff like easily swapping | around SWF files is still not as easy to do) and i | dislike how Flash was forcibly killed instead of losing | its popularity "naturally" (though it being proprietary | technology instead of some open standard or at least an | open source project help its murder considerably), but | the reason you do not see Citadel-level stuff on HTML5/JS | has more to do with not being much of an incentive to do | something like that than the technology being able or not | (demos like After the Flood[0], which has as much | gameplay as Citadel yet it shows more advanced rendering | techniques - you can even look yourself in the glass | reflections :-P - show that it is technically possible). | | [0] https://playcanv.as/e/p/44MRmJRU/ | zamadatix wrote: | That's something on the order of ~5,000 times the size and | looks extremely bland/boring. | pjmlp wrote: | Might be boring, yet where are the WebGL/WASM versions that | are the modern versions thereof? | caslon wrote: | The Citadel demo already works with Emscripten, | so...still Citadel. | pjmlp wrote: | So nothing new since 2011. | caslon wrote: | "Turing machines can all do the same calculations. This | is a novel and worthwhile thing to complain about on | Hacker News that no one has ever heard before." | zamadatix wrote: | Boring demos are available anywhere you care to search. | https://playcanvas.com/explore is the typical goto for | this kind of 3d market these days. Particularly popular | in the mobile OS and web game (e.g. facebook) space. | Robostorm, seemore, and After The Flood are their demos. | | Unity and Unreal can both export large games to the Web | just fine but people found out they didn't want to serve | 50 GB games to a temporary client. | code_checker4 wrote: | > A D port of a js13k competition game written by Dominic | Szablewski. [0] | | -- [0] - | https://github.com/skoppe/spasm/tree/master/docs/examples/un... | teddyh wrote: | https://github.com/phoboslab/underrun | brundolf wrote: | I appreciate the quality of the art given that this is presented | (at least partially) as a tech demo! Oftentimes you don't get | both; it's refreshing to see | chrismorgan wrote: | A few errors: | | * There's an & that should be either & or &, depending on | whether it's setting HTML or text. | | * The opening garbage text is mojibaked, so that it looks like... | different, not as aesthetically pleasing garbage. | | * The text that's supposed to be like "7 SYSTEM(S) STILL OFFLINE" | is getting mangled badly, missing much of the string and getting | a bunch of U+0000s in it--unchecked and incorrect string | indexing, by the looks of it. Hmm... "1STIL1" actually looks like | something's clobbering the string literal stillOffline. Ouch; | that actually worries me, though I hope it's largely just a side- | effect of some shortcuts taken to keep the code tiny and not | something that would normally be an issue? | | * terminal_text_outro has some double quotes that should be | single quotes (apostrophes). | | Other than that, seems to be working well. | phoboslab wrote: | For what it's worth, the original 13kb JS only version[1] does | not have these problems. | | I was confused for a second why this game made its way to HN | again (there's a making of for the game itself from 2018[2]). | This seems to be a port of the game to D[3] as a demo for a | WASM runtime, Spasm, which is also written in D[4]. | | [1] https://phoboslab.org/underrun/ | | [2] https://news.ycombinator.com/item?id=18031024 | | [3] | https://github.com/skoppe/spasm/tree/master/examples/underru... | | [4] https://github.com/skoppe/spasm | umvi wrote: | The style of this game reminds me strongly of "Teleglitch": | | https://store.steampowered.com/app/234390/Teleglitch_Die_Mor... | the_af wrote: | The graphics definitely resemble Teleglitch! Though that game | is more complex, what with the combination of items... | krumpet wrote: | In the "making of" post, Dominic references Teleglitch when | discussing the graphic assets. | | https://phoboslab.org/log/2018/09/underrun-making-of | Andrex wrote: | I remember paying money for Impact.js (HTML5 game engine by | PhobosLab) and it was leagues ahead of any rivals for quite a | while IIRC. | | PhobosLab is awesome and it's great to see Dominic Szablewski | pushing web-gaming forward to this day. Hope to see it continue. | :) | [deleted] | edgls wrote: | Pretty impressive performance. It seems web assembly is pretty | good tech for writing a performant web app. Is there any | benchmark comparing web assembly vs javascript? I mean the same | logic executed by javascript code vs the web assembly. | | Also curious to know if there are any serious web apps developed | using web assembly. | [deleted] | chrismorgan wrote: | I compared it casually with the original JavaScript | implementation: in both Firefox and Chrome, both JS and WASM | hit max FPS easily (165, in my case, incidentally). According | to Firefox's profiler, the JS version experiences noticeably | more frequent jank; Chrome's profiler doesn't obviously show | any jank for either. In Firefox, both are around 50% idle and | there's no obvious difference in their performance, though they | definitely have different hot spots. In Chromium, indications | suggest the WASM is being a few percent more efficient, | spending 68-70% idle versus JS's 65-66%; it spends much less | time in scripting (~17% vs. ~22-23%), but more in rendering, | painting and "system" (whatever that is) which make up the | balance of that 100%. | | These results are _utterly_ unscientific. You also can't | compare Firefox and Chrome's profiling numbers to one another. | tempest_ wrote: | My understanding is WASM is pretty performant except in the | case when it needs to interact with browser apis / js where is | preforms quite a bit worse than JS. | vbm wrote: | I recently discovered https://lekh.app which uses web assembly. | I had a conversation with the developer and he told me that he | is using web assembly for the core diagramming and shape | recognition logic. The app is for diagramming and | whiteboarding. The whole diagramming and AI (to recognize | shapes) is compiled into ~1M of web assembly. | rajeevk wrote: | I am the developer of https://lekh.app When I first | experimented with the web assembly, it was kind of magic for | me. I had a diagramming app called Lekh Diagram | (https://lekh.app/diagram.html). The core logic was written | in C++ and is being used in Android and iOS apps. I wanted to | make a collaborative web version of the app. Initially I | thought I would have to rewrite everything in Javascript. But | when I first tried to compile all the c++ code into web | assembly, it was around 4M of web assembly. And the | performance was awesome. I was pretty satisfied with 4M. Then | I started developing the Lekh Board (web version of the | diagramming app). Later in the development phase, I realized | there is a flag which I can pass to reduce the size further. | Then I got the web assembly size ~1M. | nikki93 wrote: | Figma uses webassembly. We also use it for our web engine at | https://castle.xyz, I gave at talk about that you can watch | here: https://youtu.be/0FjCaoc1uzs where I go into some details | and also do some live wasm game development (not sure how | "serious" since we're still working on our app though). | | Much, much better performance than JS is possible because | (among many other things) you can perform a lot of | optimizations during AOT compilation due to eg. LLVM, avoid GC | and arrange memory to help cache efficiency. | | Re: JS call overhead, ultimately using instanced drawing so you | have a constant number of draw calls even for a growing number | of objects is what helps. | tmountain wrote: | As an aside, castle.xyz looks really cool! I can't wait to | play around with it. | Thaxll wrote: | I'm not sure there is a difference for webgl calling it from | Wasm vs JS? | AnIdiotOnTheNet wrote: | I don't think you say much about the performance here except | that it isn't noticeably terrible. Any modern computer should | be expected to run this kind of thing with a smooth framerate | using paltry resources. I would expect this even if this had | been written directly in javascript. | jand wrote: | This uses webgl, right? Maybe feedback to the user in case of | missing support would be useful. | | Else folks get stuck at "Initializing..." with an exception in | the console. Not everybody checks the console. | | (TypeError: can't access property "createBuffer") | | Edit: stuck at "Initiating..." | newfie_bullet wrote: | Yeah I first tried this in Safari and just had a black screen - | edge/chrome worked just fine. Notice/pop-up would be helpful | Zardoz84 wrote: | work fine on Firefox | nikki93 wrote: | This may be due to requiring WebGL 2 specifically, and not | WebGL generally. | Narishma wrote: | I don't think so. It works on my laptop that only supports | WebGL 1. | Wevah wrote: | It looks like it might be due to Safari pre-15 not | supporting WebAssembly.instantiateStreaming(). | nikki93 wrote: | Ah yes that would also be an issue! | edgls wrote: | Running fine on Firefox on Mac OS | city41 wrote: | This is my first exposure to Spasm (a wasm web framework where | apps are written in D) and my first impressions are quite | positive. | | https://github.com/skoppe/spasm | Newtonip wrote: | My initial reaction to the title was "what genre is WASM?". Then | I remembered it means web assembly. | bachmeier wrote: | A little background information from the author in this post: | https://forum.dlang.org/post/cpdnekfjletgezqvqayz@forum.dlan... | | Includes links to a couple other examples. | abhimanyu003 wrote: | This is really amazing work, super impressed with such a small | size, gameplay mechanics, and how smooth it works. Bullet | animations are super impressive. | sgt wrote: | I only see a black screen in Safari. | tacticaldev wrote: | SUPER IMPRESSIVE, SUPER BUGGY... VERY COOL (OVER ALL)... | mstange wrote: | WASD doesn't work by default because I'm using a Dvorak keyboard | layout. Using KeyEvent.code would solve this problem. | marty8 wrote: | ui | marty8 wrote: | hi | hmmokidk wrote: | How does one learn what it takes to do this? | sgt wrote: | Say if you increased the resolution here to become significantly | less blocky, would it work with browsers in general or would it | consume considerable amount of CPU? | the_af wrote: | I think the blockiness is an aesthetic choice, much like in the | awesome roguelike Teleglitch. I like it! | johnnyApplePRNG wrote: | Why does my mouse not move the direction of the gun when pressing | W, A, S or D? | | Was frustrated by a similar experience with Q1K3 earlier. | sgt wrote: | Also, what is the advantage using D for this? Could this be D's | niche market? It looks really exciting. | mhh__ wrote: | > Could this be D's niche market? | | Maybe it could be, but our goal is not to have "niches". If | anything, our niche is making people who would otherwise not | be, productive enough to deliver what they want to make. | | D isn't a gimmick language, it's a _Programming_ (with a | capital P!) language. | jug wrote: | They're not the best metrics but the related Spasm toolkit had | surprisingly many stars and forks for being D. This was the | more interesting tool I discovered here, rather than the JS | game port to D, where honestly the impressive part is already | done in JS. | | So yes it got me thinking the same thing. | | https://github.com/skoppe/spasm | mhh__ wrote: | > had surprisingly many stars and forks for being D. | | Github stars are an extremely weak signal. Some D users have | actually said to me that they feel slightly confused that | their projects have more stars than the actual language | implementation on github just because of hype, for example. ___________________________________________________________________ (page generated 2021-09-14 23:01 UTC)