Case Study: The Benefits of Vector Sprite Sheets

The ampersand, "&" is one of the most common ligatures; a character formed by combining two or more graphemes, like the letters "e" and "t". These ligatures then become symbolic of more complex meanings than their graphemes. What if you could make ligatures out of other ligatures? It's a weird thing to think about, but I quickly learned of it's practical application during my time as a contractor for Promazo.

The process of how this became the solution to reducing redundant iconography within their Suite of PWAs actually started with another problem, network requests. Having to lazy load thousands of vector images on some pages would cause their applications to slow to a crawl during user testing. After researching ways to combat this issue, I came up with a somewhat unconventional solution, adpoted from a practice that game developers have been doing for a while. Read the full case study linked here to see how vector sprite sheets improved load times, page performance, accessibility, and led to the development of superligatures!

More by Fronrich Puno

View profile