# RAN022 Definition created on every region read

`warning RAN022`: *`armOf` runs on every read of this region, so the definition is new each time and remounts.*

**Cause.** A definition (`armOf`, `Component.define`, `Component.template`, `Component.ofMembers`,
`Component.ofClass`, and `show`/`showElse`, which define two components per call) created inside an `arms` function
or a list's key or items reader runs on every region read. The arm remounts on every update; Fable Debug builds raise
*a template definition was created while a region was read*. A non-auto `static member` property that creates a
definition does the same on every read. The rule follows functions of the same file: an `arms` function bound with
`let` and passed by name, and a helper that creates the definition, such as `let mkArm view = armOf view`. Inside
`show` within arms, both `show` and the `armOf` around it are reported; hoist the outermost.

**Fix.** Bind the definition with `let` outside the template, or use `static member val`.

### Triggers

```fsharp
module Example

open Ranvier
open Ranvier.View
open Ranvier.View.Sugar

type Page =
    | Home
    | About

let page = createSignal Home

let view =
    Component.template (fun _ () -> page) (
        div () {
            matchWith (fun (p: Signal<Page>) -> p.Value) (function
                | Home -> arm (armOf (span () { "home" })) ()
                | About -> arm (armOf (span () { "about" })) ())
        }
    )
```

### Fixed

```fsharp
module Example

open Ranvier
open Ranvier.View
open Ranvier.View.Sugar

type Page =
    | Home
    | About

let page = createSignal Home
let home = armOf (span () { "home" })
let about = armOf (span () { "about" })

let view =
    Component.template (fun _ () -> page) (
        div () {
            matchWith (fun (p: Signal<Page>) -> p.Value) (function
                | Home -> arm home ()
                | About -> arm about ())
        }
    )
```

**Suppression.** `// fsharpanalyzer: ignore-line RAN022`, with the reason on the line before.