hypra

COMP-009: page expands to too many elements

Error: the page doesn't build until this is fixed.

Components are written into the page when it compiles. A component that uses another one ten times, which uses another one ten times, multiplies: six levels make a million elements, and a page that size would take long to compile and never load. The limit is 200,000.

Fails

component Tile { div "·" }
component Row { Tile Tile Tile Tile Tile Tile Tile Tile Tile Tile }
component Block { Row Row Row Row Row Row Row Row Row Row }
component Wall { Block Block Block Block Block Block Block Block Block Block }
component Floor { Wall Wall Wall Wall Wall Wall Wall Wall Wall Wall }
component House { Floor Floor Floor Floor Floor Floor Floor Floor Floor Floor }
component Street { House House House House House House House House House House }

page(title: "Shoes", description: "All our running shoes, from light racers to trail shoes.") {
  h1 "Shoes"
  Street
}
error[COMP-009]: the page expands to more than 200000 elements
 --> page.hypra:2:42
  |
2 | component Row { Tile Tile Tile Tile Tile Tile Tile Tile Tile Tile }
  |                                          ^^^^
  = help: components that use other components several times multiply; simplify the nesting
  = docs: https://hypralang.dev/rules/comp-009/

1 error, 0 warnings

Fixed

page(title: "Shoes", description: "All our running shoes, from light racers to trail shoes.") {
  props(tiles: List)
  h1 "Shoes"
  for tile in tiles { div "·" }
}

Repeating something many times is what for is for: a loop runs when the page renders, over the data it gets.