I use this quite a bit! At the very least, if you're going to insist on using a custom font, having the rest of one of these stacks behind it can help guarantee that users with third-party resource blockers or other weird browsers get an experience closer to what you intend.
For example, I always take Google Font's suggestion for Inter[1]:
font-family: "Inter", sans-serif;
font-family: "Inter", system-ui, sans-serif;
font-family: "EB Garamond", serif;
font-family: 'EB Garamond', 'Iowan Old Style', 'Palatino Linotype', 'URW Palladio L', P052, serif;
https://screenspan.net/fallback is a good resource for finding out which system font looks most like the intended webfont, e.g. in my use case, Verdana has similar metrics to Roboto Serif.
But there's no guarantee that system-ui is even a sans serif font. Why make that change?
Because they're really different? system-ui is the specific font the OS uses for its interface... San Francisco in macOS/iOS/iPad OS, Roboto in Android, Segoe UI in Windows, etc. sans-serif is often Arial or Helvetica, but could be anything.