svelte/site/content/tutorial/05-events/02-inline-handlers/text.md

---
title: Inline handlers
---

You can also declare event handlers inline:

```html
<div on:mousemove="{e => m = { x: e.clientX, y: e.clientY }}">
	The mouse position is {m.x} x {m.y}
</div>
```

The quote marks are optional, but they're helpful for syntax highlighting in some environments.

> In some frameworks you may see recommendations to avoid inline event handlers for performance reasons, particularly inside loops. That advice doesn't apply to Svelte — the compiler will always do the right thing, whichever form you choose.