User tests: Successful: Unsuccessful:
Pull Request for Issue #30793 .
This loads fontawesome.css with font-face
run npm install
and please look #30793 for detail
font-face not loaded
font-face loaded
none
Status | New | ⇒ | Pending |
Category | ⇒ | Repository |
Loading all the fonts by default results to 3 fonts that need to be fetched with a size (at least) over 164kb +(59kb for the css file). The problem is that this css is a render-blocking asset, meaning nothing is painted in the screen before the css and all the dependencies are fetched, parsed and evaluated. In sort say bye-bye to any meaningful lighthouse scores destroying any SEO, UX and eventually, the ROI of anything build with Joomla...
There are 2 ways out of this:
A modern browsers will load the font file only when it really used.
The PR fine as it is.
A modern browsers will load the font file only when it really used.
True, but the css is still render-blocking so bye-bye meaningful performance. I mean the PR is fine but font awesome just destroys performance and this has nothing to do with the PR rather the higher-order decision to stick with the outdated practice of using fonts for the icons.
Anyways my comment was more to indicate that Joomla is drifting away from being a viable and competitive solution due to the enforced Bootstrap, Jquery and Font Awesome. People will, eventually, figure this out the hard way, sooner or later...
Hi, sorry but I don't understand in which file I shall make the changes ...
I have downloaded this version and wanted to check the icons in the article using my own template. But, there is no Fontawesome icons in this version ! it still uses the Icomoon !
how am I supposed to test that ?
I tried to test this PR: applied the patch, run npm, removed the fontawesome.min.css
file from Cassiopeia. I see now that the media/vendor/fontawesome-free/css/fontawesome.min.css
is being loaded. The file loads the font-face, but the font is not there, I think the path to the webfonts is not correct, e.g. url(../webfonts/fa-solid-900.woff2) format("woff2")
. And the definitions of the Joomla icons (e.g. ) are missing.
for whom want to use it (in own template), it does not include joomla icons
😉
this hit me yesterday, so I'm in favor for merging this.
as @Fedik already said "fonts are only loaded when used", of course if you use them they will be loaded and svg maybe better but it's too late for that.
For the b/c layer in atum and cassopeia I would move the icomoon css to it's own joomla asset so it can be loaded only when needed. (I don't know why cassopeia loads b/c icons but I'm sure there is a reason). for the Backend 3rd party extensions that needs icon could simply include the b/c package with the asset manager.
I don't know why cassopeia loads b/c icons but I'm sure there is a reason
Cassiopeia doesn't load b/c icons, in the Joomla views we still have the old classes "icon-edit", "icon-calendar", etc. What was done, is a conversion / mapping from the classes with Fontawesome content (icons). The file media/system/css/joomla-fontawesome.css
contains these mapping and loads the webfonts.
This PR will load Fontawesome / webfonts without the Joomla icons.
Labels |
Added:
?
|
This pull request has automatically rebased to 4.2-dev.
This pull requests has been automatically converted to the PSR-12 coding standard.
Labels |
Added:
?
?
Removed: ? |
Closing this in favor of using media/system/css/joomla-fontawesome.css
in own templates, because that file includes the mapping of Joomla icons to Fontawesome.
Status | Pending | ⇒ | Closed |
Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2022-10-21 11:32:14 |
Closed_By | ⇒ | drmenzelit |
@ced1870 Please test. Thanks in advance.