Heads up! This blog post hasn't been updated in over 2 years. CodePen is an ever changing place, so if this post references features, you're probably better off checking the docs. Get in touch with support if you have further questions.

Hey folks! Another interesting infrastructure change we thought we’d share. When we first launched the service where we take a screenshot of every Pen created (for use in RSS and on mobile, for example) we did that through PhantomJS running on Linux.

We even made some improvements to the setup to allow for custom fonts. But the font situation still wasn’t great. The fonts were aliased, not very smooth, and some common fonts just straight up weren’t available (like Times New Roman). I’m sure there are some outliers here and there, but most people agree that fonts really look best on a Mac. So we set out to ditch out Linux setup and start using Macs for the screenshots.

We ended up settling on MacStadium, which offers dedicated Mac Mini server hosting.


We think the fonts are looking much better!

Demo Pen

Tim Sabat, our master of infrastructure, took less than a day to make the whole change. There are some Pros and Cons of course. Here is Tim’s thinking:

  • Pro: The screenshots are way better
  • Pro: We own the hardware
  • Pro: We pay less per month for the hosting/bandwidth than we did on AWS
  • Con: We lose the ability to be able to auto-scale since we can’t create AMIs of the box, but the power/ram of the box is 2-3 times greater than that of the EC2 M1 Large we were using