![]() ![]() On top of that, we rely on the usage of conditional GET requests and 304 Not Modified responses to cut down on the amount of real work we must do in the resizing level. Thanks to this, the Dynamic Gif Resizer only gets a little over 1,000 resize requests per second, thanks to an incredibly-high cache hit ratio on our CDNs. To make all this possible, tumblr heavily relies on CDNs to cache massive amounts of static content and avoid repeated work. The entire gif resize request (downloading the upstream image, resizing the gif, and serving the response) is now only 400ms on average. This brought down the average wall time of a gif resize to about 100ms. With this new threaded resize option in gifsicle, we gained about a 1.5-2x speed-up in resizing an average gif against using the vanilla gifsicle. Luckily for us (and the world!), gifsicle author Eddie Kohler accepted and merged our changes into gifsicle. Since a gif is just a stack of image frames, we figured that resizing them using a thread pool could lead to a performance improvement. In order to resize a gif in a realistic timeframe for on-demand resizing and serving, we proposed some changes to gifsicle that parallelizes the resizing step. Essentially, we switched our gif resizing library from ImageMagick to gifsicle with great success-we got lower latency and higher-quality results. However, as the true “home of the gif,” Tumblr isn’t ever giving up on your gif files!Ī while ago, one of my colleagues posted about updates we made in our gif resizing technology. Instagram will loop your video clips, but will flatten gifs to a still image. Many companies have punted on the gif file format entirely imgur released their gifv format, which wraps an mp4 video. When compared to video format counterparts (H.264 and the like), the gif file size can be tens of times larger at similar visual quality. Last touched in 1989, the format is woefully outdated, and this begets massive, low quality animated images. However, the actual Graphics Interchange Format leaves much to be desired. They capture a special or hilarious moment and repeat it back to you, forever. Gifs, as a medium, are a wonderful thing. Not having to store the resizes saves us tens of thousands of dollars a month! So, the natural question was, can we also do this for gifs and make a “Dynamic Gif Resizer?” This has been a great success our “Dynamic Image Resizer” churns through over 6,000 images a second, at a roundtrip request latency of only 250ms per image. We began with resizing jpg and png images on-demand instead of persisting each different resize crop in our S3 bucket. If we were to upgrade image quality, add a new size crop, or change how we handle taking down media, the effect would only be marginal… what a bummer! The cost of storing all the resizes as separate files (petabytes of data!), along with a lack of agility moving forward, motivated us to adopt a dynamic resizing and serving strategy. This made serving our images very fast-just grab the size you want right from the bucket! While this was great, it also meant that any changes to our image processing would not affect any images we had already saved (billions of images). You could delete frames 31 and 60, then double the duration of frames 1 and 30 to 0,06.Why dynamically resize images in the first place?īefore the dawn of on-demand resizing at Tumblr, every posted image was resized into seven or eight different sizes, and each was saved into our backing media store (a massive S3 bucket). P.S.: If you want to really make the file as light as possible, you could also remove the duplicate frames 1 and 60 are the same, and so are 30 and 31. I put a black background to show the guides better. The way I would do it would be to use guides to mark how much I can crop from all 4 sides and still include everything. This means that you can only crop the content: Your canvas has to be big enough to include the content of every single layer, no matter where the content is located and how big it is. Therefore, you cannot crop every frame of this animation based on the content of only one layer. Because of the way Photoshop works, when you crop an image it crops every layer the same size, and with the same x and y coordinates. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |