# @next/next/no-sync-scripts

> Disallow `<script src>` without `async` or `defer`

When the browser hits a `<script>` with a `src`, it stops reading the HTML until it has downloaded and run the file. Nothing below the tag shows up in the meantime, so a slow third-party server holds up your whole page.

With `async` or `defer`, the browser keeps reading the HTML while the file downloads. `Script` from `next/script` doesn't block either, and it lets you pick when the script loads.

{/* 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/no-sync-scripts" = "error" # or "warn"
```

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

## Examples

Reported:

{/* bad */}
```jsx
export default function Checkout() {
  return <script src="https://example.com/payments.js" />;
}
```

Not reported:

{/* good */}
```jsx
export default function Checkout() {
  return <script src="https://example.com/payments.js" defer />;
}
```

{/* good */}
```jsx
import Script from "next/script";

export default function Checkout() {
  return <Script src="https://example.com/payments.js" />;
}
```