This is weird. I remember last time this ran fluid, maybe 30 fps or even more. Now I get like 2 fps. Did you change anything? Or did somebody inject a crypto miner? You never know these days.
That’s indeed weird. I’ve changed nothing tbh since uploading the version 0.0.7 with the Quake demo, apart from adding a GIF preview of E1M1 as you’ve pointed out. 🤔 It may or may not be related to that, but more often than not I’ve seen new browser versions effecting how the engine performs against demanding maps/models with high number of meshes. (My engine is highly dependent on the optimizing performance of the browser JIT compiler it runs on since everything’s done on the CPU with 0 GPU utilization) Did you have a chance to test it out in different browsers, I’m currently getting somewhere between 20 to 30 FPS in Chromium-based browsers.
If I remember correctly, it can use the GPU, and do 3D vector calculations in a single processor instruction (like shaders do). Sounds perfect for a software renderer. You might end up faster than webGL.
Also, there seems to be a competition for the keyboard, the game doesn't have full focus. When I press up/down, the page scrolls, despite mouselock. (Pretty scary, watching comments, no mouse^^)
Here's what I do to get forced, exclusive focus, despite itch's messing with the keys handler. I add to the canvas an onclick handler, that calls a function that will:
var mycanvas=document.getElementById('yourcanvas'); mycanvas.setAttribute('tabindex','0'); mycanvas.focus();
It could be, that by not having full focus, the thread has a low cpu priority.
Also, have a look at the js error console, there's a bunch of warnings.
Looking good. You say it's the 2d context, so it's a software renderer? That's ambitious. Despite potential speed limits, or polycount, looking great so far. Make sure to support lightmaps, alpha-masked textures and add-blendmode.
Thanks! Yup, it’s 100% on the CPU and all written from scratch in JavaScript. Just loaded up Quake E1M1 in the demo today, the framerate is crap right now due to not having implemented any scene management, occlusion culling or any sort of fancy stuff whatsoever, but it’s still somewhat a progress that the engine can handle (i.e., doesn’t actually shit itself lol) 6k+ polygons that I throw at it.
Well, if you know your way around JavaScript, then it’d be pretty trivial to setup something very similar. I’m using the "2d" context of the HTML5 <canvas /> for all the 3-D work. Think of it as a 1-D array of bytes, where each 4-byte group represents a color (with 4 distinct channels that make up a pixel: red, green, blue, and alpha) at the corresponding pixel. At each frame I’m filling up that array and handing it over to the <canvas /> for it to actually display on the screen.
If what you’re looking for is to get into 3-D math, then my ultimate advice would be to use a pen and paper to try to come up with solutions by yourself, and only resort to looking up solutions online if you’re stuck. 3-D math is a journey you have to go through on your own. (Or you can follow along a tutorial or two, and speed up the process in the expense of not totally understanding the underlying theory of linear algebra.)
Cool I am glad you replied at all so thanks. The first part makes perfect sense it follows the general formula of how graphics tend to be displayed and all that so yh I was looking to get into 3-D math. The whole point of doing something like is that special do it yourself feel so I don't want any hand outs. I'll just study algebra and try to make something happen if you have any non specific pointers on what else to study that would be great thanks
← Return to game
Comments
Log in with itch.io to leave a comment.
This is weird. I remember last time this ran fluid, maybe 30 fps or even more. Now I get like 2 fps. Did you change anything? Or did somebody inject a crypto miner? You never know these days.
Or maybe it's the GIFs on the same page.
That’s indeed weird. I’ve changed nothing tbh since uploading the version 0.0.7 with the Quake demo, apart from adding a GIF preview of E1M1 as you’ve pointed out. 🤔 It may or may not be related to that, but more often than not I’ve seen new browser versions effecting how the engine performs against demanding maps/models with high number of meshes. (My engine is highly dependent on the optimizing performance of the browser JIT compiler it runs on since everything’s done on the CPU with 0 GPU utilization) Did you have a chance to test it out in different browsers, I’m currently getting somewhere between 20 to 30 FPS in Chromium-based browsers.
I tried that car at https://emre-aki.github.io/tmp3d/
It's about 10 fps on this non-gamer 2018 laptop. Try use the option to run the game in a new tab.
And maybe it's worth to look into that js assembler thing:
https://developer.mozilla.org/en-US/docs/WebAssembly
If I remember correctly, it can use the GPU, and do 3D vector calculations in a single processor instruction (like shaders do). Sounds perfect for a software renderer. You might end up faster than webGL.
Also, there seems to be a competition for the keyboard, the game doesn't have full focus. When I press up/down, the page scrolls, despite mouselock. (Pretty scary, watching comments, no mouse^^)
Here's what I do to get forced, exclusive focus, despite itch's messing with the keys handler. I add to the canvas an onclick handler, that calls a function that will:
var mycanvas=document.getElementById('yourcanvas');
mycanvas.setAttribute('tabindex','0');
mycanvas.focus();
It could be, that by not having full focus, the thread has a low cpu priority.
Also, have a look at the js error console, there's a bunch of warnings.
Looking good. You say it's the 2d context, so it's a software renderer? That's ambitious. Despite potential speed limits, or polycount, looking great so far. Make sure to support lightmaps, alpha-masked textures and add-blendmode.
Thanks! Yup, it’s 100% on the CPU and all written from scratch in JavaScript. Just loaded up Quake E1M1 in the demo today, the framerate is crap right now due to not having implemented any scene management, occlusion culling or any sort of fancy stuff whatsoever, but it’s still somewhat a progress that the engine can handle (i.e., doesn’t actually shit itself lol) 6k+ polygons that I throw at it.
This is pretty kick ass
Hey, thanks!
I will probably never get around to it but how would I go about learning to do the same thing? Or similar. I am familiar with javascript.
Hey there, sorry for the late reply! =(
Well, if you know your way around JavaScript, then it’d be pretty trivial to setup something very similar. I’m using the
"2d"context of the HTML5<canvas />for all the 3-D work. Think of it as a 1-D array of bytes, where each 4-byte group represents a color (with 4 distinct channels that make up a pixel: red, green, blue, and alpha) at the corresponding pixel. At each frame I’m filling up that array and handing it over to the<canvas />for it to actually display on the screen.If what you’re looking for is to get into 3-D math, then my ultimate advice would be to use a pen and paper to try to come up with solutions by yourself, and only resort to looking up solutions online if you’re stuck. 3-D math is a journey you have to go through on your own. (Or you can follow along a tutorial or two, and speed up the process in the expense of not totally understanding the underlying theory of linear algebra.)
Cool I am glad you replied at all so thanks. The first part makes perfect sense it follows the general formula of how graphics tend to be displayed and all that so yh I was looking to get into 3-D math. The whole point of doing something like is that special do it yourself feel so I don't want any hand outs. I'll just study algebra and try to make something happen if you have any non specific pointers on what else to study that would be great thanks