
Dwitter – A social network for short JavaScript demos - 5960312
https://www.dwitter.net/
======
ohhhwell
Oh fun, didn't expect to see my side-project here :) A few of my personal
favorites:

[https://www.dwitter.net/d/90](https://www.dwitter.net/d/90)
[https://www.dwitter.net/d/406](https://www.dwitter.net/d/406)
[https://www.dwitter.net/d/433](https://www.dwitter.net/d/433)
[https://www.dwitter.net/d/617](https://www.dwitter.net/d/617)

~~~
dorianm
Infinite loops (accidental in my case) should probably be catched in some way.

~~~
brian_cloutier
Yeah, the halting problem has been around since 1936. You'd think someone
would have solved it already!

~~~
azeirah
if (time_elapsed > some_arbitrary_threshold) { interrupt_sandboxed_code(); }

------
russellbeattie
So I whipped up a standalone HTML page to use to develop Dwitter scripts
without having to use their interface (which seems prone to crashing). Here's
the source:
[https://gist.github.com/russellbeattie/ef27709f7c916ea54454c...](https://gist.github.com/russellbeattie/ef27709f7c916ea54454cbc3866d4d2f)
and you can see it live on my site:
[http://www.russellbeattie.com/dwitterish.html](http://www.russellbeattie.com/dwitterish.html)

Interestingly, I found that some scripts _really_ don't like using eval(), so
I modified the page to dynamically swap in new <script> elements with the code
instead, and a flag to go back and forth.

Here's an example of a script which doesn't like eval() - it runs noticeably
faster when embedded in a script:
[https://www.dwitter.net/d/697](https://www.dwitter.net/d/697)

Edit: Added the ability to just embed the code in the URL:
[http://www.russellbeattie.com/dwitterish.html#c.width%7C%3D0...](http://www.russellbeattie.com/dwitterish.html#c.width%7C%3D0%3Bfor\(n%3D200%3Bn-%3D1%2F64%3Bx.fillRect\(n%253*666%2Cn*5%2Ch%3D8-k%2Ch\)\)for\(r%3DC\(t*3\)%2Ci%3DS\(t*4\)%2Ck%3D28%3B
--k%2Fr%3Bi%3Dj\)j%3D2*r*i%2B1-n%2F99%2Cr%3Dr*r-i*i%2B1-n%253)

(Note that I only tested this on Chrome, so feel free to modify if there's
issues.)

~~~
sigvef
We've gone full circle! This thing started as a stand-alone HTML page for
dweets with ability to embed the code in the URL:
[http://arkt.is/t](http://arkt.is/t) (hover to show editor). GitHub:
[https://github.com/sigvef/arktis-tweet-
demo](https://github.com/sigvef/arktis-tweet-demo) . Here it is with the same
dweet embedded:
[http://arkt.is/t/Yy53aWR0aHw9MDtmb3Iobj0yMDA7bi09MS82NDt4LmZ...](http://arkt.is/t/Yy53aWR0aHw9MDtmb3Iobj0yMDA7bi09MS82NDt4LmZpbGxSZWN0KG4lMyo2NjYsbio1LGg9OC1rLGgpKWZvcihyPUModCozKSxpPVModCo0KSxrPTI4Oy0tay9yO2k9ailqPTIqcippKzEtbi85OSxyPXIqci1pKmkrMS1uJTM=)
.

Incidentally, this is where the "dwitter" name came from: "demos" as in the
demoscene
([https://en.wikipedia.org/wiki/Demoscene](https://en.wikipedia.org/wiki/Demoscene))
and twitter.

------
artursapek
This is the coolest website I've seen in a long time. Awesome idea.

EDIT: one issue I'm running into is it's easy to accidentally write half-
finished code that freezes my browser. It would be nice to have an option to
only refresh the preview upon clicking some kind of button.

~~~
Lionleaf
Sorry about your lost dweet :( Accidental infinite loops while editing can be
a pain. A "reload" button isn't a bad idea, or a "recover dweet draft"
functionality.

~~~
artursapek
I managed to finish one!
[https://www.dwitter.net/d/714](https://www.dwitter.net/d/714)

More suggestions:

\- in-browser minification tool

\- character counter would count using this output

\- larger textarea

That way, I can compose without relying on vim + yui-compressor.

Awesome little site.

~~~
Lionleaf
Brilliant dweet! Part of the challenge is the manual minification. A larger
textarea might be worth it especially as you can use linebreaks instead of ;
for better readability

~~~
artursapek
Aye, then I cheated. :0 I'll try doing it manually next time.

------
sigvef
The source is on GitHub:
[https://github.com/lionleaf/dwitter](https://github.com/lionleaf/dwitter) \o/

------
rosalinekarr
This is really cool, but executing other people's javascript in a page makes
me nervous. What sort of restrictions are in place to prevent malicious
exploits?

~~~
Lionleaf
Makes me quite nervous too. So far each dweet is run in a sandboxed iframe
loaded from a separate subdomain.

There are definitely things you can do, and I'm aware of some annoying ones.
I'll just manually delete them at this point. Any security conscious person
would view it with noscript and just read the javascript ;)

~~~
EGreg
Why not make their javascript run in WebWorkers and provide a DOM-like
interface for all the things? That way you can kill infinite loops etc.

~~~
Lionleaf
That's something I've been thinking about. Webworkers don't have direct access
to the Canvas though, but it seems like you can work around that by passing
image data. Killing infinite loops would be great

------
elliottcarlson
This is awesome! During one of the last hackathons I participated while at
Tumblr, I made a Processing post type, that allowed people to have interactive
posts using Processing code, and could be reblogged with edits - very much
like this. Love seeing something similar to this idea!

------
franciscop
Woah, this is awesome but a bit misleading in the beginning. I spend my last
15 min trying it out:
[https://www.dwitter.net/d/702](https://www.dwitter.net/d/702)

------
recursive
Ended up with something totally different than what I was going for. This is
fun.

[https://www.dwitter.net/d/778](https://www.dwitter.net/d/778)

------
yev
Check out my dweet :)
[https://www.dwitter.net/d/734](https://www.dwitter.net/d/734)

------
mypalmike
Prior art: [https://t.d3fc.io/](https://t.d3fc.io/)

~~~
Lionleaf
Oh, that's cool! I like the integration with twitter

------
jacmoe
The idea is much, much better than the name :)

------
huangc10
I enjoy the matrix theme falling letters (4th on the top-sorted list). Thanks!

------
yokisan
Opened page: _this is kinda lam....oooh that 's neat_.

* _scroll scroll scroll_ *

Nice work.

------
modeless
In a similar style, but with WebGL:
[https://www.shadertoy.com](https://www.shadertoy.com)

~~~
andrew3726
Yup, pretty similar but the limitation to plain JS and to 140 chars makes the
code more fun :)

------
russellbeattie
This is definitely fun... It'd be nice if it used Github to login and save to
Gists. Also, I think it'd be better if the developer called u(t){}, rather
than it being the content of the entire post, so it could set up variables,
etc., and since it already has a few shortcuts like c,x,C,S,T,R, might as well
add in a more complete API.

~~~
mstade
Just set something on `this`:

    
    
        if (!this.mySettings) {
          this.mySettings = { value: 1 }
        }

~~~
russellbeattie
140 character limit, so that wastes like 60 of it. :-)

~~~
mstade
Ah, didn't realize, my bad! It's doable in fewer characters of course, but
still a waste. Funny, I thought it was just a bit odd how terse some of these
demos were, but given the 140 char limit that I somehow didn't notice at all
it makes more sense.

------
tuanx5
Neat concept. It reminds me of the Wolfram One-Liner competition
[http://blog.wolfram.com/2016/11/09/the-2016-wolfram-one-
line...](http://blog.wolfram.com/2016/11/09/the-2016-wolfram-one-liner-
competition-winners/)

------
Retr0spectrum
How do I link to a specific post?

This one by mxfh looks very cool:

    
    
        d=x.getImageData(0,0,w=c.width=256,h=144);for(i=0;i<h;i++)for(j=0;j<w;j++)d.data[(i*w+j)*4+3]=(i-j&j+i)*t%w;x.putImageData(d,0,0)
    

Does anyone know how it works?

~~~
Smerity
There's a share button on each of the "tweets" at least on my screen.

The direct link to the Sierpinski triangle inspired animation you're noting is
below:

[https://www.dwitter.net/d/676](https://www.dwitter.net/d/676)

------
ihuman
What resources to people recommend for learning about animating in canvas tags
like on Dwitter? I'm already familiar with Javascript, but seeing what people
are able to do here with 140 characters amazes me.

------
partisan
Thank you for this. It definitely stimulated my imagination and creativity.

------
sunilkumarc
I'm not understanding this. How is animation happening? What is S(t)? Can
somebody please explain this project?

~~~
minitech
Scroll down:

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

------
kowdermeister
I'd appreciate for not auto running the demos. The fractal animation lagged
whole page down to 5FPS.

------
mutable
Just tried to register with username @H2O. Sent post request, after that got
500 error.

~~~
Lionleaf
Oh, got the 500 error dump. It's the @ in your username, that'll teach me. For
now avoid special characters in your username ;)

Edit: In case you were stuck in a 500-loop I quickly changed your username to
H2O, hopefully it works now

~~~
mVChr
I tried to register as "sfz-" and also got a 500. Is there a problem with a
trailing dash? If so, can you fix my username as well to "sfz"? Thanks!

~~~
Lionleaf
Changed to sfz :)

~~~
mVChr
Sweet! Thanks! [https://www.dwitter.net/d/727](https://www.dwitter.net/d/727)

------
jaimehrubiks
My MacBook Air is complaining after a few minutes of reading this site.

------
EGreg
I kind of love it!

Are they all in iframes?

~~~
andrew3726
Yup, as confirmed by the author[0]. Also, it's opensource, 'dweet card'
template shows that it uses iframes[1].

[0]
[https://news.ycombinator.com/item?id=13702021](https://news.ycombinator.com/item?id=13702021)

[1]
[https://github.com/lionleaf/dwitter/blob/master/dwitter/temp...](https://github.com/lionleaf/dwitter/blob/master/dwitter/templates/snippets/dweet_card.html#L6)

------
ethana
This kills the Firefox.

------
salik_syed
This reminds me a bit of ShaderToy -- very cool :)

------
simooooo
12 hours until twitter name infringement

------
a13n
Name does not pass bar test.

------
gillianlish
within a half hour of playing around on this site, someone posted goatse. and
there is no way to report, hide, downvote, etc.

