I make things.

Menu

Memecached: Real-Time meme sharing with node.js, now.js, and MongoDB

Yesterday, I wrote a web-app named Memecached. It is a service which allows you to quickly generate a meme and publish it in real-time. It went viral for quite a few hours after I tweeted about it and posted it on Hacker News, with hundreds of memes being shared, sometimes a new meme every three seconds!

Memecached is extremely lightweight. The server is tiny, written entirely in exactly 50 lines of Javascript using node.js. It uses MongoDB as the data store and now.js for real-time, remote method invocation.

Awkward text blackened

Using it is fairly trivial – you open the page, and the latest N (25 by default) memes are streamed back and populated into the webpage. On the left is a collections of meme templates – you can click any one, enter the top and bottom text, and hit publish to see it reflected on each open client.

Some Code

On the server side, the now.js initialization didn’t work normally as sometimes the client – my chrome browser – would not perform a handshake (I’ve reported this in the now.js issue here: , so I had to fiddle around with the options till I found that xhr-polling seemed to work.

How it works

All meme template images are stored on Dropbox.

When a new meme is published, the server takes a JSON object from the client, containing the meme name and text. No image whatsoever.

The received meme object is inserted into the mongo collection memes with a date timestamp added to it. The object is also sent to all connected clients immediately so that they may update their timelines. This also means that no further database queries are required to retrieve new memes.

When a client connects, the last few (25) memes are queried from the database and sent back. This can further be optimized by having an in-memory queue of the most recent memes, in addition to the database.

All meme generation is done entirely client-side, by drawing the text over the images using Canvas. The client doesn’t have to download images, and the server doesn’t have to handle them at all.

It is the least expensive of all operations, because only *one* meme is sent to all clients simultaneously when published, not the entire database.
Then again, large numbers of clients are a problem for any service, the only way to fix that is to have more threads/machines and load balance. Not a problem here.