The project is licensed under the Mozilla Public License v2. Check out the Projects tab on GitHub for an idea of what we’re working on, and how you can contribute. The README is a good place to see Kanvas in action and add it to your own app. And if you’re interested, follow the project, as we’ll be posting more documentation about how Kanvas work and the history of the project.
Thanks to everyone who’s contributed to Kanvas over the years, and we’re excited to see what this new open-source & WordPress chapter brings.
The Core Web team at Tumblr is proud to announce the release of Laphs (Live Anywhere Photos - LAPhs; get it?), an open source JavaScript library for implementing Apple’s Live Photos on the web.
We use Laphs to support Live Photos on the web at Tumblr and now you can too! Check it out on github and npm and let us know what you think.
At Tumblr, we are avid fans of Kubernetes. We have been using Kubernetes for all manner of workloads, like critical-path web requests handling for tumblr.com, background task executions like sending queued posts and push notifications, and scheduled jobs for spam detection and content moderation. Throughout our journey to move our 11 year old (almost 12! 🎂) platform to a container-native architecture, we have made innumerable changes to how our applications are designed and run. Inspired by a lot of existing Kubernetes APIs and best practices, we’re excited to share with the community some of the tools we’ve developed at Tumblr as our infrastructure has evolved to work with Kubernetes.
To help us integrate Kubernetes into our workflows, we have built a handful of tools of which we are open-sourcing three today! Each tool is a small, focused utility, designed to solve specific integration needs Tumblr had while migrating our workflows to Kubernetes. The tools were built to handle our needs internally, but we believe they are useful to the wider Kubernetes community.
Making a progressive web app with webpack just got a little bit easier
Today we are releasing webpack-web-app-manifest-plugin, which generates an app manifest that shows up in your assets manifest.
I heard you like manifests
Turns out, there are a lot of web things called “manifests”. When talking about web app manifests and assets manifests, sometimes it’s hard to keep track. Buckle up, because we made a webpack plugin that deals with both of these types of manifests.
Web app manifests are JSON files that allow your application to specify the way it should be treated when installed as an application on a mobile device. You may want to specify what the application name and icon should be. Maybe you want to tell the browser to tint some of its UI elements to match the color scheme of your page, or even hide the browser chrome entirely. You can do all of that with a web app manifest.
Assets manifests are JSON files that contain paths to assets that are generated by webpack. They’re generated by plugins such as assets-webpack-plugin. If you add hashes to the end of your filenames to allow cache busting, assets manifests can be very useful. For example, we use our assets manifest to add JavaScript and CSS files to our <script> and <link> tags.
So I put a manifest in your manifest
While we were building our web app manifest, we wanted to be able to add a hash to the file path and <link> to it. So we needed to add it to our assets manifest. Unfortunately, we were unable to find any existing open-source plugins that output the file in the correct way to add it to the app manifest. So, we built webpack-web-app-manifest-plugin.
By default, webpack-web-app-manifest-plugin assumes that you will name your icon files in the format manifest/icon_[square dimension].(png|jpeg|jpg). If you name them using that scheme, you can use this plugin just like this:
// in your webpack config import AppManifestPlugin from‘webpack-web-app-manifest-plugin’;
// in your page template const manifest = // however you usually access your asset manifest in code const appManifestPath = manifest['app-manifest’].json;
<linkrel=“manifest”href={appManifestPath} />
If you named your icons with some other naming scheme, you can still add them to the web app manifest, it’s just a little more work. That process is detailed in the README.
Please use it
We’re really proud of the work we’ve done to make web app manifests compatible with asset manifests, which is why we’ve decided to open source it and publish it on npm. Please use it.
If this plugin doesn’t meet your needs, we welcome pull requests. And if you have a passion for progressive web applications, webpack, and open source, join our team!
Hi folks - long time tumblr user - love your work. Now that you are owned by Automattic - who have a long tradition of open source, I was wondering if you have any plans to open source the Tumblr iOS app?
Hello! Good question. We at Tumblr love open source as well! We don’t know yet if we’re going to open source anything like the iOS app. But if we do any new open sourcing work, we’ll post about it on here, so stay tuned.
We’re pleased to announce that Tumblr’s Database Engineering team will be attending the Percona Live MySQL Conference next week in Santa Clara, CA!
We’ll be giving a talk on our open source automation software, Jetpants, which has helped us scale to over 175 billion distinct rows of relational data to date. We’re also looking forward to attending a number of amazing sessions from our friends at Percona, Facebook, Oracle, Palomino, Etsy, and more.
If you haven’t registered yet, use code SpeakMySQL to save 15%. Hope to see you there!
Slides from our talk at Percona Live NYC are now available. The presentation covers the design and implementation of Jetpants, Tumblr’s open source toolkit for interacting with hundreds of MySQL database servers.
Interested in working with relational databases at scale? Tumblr is currently hiring database engineers in NYC!
Once again it was Hack Week (more than just a day!) at Tumblr!
This is getting repetitive in the best way. A couple of times per year
we slow down our normal work and spend a week working on scratching a
personal itch or features we want as user and see how far we can get
with our hacks. One thing from the last Hack Week in September made it all the way to a new experiment out to some testers: Tumblr Patio!
Here are some of the projects that got built for our most recent Hack
Week in January. Some of these things you may also end up seeing on the
site…
Spoiler text, spoiler blocks, and centered text!
This one is so obvious and amazing, it’s wild we don’t already have
it. For Hack Week, Katie added the ability to select text in a paragraph
to be hidden behind a wall of black that can be revealed with a tap.
This can be super useful to hide spoilers. And even better: whole
spoiler blocks. And while we’re here, the ability to center text!
A plethora of new default blog avatars
We haven’t updated our default avatars in several years. (Some of you may remember this one
from 10+ years ago.) They’re feeling a bit stale to us, so why not
update them? And while we’re at it… make a ton more variations! Paul
from the Tumblr Design team came up with a suite of new default avatars,
using our latest Tumblr color palette. Here’s a look at some of them, but there are actually many dozens more using different colors:
Notifications and emails about engagement on your posts
This one is for the folks on Tumblr who love numbers and their Activity
page. Daniel, @jesseatblr, and the Feeds & Machine Learning team
worked on some new notifications and emails we could send out to people
about how their posts have been doing lately on the platform, such as
how many views they’ve gotten, and by how many people. We already have
this available (and more) when you Blaze a post, but why not open it up
to more people? It’s really useful to the folks who use Tumblr to help
build an audience for their work!
A new way of navigating the web: the Command Palette
Some apps we use a lot have a “command palette” accessible via a
keyboard shortcut for quick keyboard-driven access to different parts of
the platform. For example, Slack and Discord have Command + K to access
their quick switchers to hop around conversations. What if Tumblr had
one? Kelly and Paul built one! Press Command/Control + K on Tumblr and
you can use your keyboard to jump to your blog, Activity, your recent
conversations, search, dozens of places!
As always, stay tuned to the @changes blog to see if any of these hacks make it on Tumblr for real!
Keeping a site like Tumblr alive and snappy for you to post at a moment’s notice, all day and night, is no small feat. Pesky crabs sneak into our data centers and cut cables all the time…
If you want to help our small but excellent systems team, want to work from anywhere, and are deep into nginx, mysql, kubernetes, and caching, join us in this adventure. Or, if you have a friend or a colleague who’s good with servers, send them our way.