Incredibly slow admin

Thanks for giving the plugin a try. Yes, I’d like to learn more about your situation to see if there’s a problem here that I can fix.

Here are some questions I have:

The title of your issue is “Incredibly slow admin”. Do you mean that the WordPress admin interface–in general–is slow? For example, are you saying that when you use the admin interface to edit WordPress posts that it’s slow? Or, do you mean that the admin settings page for this Font Awesome plugin is slow? Or something else?

You said:

I know there was updates from other plugins…

Do you mean that you updated some plugins other than the Font Awesome plugin when you began experiencing the slow down? If so, it may help to know which those were. If not, could you explain what you mean regarding “other plugins”?

Thanks,
-mike

Thanks for replying.
Yes it’s the WordPress admin which is slow when editing a post.
And about the other plugins, there was an update of WPBakery Page Builder, Yoast SEO and WordPress itself (5.1).
Today I load fontawesome another way, the classic way because it was impossible editing a post. So we don’t have any icons preview through the admin nor prevent of unregistered themes or plugins.

If the slowness is happening while doing the actual post editing (the typing of the content and navigation around the editor in the browser), then the main way I can think of that there _might_ be some performance implications as a result of Font Awesome, would be if you have both the SVG method enabled for Font Awesome _and_ pseudo-elements support. There are some known performance problems with that in some situations, so we advise against using that configuration unless absolutely necessary. In generally, we advise against use pseudo-elements, when possible, to reference icons–in part for this reason. You could switch to the “webfont” method on the plugin’s options page to see if that makes a difference, since there’s no performance problem with pseudo-elements and webfonts.

I’m also curious if, when you have this combination of plugins installed, do you see any of the other ones show up as “unregistered clients” on the Font Awesome options page? If so, what happens when you enable that “Remove unregistered clients” option on the options page?

Finally, I just released version 4.0.0-rc8. It primarily addresses a class of potential conflicts with other plugins on the _back end_ (on the WordPress server, not in the admin UI in the browser), so I’m not sure how that would pertain to the issue you’re seeing with slow post editing on the front end. But since it does potentially impact interaction with other plugins, it might make a difference. Could you give 4.0.0-rc8 a try?

Thanks a lot for you anwser !

You guessed our usage. I have both svg and pseudo elements support activated. But I did try with and without that second option and it changes nothing.
Today I use to load both method but in my templates and I don’t have anymore performance issues but I don’t have preview in the admin too… and I don’t encounter performance issues in the front.

I don’t see any other clients but I know there is (WPBakery Page Builder for example) so I can’t remove them.

I will give this new version a try and will tell you.

So I tried this new version and I can confirm when the performance issue happen :
Everything is fine until the pseudo-elements option is activated and if there’s an icon in the content on a page edition (simple <i>).

I need to get pseudo elements in some cases and I will try to remove them (but don’t know if it will be possible).

OK, thanks for that confirmation.

Yes, unfortunately, the performance problems are pretty much unavoidable if using SVG/JS and pseudo-elements. We know that sometimes you must use them, especially if you’re adding icons to html elements for which you don’t control the markup. In those cases, it’s usually best for performance to use the webfont method if you can’t eliminate the pseudo-elements.

There is a lower-level advanced option for limiting the scope within the DOM in which icon markup and pseudo-elements are searched and replaced with SVGs.

You could add a <script> that appears after the <script> that loads Font Awesome, which could make a call to dom.watch() and pass parameters that limit the scope of the DOM being watched. If you know for sure that you only want a limited scope to be watched, you could narrow it this way, which would improve performance.
https://fontawesome.com/how-to-use/with-the-api/methods/dom-watch

You might also use such a script to configure Font Awesome to disable pseudo-elements only while in admin (but let them work as normal on public facing pages), or to turn off auto replacement altogether while in the admin UI.
https://fontawesome.com/how-to-use/with-the-api/setup/configuration

These lower-level tweaks might have unintended side-effects with other plugins that are trying to use Font Awesome, so it’s not a good solution unless you’re sure about your approach. Also, it’s not supported by this plugin, so you’d need to add a hook to your functions.php, for example, to add such extra <script> blocks.