thanks bro :3
HN user
xem
js code golfer
I'm just going through it.
I'm 35, Web Dev since 2009, work from home (2 hours away from work) since 2020, and my company just decided that they want everyone back at the office immediately, or quit.
So I quat. And I decided I'll never be an employee ever again. I'm gonna make a living out of my passions: write a book, create video games, adopt pets, photo, video, and if I run out of money I can still do Web Dev as freelance.
Frightening but also exciting!
- Regular Expressions
- Unicode and characters encodings
- Native WebGL
- CSS3D
- Women
I lied about women.
Been coding for ~20 years and I still see coding as an "end" (ie. an interesting goal) even when I'm making apps or games where the code is invisible to the end user
Here's my implementation, also inspired by these videos
It was made in 1kb for the JS1K demo competition: https://js1k.com/2018-coins/demo/3124
Detailed source code: https://github.com/xem/epicycles/blob/gh-pages/index.html
Controls:
- Arrow keys: up / down to change the number of gears, left to toggle intermediate paths, right to clear the scene.
- Mouse: click to add points to the path
I have a few: JavaScript code-golfing; CSS3D art; WebGL (traditional and as in shadertoy); Unicode; 6502 / NES emulation
The "ungolfed" code looks like this:
<input id=i> <a onclick='u.innerHTML+="<li onclick=innerHTML=innerHTML.strike()>"+i.value'>+ <a onclick=u.innerHTML="">X</a> <ol id=u>
There are 4 occurrences of "innerHTML" and 3 occurrences of " onclick='" so I replaced those two substrings with H and o.
The whole HTML is rendered using an ES6 template literal (document.write(` ... `))
Everytime a ${H} or a ${o} is present in the template, the value of H or o is copied here.
It's a native feature of JS since ES6.
Besides that, the second <a> implicitly closes the first <a>, so no need to use </a>. The id's are global, that's why we can access i.value or u.innerHTML directly. In onclick, "this" (the current element) is implicit. Finally, the strikethrough is done using the (deprecated but still working) .strike() String method.
My solution in 155 chars, vanilla JS
<script>document.write(`<input id=i><a${o=" onclick="}'u.${H="innerHTML"}+="<li${o}${H}=${H}.strike()>"+i.value'>+<a${o}u.${H}="">x</a><ol id=u>`)</script>
Demo: https://codepen.io/xem/pen/dypVzaw?editors=1100
Cheers :)
Hi, Here's my tutorial for going much further than a colored triangle, with very few code too: https://xem.github.io/articles/webgl-guide.html
I've been allowed to continue working from home (at my parents' house) since lockdown and save 800€/month (half of my paycheck) :)
- CSS3D, a fun and easy way to make 3D scenes / games in the browser without WebGL. To my knowledge, we are about 5 people to use it (https://xem.github.io/articles/css3dgames.html)
- JS code-golfing... I'm not alone but we're a small community, who enjoy making JS programs / art / games with the smallest possible amount of code (js1k.com, js13kgames.com, dwitter.net, ...)
- Unicode, its quirks, its updates (not only emoji), its encodings and its predecessors charsets
- Regexes (everyone hates them but I enjoy using them)
- Browsers hacks and polyfills (remember IE6? Firefox 3? Chrome 1? With enough effort, you could make them do almost everything that modern browsers can do today. My job has been to do exactly that for many years, and it was actually pretty fun)
I'm Maxime, front-end developer and passionate of JavaScript code-golfing.
I make tiny JS demos & games for fun or for contests like JS1K.com and JS13Kgames.com, and write about them (among other front-end experiments) here.
There's also a lot of tech watch and projects involving other topics like retro consoles emulation, Unicode, WebGL, and even a collection of memes and jokes.
Feel free to send feedback, even negative.
(I know the site's style is a bit old now, but I'm updating it!)
Cheers :)
"<!doctype html>"
Four years ago, I was hired to reboot the front-end development of a french search engine from a blank html page. It has millions of users now.
Real estate
Bought 3 student apartments in 2012 (when I was 24) and finished paying them at the beginning of 2018.
The apartments are entirely managed by an agency that finds the student, collects the money, does all the maintainance, and give me a fixed, guaranteed income.
This income is about 50% of what the students pay (about 330€ for me when the student pays 600).
So now I have 1000€ of passive income per month and only need to do my accounts once a year.
(In France, you can use a company to rent your apartments and avoid paying taxes, so I do that)
I'll probably buy 2 or 3 more in the future to be able to "retire early" and become an indie game dev full time.
For the record, here's the smallest notepad with local persistence we've golfed in JS: http://xem.github.io/postit/ (github: https://github.com/xem/postit/)
If you're interested in demoscene, this explains how to make x86 programs in 256b or less: http://sizecoding.org/
...
and yes, I consider it beautiful x86 code :)
Here's a similar app but golfed in 280b: https://twitter.com/MaximeEuziere/status/987222337081704448
Hey, the new version and its updated code are live! http://xem.github.io/sheet/
yah, sorry, it works best on Chrome (Win10, Mac or Android)
Hi! yup, only CSS and emoji. :) if you want to know a bit more, here's a making-of: http://xem.github.io/articles#js13k17
Yeah sorry, apple-eating is basically the only detail I didn't explain, thinking it was the most normal thing to do when you control a snake :)
Thanks man! I made this game by (ab)using the power of CSS and CSS3D, and really focused on the player experience, so I'm glad you enjoyed it! If you continue playing, you'll see even more surprises :) Also, here's a making-of: http://xem.github.io/articles#js13k17
Okay :) We're still removing a few bytes but when it's done I'll make a commented version.
awesome! (oh noes, it gets rid of the +-~j trick! :D)
Well, it's a 3 years old app, and we like it in this "minimal" form. We've made a lot of other mini apps, tools and games though, you can find the link on top of xem.github.io/sheet
NB: as mentioned in the "AMA" page, the whole team also helped a lot to reduce the size of this app after I got into the game, it's not just golfed by me.
Cheers
good thing we made it just for fun, then
of course! Thanks, I'm adding this enhancement on github!
Sure, i explained it here earlier today: https://github.com/xem/sheet/issues/4
I'll take his comment as a joking sarcasm anyway.