Frog Jumper – A JS13K Retrospective

I participated in the Javascript 13 Kilobyte game challenge this year along with 227 other game programmers. It is a month long contest that has been done since 2012. 2020 is the first year I’ve even heard about it, and I think it is an excellent contest. Check it out, and consider participating next year:

So why is this contest special? It celebrates “open web technologies” and adds the artificial size constraint to your final package size. This guides the programmer to seriously embrace the fundamentals of computer software engineering. You have no real chance to import a giant library of code, you must tap into the browser, and really focus on being creative with the constraints of code, assets, and browser quirks.

30 Days is not a lot of time if you are just getting started into web programming. But it is enough to make a basic “demo” of a game and submit, and get a t-shirt. I suggest brushing up before the contest begins on some basic html, css, javascript. Luckily I did a TypeScript project early in the year and am somewhat familiar with the web.

Here is the journey of Frog Jumper…

First Week

Read the recommended tips and tricks, and get the lay-of-the-land.

Do some calculations.

Choose some art from

See if I can get some pixel art that looks good and practice scaling it with css to make look nostalgic for me. I want to make an 80s arcade style game.

Learn about scaling modes for all three browsers… (sad)

Think to myself, I have plenty of time.

Second Week

Find a TypeScript project on GitHub to fork

Link up Kontra.js a micro game framework by Stephen Lambert.

Make some animations and think I’m really doing good.

Very little work done, mostly readying Kontra.js docs and checking into sound libraries.

Third Week

Kontra.js linked up and tested the packaging to see if i’m under size with basic animation screen.

Zipped it is 11kb so I’m ok. Then, I add the chicken.

I have no room for game!?

Only thing in it so far is WASD movement and 2 sprites.

Asking for help on twitter I switch to Parcel.js and enable some “tree-shaking” which removes dead code not used from library.

Keep shrinking and trying everything eventually i get down to 10kb!

Time to actually make game.

Fourth Week

Crunch time.

Add some sounds with Frank Forces Zynth library.

Can’t sleep, keep trying to figure out what to do for game play.

Decide to start adding emojis for inspiration.

Then make them scroll…. ok.

Lets Jump.

Ok now I understand what my games is… it is just a side scroller with a jump.

I refactor for the ability to do levels.

It is 3 days left to turn in game.

I’ll leave the rest to the GitHub commits:

Play the “final” version here:

Works on Mobile and Desktop.

Double tap to jump higher when frog is under you.

Will add more levels and fix bugs soon.

Will add more technical details fo the challenge later 🙂

Thanks to for hosting even for the 8th year. Look forward to next year.

Also thank you to all of you that helped me actually ship game. Lots of play testers from my family and work. And cheers to my wife Jessica for putting up with me and my silly chicken games ❤