Another Beamer Theme Matrix

Matthew Petroff — Sat, 29 Nov 2014 03:00:11 +0000

The Beamer package for creating presentation slides has hundreds of styles available between all of the combinations of its included themes and color themes. Therefore, it is helpful to be able to look through all the possibilities in order to choose a style. A resource for this exists, the Beamer Theme Matrix; however, its load times lead much to be desired, particularly on a slower Internet connection. It uses two separate images for each combination, causing the browser to make over 800 requests to the server. This, combined with a page size of approximately 6.6MB, causes page load times in excess of 10 seconds on a fast connection and over a minute on a slow one. To remedy this, I created Another Beamer Theme Matrix. The page is less than 1MB and causes the browser to make fewer than 40 requests to the server, resulting in load times of under a second on a fast connection and under 10 seconds on a slow one, an order of magnitude improvement. This is accomplished by combining the thumbnails for each color theme of a particular theme into a single PNG sprite, which is then reduced to 8-bit color using pngquant and further optimized using OptiPNG. To further increase usability of the matrix, small bits of JavaScript were used to always keep the row and column labels visible, a lightbox was added for viewing the full-size previews, and a welcome and help screen was added that explains the matrix and how to use values from the matrix in a document.

Another Beamer Theme Matrix’s source code is available under an MIT license on GitHub. While inspired by the existing Beamer Theme Matrix, it is a complete rewrite in Python.

matrix – Matthew Petroff

Another Beamer Theme Matrix