Update web snippet for better performance

[pepelsbey]

When browsers see anything like this in the CSS file:

@import url('https://rsms.me/inter/inter.css');

…it takes a pause to:

• Connect to an external domain (DNS, SSL, etc.)
• Start loading the external CSS file

Which is usually delays rendering for a few moments.

Google Font’s snippet is using HTML imports for CSS:

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:slnt,wght@-10,400;0,400;0,700&display=swap" rel="stylesheet">

While the browser is parsing HTML, the very first thing it does, it also:

• Pre-connects to the external domain
• Start loading the external CSS file

In your case, there’s no need for the second preconnect since all the files are on the same domain.

I’d also suggest expanding the snippet a bit for better readability.