React-icons - explore solution that doesn't repeat SVG source for each use of an icon

[mcoker]

Delivering the full SVG source for each icon is an easy and reliable way to add an icon to a page. However, if there are multiple uses of a single icon on a page or throughout an application, it may be advantageous in terms of page weight to not have to repeat the full source for each instance of an icon.

SVG symbols are a great way to do that. They allow you to add an icon's full source on the page once, then reference that source with a simple tag wherever the icon is to be used. Symbols can be used for single icons, or to create an SVG sprite with multiple icons.

As part of our recent day of learning, I explored this a bit and made a basic update that would allow react-icons to create individual symbols and the tag to use the symbol. This issue is to explore that and see if it's something we'd like to add to the react-icons package.