Too Many SVGs Clogging Up Your Markup? Try `use

By CSS-Tricks - 2021-03-10

Description

Recently, I had to make a web page displaying a bunch of SVG graphs for an analytics dashboard. I used a bunch of , and

Summary

Too Many SVGs Clogging Up Your Markup?
But instead of props and such to populate the content, we reference which part of the SVG file we want to display.
For those of you familiar with graphics programming APIs, such as WebGL, a good analogy would be Geometry Instancing.
Might not be an option if you want the bars to be individually interactive though, like with a tooltip.

Topics

Database (0.39)
Machine_Learning (0.09)
Frontend (0.05)

Similar Articles

By CSS { In Real Life } | A Utility Class for Covering Elements - 2020-12-11

Understanding Web Standard - Shadow DOM and Custom HTML Elements

By hackernoon - 2021-01-19

Getting Familiar with New Web Standards

Boop!

By joshwcomeau - 2020-12-03

An in-depth tutorial that teaches how to create one of the most adorable interactions I've ever created. We'll learn how to use React components and hooks to abstract behaviours, and see how to design ...

An Interactive Guide to CSS Transitions

By joshwcomeau - 2021-03-06

This comprehensive guide shows how to use CSS transitions! A back-to-basics look at the fundamental building blocks we need to create microinteractions and other animations.