I found this cool sketch but it is reduced to programming shorthand I have no experience with. I keep trying to format in what I am used but keep failing.
t=0,draw=_=>{t++||createCanvas(w=720,w)+strokeWeight(5)
background(w,30)
for(i=99;i--;){x=(random(40)|0)*18;y=(random(40)|0)*18
for(j=40;j--;){d=((noise(x/w,y/w+t/w,dist(x,y,w/2,w/2)/w)*50|0)%4)*TAU/4
point(x+=cos(d)*6,y+=sin(d)*6)}}}
/*
Help, what is the translation to beginner's syntax?
t=0;
function setup(){
}
function draw(){
}
*/
//created by https://twitter.com/ntsutae/status/1314664241048162304
let t = 0;
let w = 720;
function setup() {
createCanvas(w, w);
strokeWeight(5);
}
function draw() {
t++;
background(w, 30);
for (let i = 99; i > 0; i--) {
let x = int(random(40)) * 18;
let y = int(random(40)) * 18;
for (let j = 40; j > 0; j--) {
n = noise(x / w, y / w + t / w, dist(x, y, w / 2, w / 2) / w);
n *= 50;
n = int(n);
d = n % 4 * TAU / 4;
x += cos(d) * 6;
y += sin(d) * 6;
point(x, y);
}
}
}
Hereâs an expanded version of the last listing, @J_Silva â
let y = 0;
let c = 0;
let w = 960;
let h = 540;
let T;
function f(x, y, c = 0) {
if (x * x + y * y > 4) {
return c;
}
let xarg = 3 / 4 - sin(x) * sin(y) * 3;
let yarg = abs(y * y - x * x);
return f(xarg, yarg, c + 4);
}
function setup() {
createCanvas(w, h, WEBGL);
T = createGraphics(w, h);
texture(T);
noStroke();
}
function draw() {
y++;
clear();
rotate(PI / 2);
rotateY(y / 120);
sphere(430);
if (y < h) {
for (let x = w; x > 0; x--) {
T.stroke(f(x / w, y / w));
T.point(x, y);
}
}
}
I do not recommend shorthand syntax, but like @glv said, âIt seems to be on purposeâ. In fact, I believe that people on OpenProcessing use it, to make it more difficult for someone to fork their sketch. I would not use setup() within draw(), because in the first place it does not give less code, and second the sketch can slow down substantially. I have made another sketch which I think is easier to understand and to translate. Note the dots used to write several functions on one line.
But that being said, it still can be fun to write a nice sketch with as little code as possible.
I think this shorthand stuff is great for microblogging platforms. Itâs a fun challenge trying to cram your program into a single tweet/micropost using code that prioritises economy over âbest practiceâ.
For some more inspiration, you can check out #tweetcart, #tweetjam, and #TweetTweetJam, which are PICO-8 (Lua) games and demos that fit into a tweet or two.
I removed the semicolons and used a line feed instead; each counts as a character.
The n=25 did not make it smaller (still the same size) but left it in there for this example.
I had not heard of that yet. Fun stuff. Its free competitor TIC-80 allows using JS!
I thought âThatâs oddâ because I expected JS much slower in graphs-drawing because it takes all numbers as a 64-bit floating-point format. I suspect that because JS introduced typed arrays with all distinct numeric types; I believe for better raw data performance.
Curious about that I compared a number-crunching mandelbrot sketch with java, and I must say itâs as fast. (or maybe slow). So P5.js is really a good choice because you can embed it everywhere. Even in Googleâs free Blogger. (I just tested that)
Click to zoom, and type Home End to change colors.
Thanks for that link. I followed it right away! I was surprised that in the type of syntax compare list P.java is still winning. 45 to 33 I love those small sketches. It also is proof that knowing to code is not enough; you also need imagination. I admit that I often throw some geometric functions into draw(), just to see the outcome. But In the same twitter I found such a nice simple but at the same time elegant sketch from @Hau_kun that clearly shows that he first imagined the sketch, and then coded it. Itâs in java and just as shorthand training, I converted it to P5.js. (the dirty way, throwing setup in draw)
