pouët.net

PauloFalcao: Very impressive! Would love to read a short making of :)

Even I would want to read about it!

PauloFalcao: excellent!!!

THANKS! :)


This was possible because i spend my 2 weeks vacations at my mother-in-law house in the middle of nowhere with no Internet! So lots of time left to optimize for size LOL

I have a crap intel video card, so running shaders in the CPU using C++ is something i was doing a long time. Compilling C is incredibly more fast then compiling shading code.

For the shader to run fast i normally use dynamic resolution change to keep a fixed framerate, the resolution on the CPU is much smaller... but... it works! And compile fast ;)

The process was pretty straight forward.

0 - I have a bunch of experiments (more then 100... lol) using raymarching with distance fields stuff in my drive made using RenderMonkey, very cool tool and it works nice with my crap intel card LOL:)
1 - I choose one of the experiments that i liked. At that time i never thought that was possible to convert it to javascript in 1k, the original effect in HLSL was about 3.5k, and in JS i had no vector stuff.
2 - I first reduce the HLSL to 1.6K
3 - Then i converted the code to JS, it was fixed framerate with dynamic resolution change and full browser with a black background like my first entry, it was about 3.5K, and was very slow on Firefox because this initial version was creating a lot of new objects each pixel.
4 - I made another version that did not create new objects each pixel, it was much faster in firefox but it was also was bigger... (4K)
5 - I spend countless hours optimizing the two versions for size.
6 - I created a JS compressor that look strings repeated in the code, and replace that string with a char (i used the first unicode chars for that), this process runs recursively until no more compression is possible.
7 - After removing some features like the dynamic resolution, color range check (necessary in Opera), and the dynamic color in the blob stuff, the compressed code still had 40 bytes missing in the slow version and 70 bytes in the fast one.
8 - I continued to optimize and came up with the first version with 1K, it was the slow version with some features missing.
9 - I continued to optimize, was able to put again the color range check and the color on the blob stuff and use the fast version! Perfect!
10 - Submitted the 1KJS for approval ;)

I was really pleased to be able to put in 1K Javascript the exact same effect that i had done in HLSL :)

Wow, that's amazing!!!
Knowing how slow raymarching can be, especially tried on CPU, this thing looks amazing. And the colour/blob stuff beautiful.

I also submitted something small. I had only 1 day to code and optimize, filled the last bytes with interactivity instead of new effects.

http://js1k.com/demo/716

http://marijn.haverbeke.nl/js1k.html

In other words: import by hash :-)

hehe

Although my vote would go to Inopia by default, that's some quality work there, Paulo :)

plainoldsagacity and Optimouse , Thanks! :)

Wow, the mechanized abbreviation of the canvas context methods is a very cool trick! :P In my case i just use getImageData and putImageData methods, but in other cases like his game it can really make a difference.

A possible downside to that trick (particularly with such a simple 'hash function' as taking the 1st+7th letters) is that it's liable to hit collisions in future browser releases if they add new properties - and given the in-flux status of HTML5, and browser makers' habits of throwing in proprietary extensions, I'm not sure that's a risk I'd want to take. Or do people reckon that Canvas2DContext is more or less stable now?

gasman: maybe it is not something to do for any production status software and/or open source library, but for a compo that ends in few days (tomorrow at the moment of writing this), it seems more than fine... Also, if it doesn't work in 3-4 years in any browser, I don't think anybody is going to miss it...

texel: Sure - I'm just seeing parallels with the Windows 4K world, and the way that they all used to use nasty tricks that wound up tying them to a specific point release of DirectX (until Crinkler came along and showed everyone the light).

I'm with gasman. The less non-future proof hacks the better.

Doing a text effect: http://mixtape.be/dirs2.html

Not quite sure what to do with the remaining bytes, and I've managed to squeeze it even further

Pheeew was quite tough to fit all this into 1k.

p01: You're not right in the head man :)

Wow... Color me impressed!

Awesome stuff, PauloFalcao! You're certainly my favorite.

p01 wins. FINISH HIM!

Thanks Inopia! :)

Very nice work P01!

Haha cool, I see someone has ported (http://js1k.com/demo/738) my 1k shader (http://www.pouet.net/prod.php?which=55469) too

BTW: p01 ownz

Thanks a lot!
So wish I managed to do more. :\

Weyland Yutani: sorry for skipping your name, found out too late..
p01: right now, wolf1k@js1k has 0 bytes ?? posted by anonymous ??
something obviously wrong there.. go & check!