Random dweets | Dwitter

function u(t) {

c.width=1920 // clear the canvas
for(i=0;i<9;i++)
x.fillRect(400+i*100+S(t)*300,400,50,200) // draw 50x200 rects

} // 122/140

Please log in (or register) to post a dweet (copy-paste the code somewhere safe to save it meanwhile)


    u(t) is called 60 times per second.
    t: Elapsed time in seconds.
    S: Shorthand for Math.sin.
    C: Shorthand for Math.cos.
    T: Shorthand for Math.tan.
    R: Function that generates rgba-strings, usage ex.: R(255, 255, 255, 0.5)
    c: A 1920x1080 canvas.
    x: A 2D context for that canvas.

Try the new frontend: beta.dwitter.net
Current theme challenge: #Food

show FPS hide FPS share 2 remixes fullscreen

lewdev

remix of d/34375 by u/lewdev

function u(t) {

onmousedown=onmouseup=e=>x.beginPath(A=e.buttons)
onmousemove=e=>A&&x.lineTo(e.x*(s=c.width/innerWidth),e.y*s),x.stroke()

Oct 3 2025 8:47 PM UTC

}// 121/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

🎨🖱️ Tiny Canvas Paint Dweet (click drag to draw)

u/ximavus

You did it! This was a big goal on my original paint project to click and paint instead of automatically painting
u/ximavus

You can put also onkeydown=e=>c.width|=0 at the end to add clearing by pressing keys

show FPS hide FPS share 1 remix fullscreen

KilledByAPixel

function u(t) {

A=_=>T=S(T*7)||1
B=_=>R=(R*9||.9)%1
for(i=2e3;i--;)x.fillRect(i,t*60,i-960?i<960?A():B():9,1)

Oct 18 2023 4:26 PM UTC

}// 93/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

Two Randoms - demo of two tiny ways to generate random numbers

Show more comments…
u/danny@hille.dk

Cool, but both A and B uses a global method (tan or rgb), besides B is the same length as D=_=>Math.random()
u/rodrigo.siqueira

I understand that in this case, A and B are short methods used to obtain predictable (deterministic) results from a pseudo-random number generator (PRNG), unlike the Math.random() method.
u/KilledByAPixel

A uses Math.sin to get values between -1 and 1, B just uses % and returns between 0 and 1. Both have some artifacts but are random enough for many things.
u/KilledByAPixel

danny, you can't control the seed to Math.random() that makes it unusable for many applications. These do use dwitter defines but also can work just as well without, especially method B.
u/Joachim

Interesting... the left seems too uniform while the right looks slightly horizontaly biased. I think B() will be the most helpful for me, thanks!
u/danny@hille.dk

ooooh nice! Thanks for breaking that down 4 me :-)
u/rodrigo.siqueira

Warning: R=0.5; R=(R*9||.9)%1; // In this seed case (R=0.5), the result will always be 0.5 (it's fixed point, "a value that does not change under a given transformation").
u/cantelope

#RNG

show FPS hide FPS share fullscreen

Xen

remix of d/11370 by u/katkip

function u(t) {

x.fillStyle=`hsla(${(Z=t*t%999)+t*99},99%,50%,.1)`;x.beginPath();x.fill(x.arc(960+S(Z)*Z,540+C(Z)*Z,t*9%90,0,7));x.stroke()

Dec 9 2018 8:14 PM UTC

}// 123/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

Fullscreen

show FPS hide FPS share 1 remix fullscreen

iverjo

remix of d/286 by u/iverjo

function u(t) {

t=t%4;if(t<.1)r=X=Y=0,W=c.width=960,H=540;for(i=W*4;i--;)x.fillRect(X=(X+S(r+=.5-Math.random())%W+W)%W,Y=(Y+C(r)%H+H)%H,A=5/(1+t*9),A)

Jul 21 2016 1:21 PM UTC

}// 134/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

u/sigveseb

almost looks like a map!
u/joeytwiddle

Whoa! When I was younger I used to have nightmares about this damn thing. I would clean it all away but then it would come creeping back. Weird that you found it in 2016!
u/iverjo

#random

show FPS hide FPS share 1 remix fullscreen

taupelink

remix of d/28170 by u/taupelink

function u(t) {

eval(unescape(escape`景爨椽㕥㌻椭ⴻ砮晩汬剥捴⡘⨶㔰ⱙ⨳㠰Ⱪ⩡Ⱝ椪愯琩⥘㵩╍慴栮偉ⱙ㵘⩩┳ⱸ⹦楬汓瑹汥㵠桳氨⑻栽ㄹ㔫⠨㈪塞㔩⨵帨㈪奞㈩⨸⥽Ⱔ笷〫匨栯㴸⭴⩴⤪匨天⩨紥Ⱔ笴〭株䌨栩紥Ⱔ筡㵩⨪⴮㔯㈯琪⩴紩怠`.replace(/u([^D].)/g,'$1%')))

Jul 24 2023 4:50 AM UTC

}// 140/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

d/28176

show FPS hide FPS share fullscreen

pbjer

function u(t) {

c.width=1920
w=1920
m=255
z=S(t)
x.fillStyle=R(m,100,z*m)
x.fillRect(0,0,w,w)
x.arc(w/2,z*300+800,200,0,6)
x.fillStyle=R(m,m,0)
x.fill()

Mar 1 2021 8:02 PM UTC

}// 136/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

Infinite Sunset

Show more comments…
u/magna

Neat! Here, I've shaved some bytes to illustrate a few quick wins (also, use 7 instead of 6 for 2π): c.width=w=1920;z=S(t);x.fillStyle=R(m=255,99,z*m);x.fillRect(0,0,w,w);x.arc(w/2,z*300+800,200,0,7);x.fillStyle=R(m,m);x.fill()
u/danny@hille.dk

wrap it in with(x) is also a quickwin if you have more than 3 canvas operations
u/danny@hille.dk

c.width=w=1920;z=S(t);with(x)fillStyle=R(m=255,99,z*m),fillRect(0,0,w,w),arc(w/2,z*300+800,200,0,7),fillStyle=R(m,m),fill()
u/danny@hille.dk

z=S(t) takes up more space than having S(t) inline
u/danny@hille.dk

if you are willing to make some compromises, you can use your constant m to replace values close to 255
u/danny@hille.dk

and use 2e3 instead of 1920
u/danny@hille.dk

117 b => c.width=w=2e3;with(x)fillStyle=R(m=255,99,S(t)*m),fillRect(0,0,w,w),arc(w/2,S(t)*m+800,m,0,7),fillStyle=R(m,m),fill()
u/danny@hille.dk

113 => w=c.width|=0;with(x)fillStyle=R(m=255,99,z=S(t)*m),fillRect(0,0,w,w),fillStyle=R(m,m),arc(w/2,z+800,m,0,7),fill()

show FPS hide FPS share fullscreen

KilledByAPixel

function u(t) {

f=(a,b,c,d)=>{x.font=d+"px a";x.fillStyle=R(a,0,0,1);x.fillText("♥",b,c)};f(0,X=850-700*C(2*t),Y=700-360*S(4*t),400);f(255,X+17,Y-17,340);

Apr 4 2019 11:43 PM UTC

}// 138/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

Infinite Love

show FPS hide FPS share 1 remix fullscreen

AdamLantz

function u(t) {

o=127;p=2;
x.fillStyle=R(o+o*S(t),o+o*S(t-p),o+o*S(t+p))
for(i=0;i<20;i++)
x.fillRect(935+S(t+i)*935,C(t+i/2)*515+515,50,50)

Mar 14 2019 5:59 PM UTC

}// 124/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

show FPS hide FPS share fullscreen

Joachim

function u(t) {

eval(unescape(escape`󛼯󛜭󛼯󒭺󟝣󛭷󪝤󭍨󟜳󜌰󒭸󦽳󟜧󩭩󫍬󤽴󮝬󩜧󧜽󙽲󩝤󙼊󮌮󩭩󫍬󚍸󛭡󬭣󚌱󝬰󛌵󝬬󜜳󛌰󛌷󚜩󒭦󫽲󚍩󟝺󞽩󛜭󞽸󛭦󪝬󫍒󩝣󭌨󚍩󚽴󚬹󞜯󪜩󙜲󜌪󜬰󛝺󛽩󛌱󞌰󛍺󛽩󧬴󛌭󪜥󤼨󪜩󚬱󝌰󚜩󮍛󬽝󟜧󘽦󩭦󜜧󛍸󛭦󪝬󫍒󩝣󭌨󜌬󤼨󛝴󛼴󚜪󜼰󚽩󧬴󛍺󛍩󚜬󮍛󬽝󟝒󚌩`.replace(/u../g,'')))

Dec 23 2021 2:04 PM UTC

}// 140/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

Mist city

u/tomxor

Neat effect
u/danny@hille.dk

Nice!
u/danny@hille.dk

Minor tweak idea ->x[s='fillStyle']=R(z=c.width=300);x.fill(x.arc(p=150,S(t/9)*20+30,13,0,7));for(i=z;i--;x.fillRect((i+t*66/i)%20*20-z/i,160,z/i|8,-i%S(i)*p))x[s]='#fff1',x.fillRect(0,S(-t/4)*30+i^4,z,i),x[s]=R()
u/Joachim

Thanks, Thats much better. I never thought of defining the width INSIDE the color

show FPS hide FPS share fullscreen

katkip

function u(t) {

c.width^=0;for(i=0;i<100;i++)x.arc(960+S(t*C(i*i+t))*960,540+C(t*S(i*i+t))*540,i,0,i);x.stroke();FPS=667

Nov 29 2018 6:53 PM UTC

}// 104/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

Rising of Leonardo Da Vinci