javascript demoscene framework
category: code [glöplog]
Is there any decent js-framework for demoscene? I know nin by ninjadev, but it's more like demotool than framework. And three.js, but it's more about 3d, not demoscene.
What exactly do you need that's not in three.js?
Any game development framework would/could be suitable for demo scene stuff?
You've got your graphics, your audio, even scene managers and such.
If I was nitpicky I'd say JS *is* a demo-framework. It has everything out of the box. No need for any external libraries.
You've got your graphics, your audio, even scene managers and such.
If I was nitpicky I'd say JS *is* a demo-framework. It has everything out of the box. No need for any external libraries.
By the way, check out p5js if you haven't already.
js1k examples are decent starting points if you want a minimal framework.
else there are a few javascript demos with open source around. all of mine are open source, p01's stuff is also open source, and damones has an engine aswell available, ninjadev have their demotool that you mentioned.
if you want more advanced stuff with graphical node interface you have vizor.io and cables.gl made by sceners with a few demos done for them.
else there are a few javascript demos with open source around. all of mine are open source, p01's stuff is also open source, and damones has an engine aswell available, ninjadev have their demotool that you mentioned.
if you want more advanced stuff with graphical node interface you have vizor.io and cables.gl made by sceners with a few demos done for them.
http://codef.santo.fr/
"CODEF aka Canvas Oldshool Demo Effect Framework, is a an open source framework that makes it easy to build demos-like animations that run in a web browser"
"CODEF aka Canvas Oldshool Demo Effect Framework, is a an open source framework that makes it easy to build demos-like animations that run in a web browser"
I wasn't aware that three.js was created by a demoscener! Funny...
Quote:
must not have come up in the mensa meetingsI wasn't aware that three.js was created by a demoscener! Funny...
Javascripting is not coding, its scripting!
Quote:
Javascripting is not coding, its scripting!
now really.
There's nothing wrong with using JS imo. The language sucks, but so does x86 asm, C, or FUCKING C++ (which is the one of the worst languages available out there imo).
It is possible to write maintainable and well-written JS just as it is possible to do in assembly. Let them choose their tools.
"A good programmer can overcome a poor language or a clumsy operating system, but even a great programming environment will not rescue a bad programmer." (Kernighan and Pike)
On top of that, they might want to make the intentional design decision not to fuck around with handcrafted assembly because it's just taking 100 times as much time and effort to achieve anything relevant using it. I respect both approaches.
LOLZ ALL WEB BROGRAMMERS ARE NOOP
Three.js currently (r153) takes 432 kB (109 kB gzipped) even with tree-shaking when we write pretty simple stuff.
I was joking, if that was not somehow understood =) so here we are
sorry @leGend, my bad, completely misunderstood
https://webgl2fundamentals.org/webgl/lessons/webgl-fundamentals.html
even has boilerplate code and a tutorial how to steal shadertoy shaders so how much more demoscene do you want it? :P
even has boilerplate code and a tutorial how to steal shadertoy shaders so how much more demoscene do you want it? :P
i recall using one of webgl2fundamentals examples as base for https://github.com/psenough/heart_of_molvania after a few shaders weren't working as intended while porting some stuff from shadertoy, turned out was the #version of the shader that was missmatched afaicr, but webgl2fundamentals were pretty good indeed. do also recommend checking it out if you're trying to build a lightweight demo framework for yourself.
I came across regl recently as something of a three.js alternative and it seems well designed to my (novice) eyes. It immediately "clicked" for me in ways that not many 3d libs/frameworks have.
Quote:
By the way, check out p5js if you haven't already.
For me, as a beginner, p5.js is quite nice. It's quite easy and are well documented, but it's a bit slow.
I've coded a demo with it and a music replayer for my website xD
Maybe its worth to take a look to SDF (simple demo framework) by evilpaul.
Download link
Quote:
So What Is SDF?
SDF is a simple demo framework (dur!) that should allow anyone who has (or can pick up) JavaScript and GLSL skills to create a demoscene style demo. That demo can then be easily put up on a website and shared with anyone.
SDF is built on a few assumptions:
- Full screen shaders go a long way. Just look at ShaderToy, or any modern 1k or 4k demo. It’s all just shaders.. though.. ah.. I remember when this was all polygons mate. As such, SDF has support for full screen shaders and post processing effects right out of the box. 2D sprites are also supported – again, you can go a long way with 2D sprites. I’ll add some sort of 3D support at some stage.. but it’s not a priority.
- No-one wants to spend their time writing the low-level stuff. SDF is a lightweight framework that covers the boring/awkward tasks: resource loading, audio playing, simple sequencing. The aim is that someone who is new to WebGL/JavaScript doesn’t need to spend time doing the hard bits – they can just get on and write effects.
- WebGL/JavaScript are a simple set of technologies. They really are. If you’ve used any 3D API and programmed in any C like language then you’ll understand the concepts. Of course, WebGL is abstracted away behind a few simple API calls. Even if GLSL is new to you, there are plenty of tools and tutorials that’ll have you creating things in next to no time.
And SDF cuts a few corners too:
- Simple sequencing. There is no keyframing in SDF, you can set a layers start and end point but that’s it. If you want some movement/animation then you’ll have to code it – either in a custom layer or in a shader. Shader’s get “time” as an input and that’s often all you need. You can also group layers together so that you can block out sections of your demo and then easily move them around later on.
- You’ll need a webserver. Because SDF does resource loading through HTTP you’ll need to be running a web server – you can’t just double-click on the index.html file and expect it to work. Some platforms come with a local web server built in. I’m running Windows and I use the excellent and simple to install WAMP.
Download link
I would say evilpaul would definitely advise against trying to write a framework and tell people to start with a very basic but solid timeline and write effects.
I'll direct him to this thread.
I'll direct him to this thread.
