Twitter | Pretraživanje | |
Andrew Baldwin
Error: Undefined output
1.671
Tweetovi
600
Pratim
832
Osobe koje vas prate
Tweetovi
Andrew Baldwin 19 h
Odgovor korisniku/ci @baldand
Balancing the audio work load was also a problem. There are two 0.2s stereo audio buffers used alternately. This means every few frames there is extra GPU rendering work to do. When the scene gets full (many rings near camera), lighter GPUs struggle to render smoothly 🙁
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 23 h
Odgovor korisniku/ci @Eniz0r
Oh! Interesting. I will try to investigate. Thanks!
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 3. velj
Odgovor korisniku/ci @baldand
Some annoyances and challenges: - Android chrome much faster fullscreen - Fullscreen & WebAudio only work if the user interacts. So there has to be an initial state that requires a click/press - Safari WebAudio is still behind webkit prefix and has slightly different behaviour
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 2. velj
Odgovor korisniku/ci @aaronkennedy0
The 4-bit era was the best
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 2. velj
Odgovor korisniku/ci @baldand
The (text) shader code is stored with simple dictionary-based compression of keywords. But the rest of the code is not compressed. To keep code density high, I used rust to write a binary code runtime based on 4-bit opcodes and args that manipulate a JS-side stack
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 2. velj
Odgovor korisniku/ci @baldand
To avoid needing JS binding functions for all the Web APIs, I used the JS function Reflect.ownKeys() on API classes to enumerate all the available functions, and extract the ones I needed dynamically based on a pre-computed (12-bit) hash - then using JS fn apply() to call them
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 2. velj
Odgovor korisniku/ci @baldand
The version of WebAssembly widely available today in most browsers is limited to being able to call a list of javascript functions you give it at load time, with only numbers as parameters & returns - it cannot call arbitrary Web functions (such as WebGL or WebAudio) directly
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 2. velj
Odgovor korisniku/ci @thp4 @morplenauta
Oh nice! I hadn't tried it FF for Android
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 2. velj
Odgovor korisniku/ci @morplenauta
Can you share FF version number, OS, GPU type?
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 2. velj
Odgovor korisniku/ci @baldand
The audio ("music") is also rendered in a fragment shader, with one pixel per sample, using additive synthesis with about 500 sin waves for left and right channels. Output float value is coded into the 4x8bit RGBA and cast back to float32 on host side, then into a WebAudio buffer
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 2. velj
Odgovor korisniku/ci @baldand
Each of the 4096 rings is a quad instance, positioned in 3D space by the vertex shader. Then in the fragment shader, a local single torus distance field is ray marched for a few steps. Depth testing is on, and pixels that don't hit a surface are discarded.
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 2. velj
Odgovor korisniku/ci @baldand
The graphics and audio are rendered with WebGL(1) shaders. The challenge for me was how to bind all the needed functions while staying "in budget" (<4KB) but still with broad compatibility
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 2. velj
Odgovor korisniku/ci @salomonsen_p
Not yet. I may try to do a blog post about it soon. (You can also use the wasm binary tools to dissassemble it if you first take off the 5 byte header)
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 2. velj
Odgovor korisniku/ci @nemo20000
It can work on that combo, but I have seen some WebGL shader compiler issues also. You might have more success with Firefox
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 1. velj
Odgovor korisniku/ci @marcusfrei
Here is one starting point for Rust + WebAssembly. I was actually using a more minimal environment with just the basic rust compiler + some build scripts, then debugging the result in my browser
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 1. velj
Odgovor korisniku/ci @unai_landa @WasmWeekly
Though I've had good results with other projects doing wasm to js conversion, this one might be a bit tricky to do because of the way it is packaging everything together. Performance would be quite similar I think as the heavy lifting (graphics & audio synthesis) is on GPU
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 1. velj
Odgovor korisniku/ci @baldand
The file is actually one wasm binary file, with just "<!--" added to the start, and the javascript bootstrap embedded as constant data
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 1. velj
Odgovor korisniku/ci @baldand
On my (android) phone, performance is best in landscape
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 1. velj
Odgovor korisniku/ci @unai_landa @WasmWeekly
Yes, I was thinking of writing a blog post soon to explain a bit about how it was put together
Reply Retweet Označi sa "sviđa mi se"
Andrew Baldwin 1. velj
Odgovor korisniku/ci @CyberSlayer75
Also with sound?
Reply Retweet Označi sa "sviđa mi se"