Template preprocess to generate Font Awesome markup for menu links

In Drupal 9, I need the ability to prepend Font Awesome icons to menu links.

I have attached Font Awesome 5 JS and CSS assets to my theme via *.libraries.yml.

If I open a menu link in the DOM inspector and edit the markup of a link from this:

<ul class="clearfix nav">
  <li class="nav-item">
    <a href="#comments" class="nav-link nav-link-comments">Comments</a>
  </li>
</ul>

to this:

<ul class="clearfix nav">
  <li class="nav-item">
    <i class="fas fa-comment"></i><a href="#comments" class="nav-link nav-link-comments">Comments</a>
  </li>
</ul>

The Font Awesome JavaScript detects the empty <i class="fas fa-comment"></i> element, and the result looks exactly like what I want it to look like.

However, it's been very tricky to add that markup to the link element programmatically.

I can do it with JavaScript DOM manipulation in a Drupal behavior, but I'd prefer to prepare the markup in Twig and preprocess.

After trying and rejecting a couple of other modules, I am now looking at menu_link_attributes.

It's very easy to add the class .fa-comment to this menu link:

<ul class="clearfix nav">
  <li class="nav-item">
    <a href="#comments" class="fa-comment nav-link nav-link-comments">Comments</a>
  </li>
</ul>

I'm looking at an old forum thread which explains a template preprocess approach to matching classes starting with fa-, and using that value to generate <i> tags with the needed classes. This approach may have worked with Drupal 7.

The THEME_menu_link() preprocess function does not seem to work in D8 and D9, so I am trying to rewrite it using THEME_preprocess_links(). But when I drop a dump($variables); in this function, I do not see all the menu links.

While I'm looking for a different template preprocess function, I thought I'd describe the issue here, in case it's something you've encountered before.

NOTE: This question is technically a duplicate, but the old one never got answered so I think I'm safe to ask it again.