Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Show HN: I've re-implemented the Doom fire effect in plain JavaScript

github.com

Post reply on HN
Print view View original

11–20 of 24 posts

Re: Show HN: I've re-implemented the Doom fire effect in plain JavaScript

#11

Post by isharamet »

ricardobeat wrote: post #4

Maybe it wasn't clear in the original article [1], but what you see inline are javascript implementations of the effect - there is a link to the source code at the end: https://codepen.io/svkaiser/pen/xXmOvY [1] http://fabiensanglard.net/doom_fire_psx/

+ link to GitHub

https://github.com/fabiensanglard/DoomFirePSX/blob/master/fl...

Re: Show HN: I've re-implemented the Doom fire effect in plain JavaScript

#16

Post by z3t4 »

city41 wrote: post #8
z3t4 wrote: post #3

It's a bit slow. I suggest 1) Use existing table instead of creating a new table at each frame/interval. 2) Or use Canvas because DOM is so slow 3) requestAnimationFrame instead of setInterval

For canvas I’d be curious which would be faster: grabbing an ImageData and continually update then set or use fillRect.

You always get surprises when optimizing, for example IE11 and probably other browsers use DOM optimization with hardware acceleration, so keeping it as a table, and just changing the bgColor instead of creating a new table, might be fast, fast enough, or even faster then canvas. As for imageData vs fillRect I would go with fillRect first as it makes it easier to scale to the clients pixelRatio, eg you want to scale to 200% on a device that has a pixel ratio of 2 in order to make it look crisp. In my experience, manipulating single pixels are sometimes also slower! But if you really want to get advanced you could divide the screen up in different pieces and use many (off-screen) canvas's and/or web workers, but it would probably only work on Chrome, and then you would operate on the imageData buffer.

Re: Show HN: I've re-implemented the Doom fire effect in plain JavaScript

#17

Post by j45 »

mrspeaker wrote: post #5

I first learned to do this effect in 1999 thanks to the incredible Denthor/Asphexia tutorials. I looked forward to new releases of these that my friend would (somehow) get and give to me on a floppy disk. Most of them were in Pascal, but the fire one was in asm ( http://archive.gamedev.net/archive/reference/articles/articl... ) - it was the first time that assembler really clicked for me!

I remember this tutorial's intro via ASM to help solve a challenge of making fire run the same on a 386 sx16 as a 486 dx2/66, a big jump at the time.

Still a little humorous that optimizing fire is still a topic that gathers attention and optimization despite the increase in computing power.

Re: Show HN: I've re-implemented the Doom fire effect in plain JavaScript

#18

Post by haasted »

myth_drannon wrote: post #7
mrspeaker wrote: post #5

I first learned to do this effect in 1999 thanks to the incredible Denthor/Asphexia tutorials. I looked forward to new releases of these that my friend would (somehow) get and give to me on a floppy disk. Most of them were in Pascal, but the fire one was in asm ( http://archive.gamedev.net/archive/reference/articles/articl... ) - it was the first time that assembler really clicked for me!

Oh wow. Denthor's tutorials were very good. Brings lots of good memories. Too bad this culture was overrun by internet.

I remember those! Incredibly accessible. Also remember writing Den(e?)thor as an insecure, new-to-the-internet 16-year old asking whether more tutorials were in production. Never received an answer, unfortunately.

Wonder what he (?) is doing today.

Re: Show HN: I've re-implemented the Doom fire effect in plain JavaScript

#19

Post by perakojotgenije »

mrspeaker wrote: post #5

I first learned to do this effect in 1999 thanks to the incredible Denthor/Asphexia tutorials. I looked forward to new releases of these that my friend would (somehow) get and give to me on a floppy disk. Most of them were in Pascal, but the fire one was in asm ( http://archive.gamedev.net/archive/reference/articles/articl... ) - it was the first time that assembler really clicked for me!

Oh yes, brings back memories. For us older folks who'd like to revisit those tutorials here's the archive: http://archive.gamedev.net/archive/reference/listed82.html?c...
Post reply on HN