# @next/next/google-font-preconnect

> Require `rel="preconnect"` on `<link>` elements that point to `fonts.gstatic.com`

Google Fonts serves its font files from `fonts.gstatic.com`. A `<link>` to that host is there to open the connection early, so the font download doesn't wait for DNS and TLS. Without `rel="preconnect"`, the browser doesn't do that.

The rule looks at `<link>` elements with an `href` that starts with `https://fonts.gstatic.com`.

{/* Generated by src/codegen/lint-rule-docs.ts. Do not edit this section. */}

## Configure

Off by default. To turn it on:

```toml bunfig.toml
[lint.rules]
"@next/next/google-font-preconnect" = "error" # or "warn"
```

{/* End of the generated section. */}

## Examples

Reported:

{/* bad */}
```jsx
const hint = <link href="https://fonts.gstatic.com" />;
```

{/* bad */}
```jsx
const hint = <link rel="preload" href="https://fonts.gstatic.com" />;
```

Not reported:

{/* good */}
```jsx
const hint = <link rel="preconnect" href="https://fonts.gstatic.com" />;
```