FontAwesome Slow Loading on 3.61

4 posts by 2 authors in: Forums > CMS Builder
Last Post: October 19, 2023   (RSS)

By KennyH - October 12, 2023

I have upgraded all of my installations to 3.61 and I am noticing that on the front-end, fontawesome icons are showing squares and then loading a second or two after that. In the CMSB, the same thing happens but the text font also appears one way (taller) and then a second or two later it changes to the recognized font I have always seen.

On the front-end of the website, I use the minified css for fontawesome 6 pro (hosted locally - all.min.css)

So I have access to all of the icons available in fontawesome, I have modified lib/menus/header_css.php to not use the locally hosted fontawesome-free and to use one of my CDN kits from fontawesome using

<script src="https://kit.fontawesome.com/xxxxxxxxx.js" crossorigin="anonymous"></script>

This kit is only used my CMSB installations and not on the front-end since those are locally hosted. Both are running the latest version of 6.4.2

Has anything changed with 3.61 that might be causing an issue - especially if we are trying to load two different versions of FontAwesome?  How does this affect icons that are coded into the HTML and not tied to CMSB?

At risk of sending anyone down a rabbit hole, I only ask this since I have checked everything else I know to check and this only occurred after the upgrades. Should I being doing something different for lib/menus/header_css.php?

Kenny H

By KennyH - October 16, 2023 - edited: October 16, 2023

So far, I think this is working. It has been intermittent depending on which site I go to. I have updated dozens of sites and tested them before and after. On the sites where the slow load occurred, commenting out the cache headers seemed to have fixed the problem (tried it on different browsers and it all loaded as expected).

I am wondering if it was conflicting with my .htaccess directives. In my .htaccess files, I have this:

# Set cache expiration directives
ExpiresActive on
ExpiresDefault "access plus 1 year"

# Images
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/webp "access plus 1 year"
ExpiresByType image/svg+xml "access plus 1 year"
ExpiresByType image/x-icon "access plus 1 year"

# Video
ExpiresByType video/webm "access plus 1 year"
ExpiresByType video/mp4 "access plus 1 year"
ExpiresByType video/mpeg "access plus 1 year"

# Fonts
ExpiresByType font/ttf "access plus 1 year"
ExpiresByType font/otf "access plus 1 year"
ExpiresByType font/woff "access plus 1 year"
ExpiresByType font/woff2 "access plus 1 year"
ExpiresByType application/font-woff "access plus 1 year"
ExpiresByType application/font-woff2 "access plus 1 year"

# CSS, JavaScript
ExpiresByType text/css "access plus 1 year"
ExpiresByType text/javascript "access plus 1 year"
ExpiresByType application/javascript "access plus 1 year"

# Others
ExpiresByType application/pdf "access plus 1 year"
ExpiresByType image/vnd.microsoft.icon "access plus 1 year"

By Dave - October 19, 2023

Hi Kenny, 

Okay, interesting.  If you can find a sample site where it occurs consistently you could send us the FTP & CMS login and we could take a look. It could be a combination of the headers being sent from various places.  If there's a way we can prevent it from CMSB we'd want to do that.

One way to check in Chrome is to open the Inspection Panel (Ctrl-Shift-i or equivalent) and then click on the network tab.  If you go to a CMSB page and reload it will list all the files loaded.  Under the "size" column it will show bytes loaded or "(memory cache)".  Mine shows everything but the PHP file being loaded from the (memory cache) unless I force reload (ctrl-F5).

Feel free to send us a site in a 2nd level support ticket if you'd like us to take a look.

Cheers!

Dave Edis - Senior Developer
interactivetools.com