git.iko.soy/typeable/elm-ui
on master help sign in
typeable/elm-ui/benchmarks/src/ManyElements.elm
516 lines 11 kB history raw
1module ManyElements exposing
2 ( elmUI1024
3 , elmUI128
4 , elmUI2048
5 , elmUI24
6 , elmUI256
7 , elmUI4096
8 , elmUI512
9 , elmUI64
10 , elmUI8192
11 , elmUIVCSS1024
12 , elmUIVCSS128
13 , elmUIVCSS2048
14 , elmUIVCSS24
15 , elmUIVCSS256
16 , elmUIVCSS4096
17 , elmUIVCSS512
18 , elmUIVCSS64
19 , elmUIVCSS8192
20 , viewHtml1024
21 , viewHtml128
22 , viewHtml2048
23 , viewHtml24
24 , viewHtml256
25 , viewHtml4096
26 , viewHtml512
27 , viewHtml64
28 , viewHtml8192
29 , viewInline1024
30 , viewInline128
31 , viewInline2048
32 , viewInline24
33 , viewInline256
34 , viewInline4096
35 , viewInline512
36 , viewInline64
37 , viewInline8192
38 )
40{-| -}
42import Benchmark.Render
43import Element exposing (..)
44import Element.Background as Background
45import Element.Font as Font
46import Element.Keyed
47import Html
48import Html.Attributes
49import Internal.Model as Internal
53{- START BENCHMARKS -}
56elmUI24 : Benchmark.Render.Benchmark Model Msg
57elmUI24 =
58 elmUI "elmUI24" 24
61elmUI64 : Benchmark.Render.Benchmark Model Msg
62elmUI64 =
63 elmUI "elmUI64" 64
66elmUI128 : Benchmark.Render.Benchmark Model Msg
67elmUI128 =
68 elmUI "elmUI128" 128
71elmUI256 : Benchmark.Render.Benchmark Model Msg
72elmUI256 =
73 elmUI "elmUI256" 256
76elmUI512 : Benchmark.Render.Benchmark Model Msg
77elmUI512 =
78 elmUI "elmUI512" 512
81elmUI1024 : Benchmark.Render.Benchmark Model Msg
82elmUI1024 =
83 elmUI "elmUI1024" 1024
86elmUI2048 : Benchmark.Render.Benchmark Model Msg
87elmUI2048 =
88 elmUI "elmUI2048" 2048
91elmUI4096 : Benchmark.Render.Benchmark Model Msg
92elmUI4096 =
93 elmUI "elmUI4096" 4096
96elmUI8192 : Benchmark.Render.Benchmark Model Msg
97elmUI8192 =
98 elmUI "elmUI8192" 8192
102{- Elm UI VirtualCSS -}
105elmUIVCSS24 : Benchmark.Render.Benchmark Model Msg
106elmUIVCSS24 =
107 elmUIVCSS "elmUIVCSS24" 24
110elmUIVCSS64 : Benchmark.Render.Benchmark Model Msg
111elmUIVCSS64 =
112 elmUIVCSS "elmUIVCSS64" 64
115elmUIVCSS128 : Benchmark.Render.Benchmark Model Msg
116elmUIVCSS128 =
117 elmUIVCSS "elmUIVCSS128" 128
120elmUIVCSS256 : Benchmark.Render.Benchmark Model Msg
121elmUIVCSS256 =
122 elmUIVCSS "elmUIVCSS256" 256
125elmUIVCSS512 : Benchmark.Render.Benchmark Model Msg
126elmUIVCSS512 =
127 elmUIVCSS "elmUIVCSS512" 512
130elmUIVCSS1024 : Benchmark.Render.Benchmark Model Msg
131elmUIVCSS1024 =
132 elmUIVCSS "elmUIVCSS1024" 1024
135elmUIVCSS2048 : Benchmark.Render.Benchmark Model Msg
136elmUIVCSS2048 =
137 elmUIVCSS "elmUIVCSS2048" 2048
140elmUIVCSS4096 : Benchmark.Render.Benchmark Model Msg
141elmUIVCSS4096 =
142 elmUIVCSS "elmUIVCSS4096" 4096
145elmUIVCSS8192 : Benchmark.Render.Benchmark Model Msg
146elmUIVCSS8192 =
147 elmUIVCSS "elmUIVCSS8192" 8192
151{- Normal Html -}
154viewHtml24 : Benchmark.Render.Benchmark Model Msg
155viewHtml24 =
156 viewHtml "viewHtml24" 24
159viewHtml64 : Benchmark.Render.Benchmark Model Msg
160viewHtml64 =
161 viewHtml "viewHtml64" 64
164viewHtml128 : Benchmark.Render.Benchmark Model Msg
165viewHtml128 =
166 viewHtml "viewHtml128" 128
169viewHtml256 : Benchmark.Render.Benchmark Model Msg
170viewHtml256 =
171 viewHtml "viewHtml256" 256
174viewHtml512 : Benchmark.Render.Benchmark Model Msg
175viewHtml512 =
176 viewHtml "viewHtml512" 512
179viewHtml1024 : Benchmark.Render.Benchmark Model Msg
180viewHtml1024 =
181 viewHtml "viewHtml1024" 1024
184viewHtml2048 : Benchmark.Render.Benchmark Model Msg
185viewHtml2048 =
186 viewHtml "viewHtml2048" 2048
189viewHtml4096 : Benchmark.Render.Benchmark Model Msg
190viewHtml4096 =
191 viewHtml "viewHtml4096" 4096
194viewHtml8192 : Benchmark.Render.Benchmark Model Msg
195viewHtml8192 =
196 viewHtml "viewHtml8192" 8192
200{- Inline Html -}
203viewInline24 : Benchmark.Render.Benchmark Model Msg
204viewInline24 =
205 viewInline "viewInline24" 24
208viewInline64 : Benchmark.Render.Benchmark Model Msg
209viewInline64 =
210 viewInline "viewInline64" 64
213viewInline128 : Benchmark.Render.Benchmark Model Msg
214viewInline128 =
215 viewInline "viewInline128" 128
218viewInline256 : Benchmark.Render.Benchmark Model Msg
219viewInline256 =
220 viewInline "viewInline256" 256
223viewInline512 : Benchmark.Render.Benchmark Model Msg
224viewInline512 =
225 viewInline "viewInline512" 512
228viewInline1024 : Benchmark.Render.Benchmark Model Msg
229viewInline1024 =
230 viewInline "viewInline1024" 1024
233viewInline2048 : Benchmark.Render.Benchmark Model Msg
234viewInline2048 =
235 viewInline "viewInline2048" 2048
238viewInline4096 : Benchmark.Render.Benchmark Model Msg
239viewInline4096 =
240 viewInline "viewInline4096" 4096
243viewInline8192 : Benchmark.Render.Benchmark Model Msg
244viewInline8192 =
245 viewInline "viewInline8192" 8192
249{- END BENCHMARKS -}
252type alias Model =
253 { index : Int
254 , numberOfElements : Int
255 , elements : List Int
256 }
259type Msg
260 = Refresh
261 | Tick Float
264{-| -}
265elmUIVCSS : String -> Int -> Benchmark.Render.Benchmark Model Msg
266elmUIVCSS name count =
267 { name = name
268 , init =
269 { index = 0
270 , numberOfElements = count
271 , elements = List.range 0 (count - 1)
272 }
273 , view =
274 \model ->
275 Element.layoutWith
276 { options =
277 [ Internal.RenderModeOption
278 Internal.WithVirtualCss
279 ]
280 }
281 []
282 (Element.column [ spacing 8, centerX ]
283 (List.map (viewEl model.index) model.elements)
284 )
285 , update =
286 \msg model ->
287 case msg of
288 Refresh ->
289 if model.index > model.numberOfElements then
290 { model | index = 0 }
292 else
293 { model | index = model.index + 1 }
295 Tick i ->
296 if model.index > model.numberOfElements then
297 { model | index = 0 }
299 else
300 { model | index = model.index + 1 }
301 , tick = Tick
302 , refresh = Refresh
303 }
306{-| -}
307elmUI : String -> Int -> Benchmark.Render.Benchmark Model Msg
308elmUI name count =
309 { name = name
310 , init =
311 { index = 0
312 , numberOfElements = count
313 , elements = List.range 0 (count - 1)
314 }
315 , view =
316 \model ->
317 Element.layout []
318 (Element.column [ spacing 8, centerX ]
319 (List.map (viewEl model.index) model.elements)
320 )
321 , update =
322 \msg model ->
323 case msg of
324 Refresh ->
325 if model.index > model.numberOfElements then
326 { model | index = 0 }
328 else
329 { model | index = model.index + 1 }
331 Tick i ->
332 if model.index > model.numberOfElements then
333 { model | index = 0 }
335 else
336 { model | index = model.index + 1 }
337 , tick = Tick
338 , refresh = Refresh
339 }
342viewEl selectedIndex index =
343 el
344 [ Background.color
345 (if selectedIndex == index then
346 pink
348 else
349 white
350 )
351 , Font.color
352 (if selectedIndex /= index then
353 pink
355 else
356 white
357 )
358 , padding 24
359 , width (px 500)
360 , height (px 70)
361 ]
362 (if selectedIndex == index then
363 text "selected"
365 else
366 text "Hello!"
367 )
370white =
371 rgb 1 1 1
374pink =
375 rgb255 240 0 245
378pinkish i =
379 rgb255 (wrap255 (i + 240)) 0 245
382wrap255 i =
383 if i > 255 then
384 0
386 else if i < 0 then
387 0
389 else
390 i
393{-| -}
394viewHtml : String -> Int -> Benchmark.Render.Benchmark Model Msg
395viewHtml name count =
396 { name = name
397 , init =
398 { index = 0
399 , numberOfElements = count
400 , elements = List.range 0 (count - 1)
401 }
402 , view =
403 \model ->
404 Html.div []
405 [ Html.div []
406 (List.map (viewHtmlElement model.index) model.elements)
407 ]
408 , update =
409 \msg model ->
410 case msg of
411 Refresh ->
412 if model.index > model.numberOfElements then
413 { model | index = 0 }
415 else
416 { model | index = model.index + 1 }
418 Tick i ->
419 if model.index > model.numberOfElements then
420 { model | index = 0 }
422 else
423 { model | index = model.index + 1 }
424 , tick = Tick
425 , refresh = Refresh
426 }
429viewHtmlElement selectedIndex index =
430 Html.div
431 [ Html.Attributes.class
432 (if selectedIndex == index then
433 "white"
435 else
436 "pink"
437 )
438 ]
439 [ Html.div []
440 [ if selectedIndex == index then
441 Html.text "selected"
443 else
444 Html.text "Hello!"
445 ]
446 ]
449{-| -}
450viewInline : String -> Int -> Benchmark.Render.Benchmark Model Msg
451viewInline name count =
452 { name = name
453 , init =
454 { index = 0
455 , numberOfElements = count
456 , elements = List.range 0 (count - 1)
457 }
458 , view =
459 \model ->
460 Html.div []
461 [ Html.div []
462 (List.map (viewInlineHtmlElement model.index) model.elements)
463 ]
464 , update =
465 \msg model ->
466 case msg of
467 Refresh ->
468 if model.index > model.numberOfElements then
469 { model | index = 0 }
471 else
472 { model | index = model.index + 1 }
474 Tick i ->
475 if model.index > model.numberOfElements then
476 { model | index = 0 }
478 else
479 { model | index = model.index + 1 }
480 , tick = Tick
481 , refresh = Refresh
482 }
485viewInlineHtmlElement selectedIndex index =
486 Html.div
487 (if selectedIndex == index then
488 [ Html.Attributes.style "background-color" (renderColor (wrap255 (index + 240)) 0 245)
489 , Html.Attributes.style "color" "white"
490 , Html.Attributes.style "padding" "24"
491 ]
493 else
494 [ Html.Attributes.style "background-color" "white"
495 , Html.Attributes.style "color" (renderColor (wrap255 (index + 240)) 0 245)
496 , Html.Attributes.style "padding" "24"
497 ]
498 )
499 [ Html.div []
500 [ if selectedIndex == index then
501 Html.text "selected"
503 else
504 Html.text "Hello!"
505 ]
506 ]
509renderColor r g b =
510 "rgb("
511 ++ String.fromInt r
512 ++ ","
513 ++ String.fromInt g
514 ++ ","
515 ++ String.fromInt b
516 ++ ")"