[Feature Request] Automatically insert individual svgs for icons instead of using the entire font-awesome library

[jazir555]

• I have searched for similar features requests in both open and closed tickets and cannot find a duplicate.
• The feature is still missing in the latest stable version of Elementor ( Elementor Pro. )

What problem is your feature request going to solve? Please describe.

Currently the entire font-awesome libraries for solid, regular and brands are used when only a few icons from these massive libraries are in use. This leads to a lot of extraneous code and page weight, which really slows down sites. https://elementor.com/help/speed-up-a-slow-site/. This url has instructions for how to remove font-awesome entirely, but requires that you have a child theme and have some knowledge of how to use them.

Describe the solution you'd like

Instead of having to manually paste this code inside of a child theme, I think Elementor should automatically download the individual svg files from font-awesome and insert them where the icons are being used, to prevent the full library from needing to be downloaded. This could cut page weight by 150 kb or more depending on how few icons are used.

Describe alternatives you've considered

https://elementor.com/help/speed-up-a-slow-site/

Manually removing font-awesome as described in this link above, and then manually inserting icons via svg files. This is time consuming and cumbersome. You may also miss a few icons that are scattered throughout your site since disabling them globally requires that each icon be manually replaced. This solution would automatically replace all icons with the correct individual icon files to reduce page sizes.

[shimsa]

+1

[DorShahar]

Merged issue

I merged this issue with #11772, which is on the same subject so we could deal with it more efficiently.
Please feel free to continue the conversation there.
Thanks for your feedback!