Last active
May 4, 2024 15:35
-
-
Save gullyn/95b2ab9e465317f1d4e4607cf6e94205 to your computer and use it in GitHub Desktop.
Flappy bird in 205 bytes (improved!)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<body onload=z=c.getContext`2d`,setInterval(`c.width=W=150,Y<W&&P<Y&Y<P+E|9<p?z.fillText(S++${Y=`,9,9|z.fillRect(p`}*0,Y-=--M${Y+Y},P+E,9,W),P))):p=M=Y=S=6,p=p-6||(P=S%E,W)`,E=49) onclick=M=9><canvas id=c> |
You can actually just remove the "Z" and the "H0" from the path:
<svg id=c onload="Y=G=T=0;setInterval('T%99?0:Y>G&Y<G+75?G=T%75:V=Y=T=0;Y-=V-=.04;c.innerHTML=`<path d=\'M${99-T%99} ${G}h9V0h-9Zv75h9V150h-9M0 ${Y}v9h9v-9\'/><text y=11>`+T++',9)"onclick=V=2>
which is 192 bytes. This means the path is no longer closed, but it displays the same way because it is closed implicitly when it gets filled. The downside is that this is not very well defined behavior - I think - so some browsers could display it differently.
<svg id=c onload="Y=G=T=0;setInterval('T%99?Y-=V-=.1:Y>G&Y<G+60?G=T%75:V=Y=T=0;c.innerHTML=`<path d=\'M${99-T%99} ${G}h9V0h-9Zv60h9V150h-9M0 ${Y}v9h9v-9\'/><text y=11>`+T++',9)"onclick=V=3>
189 bytes. But a bit more difficult (like the real flappy bird)
it's been so long that I forgot how to run this...
You can try this URL:
data:text/html,%3Csvg id%3Dc onload%3D"Y%3DG%3DT%3D0%3BsetInterval('T%2599%3FY-%3DV-%3D.1%3AY%3EG%26Y%3CG%2B60%3FG%3DT%2575%3AV%3DY%3DT%3D0%3Bc.innerHTML%3D`%3Cpath d%3D%5C'M%24%7B99-T%2599%7D %24%7BG%7Dh9V0h-9Zv60h9V150h-9M0 %24%7BY%7Dv9h9v-9%5C'%2F%3E%3Ctext y%3D11%3E`%2BT%2B%2B'%2C9)"onclick%3DV%3D3%3E
thanks
Easier to read if you only replace % with %25 in the address bar:
data:text/html,<svg id=c onload="Y=G=T=0;setInterval('T%2599?Y-=V-=.1:Y>G&Y<G+60?G=T%2575:V=Y=T=0;c.innerHTML=`<path d=\'M${99-T%2599} ${G}h9V0h-9Zv60h9V150h-9M0 ${Y}v9h9v-9\'/><text y=11>`+T++',9)"onclick=V=3>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
@kres0345 Mobile browsers do support Data URIs as shown on this Can I Use page.
Although another two bytes would be nice, I don't think that is enough of a reward for mobile compatibility.