Font-awesome: Idea: split off brands from _icons.scss (and resulting files)

[My1]

while the non brand icons surely make sense in the fontawesome.css because they are in the 3 main variants of FA, the brands only exist in FA Brands, which would make it more fitting to split off the brand icons and have them available in brands.css only so that is no brands are used, we dont need to waste space and bandwidth.

considering brands already was moved into a seperate font file I would think that going all the way would be best here.

[tagliala]

Hi!

Could you please clarify this request and follow our contributing guidelines for feature requests?

[My1]

Describe the problem you'd like to see solved or task you'd like to see made easier

using only certain styles without wasting a lot of space/bandwidth

Is this in relation to an existing part of Font Awesome or something new?

CSS/SCSS

What is 1 thing that we can do when building this feature that will guarantee that it is awesome?

complete the split of FA-brands from the main icons

Why would other Font Awesome users care about this?

they waste less traffic (which obviously becomes a big point on bigger sites)

On a scale of 1 (sometime in the future) to 10 (absolutely right now), how soon would you recommend we make this feature?

I would think 3. it's not really important but defintiely useful in the future.

---

some actual explanation.
when you dont want to use certain styles you need to use fontawesome.min.css plus the files of those styles so if you only need FA-Regular you need fontawesome.min.css and regular.min.css. the point though is that fontawesome.css contains the references to ALL the brand icons, which amounts to about 14KB, or about 21% of the 66,2KB fontawesome.min.css, which obviously means big savings, if the brands were split apart and are not used.

[tagliala]

I think I've got it.

So you basically want that css rules related to brand icons, let's say

.fa-twitter:before {
  content: "\f099"; }
/* ... */
.fa-viadeo:before {
  content: "\f2a9"; }

should be moved from font-awesome.css to brands.css

font-awesome.all.css should be unaffected by this change.

Am I right?

[My1]

precisely.

[dangowans]

I would love to ultimately import, say, all-nobrands.min.css, that only includes the CSS for icons in the solid, regular, and light fonts.

(I guess that wouldn't really be all...)

[dangowans]

To baby step this item, would it be acceptable to resort the _icons.scss file to have the solid, regular, and light icons at the top, and the brands at the bottom? Once that's done, perhaps then the brands can be split off into _icons-brands.scss.