Loading…
33
Hot take: I picked a vanilla JS icon setter over an icon font and my SVG file went from 400kb to 60kb
I build small web tools on the side and needed a set of about 90 icons for a dashboard project, so the choice was an icon font or inline SVGs powered by a tiny script. I went with the script (roughly 40 lines, uses a data attribute and innerHTML) and after gzipping the bundle fell from 400kb to 60kb, plus no more fake glyph boxes when a font fails to load. The one thing that bit me was losing CSS color inheritance on the first pass, so I had to add fill="currentColor" inside each path. Now I'm wondering if a sprite sheet would beat inline for repeat icons, has anyone compared the two on a project this size?
0 comments
Log in to join the discussion
Log In0 Comments
No comments yet
Be the first to share your thoughts on this discussion.