Given view is a HtmlData.Html msg
  1. toElmHtml view returns Html msg a regular elm/html value. It's interactive, like normal, able to update our Model

    1. Try entering html into the textarea below

    Hello, world!

    2. Manually empty the values of each input below, then click + button to get count >= 10 and see what HtmlData.Keyed is about

    Count = 4

    Alphabetical sort: ["1","2","3","4"]

    Default

    1. defaultValue = 1
    2. defaultValue = 2
    3. defaultValue = 3
    4. defaultValue = 4

    Keyed

    1. defaultValue = 1
    2. defaultValue = 2
    3. defaultValue = 3
    4. defaultValue = 4
  2. toTextHtml view returns String html value; useful for server side rendering.
    <div name="hello&quot;&gt;"><p><b>1.&#32;Try&#32;entering&#32;html&#32;into&#32;the&#32;textarea&#32;below</b></p><textarea>&lt;em&gt;Hello&lt;/em&gt;,&#32;world&#33;</textarea><div><em>Hello</em>,&#32;world&#33;</div><p style="margin-top:2em"><b>2.&#32;Manually&#32;empty&#32;the&#32;values&#32;of&#32;each&#32;input&#32;below</b>,&#32;then&#32;click&#32;<code>&#43;</code>&#32;button&#32;to&#32;get&#32;count&#32;&gt;&#61;&#32;10&#32;and&#32;see&#32;what&#32;<a href="https://guide.elm-lang.org/optimization/keyed.html">HtmlData.Keyed</a>&#32;is&#32;about</p><div><button>-</button><div>Count&#32;&#61;&#32;4</div><button>&#43;</button></div><p>Alphabetical&#32;sort:&#32;&#91;&quot;1&quot;,&quot;2&quot;,&quot;3&quot;,&quot;4&quot;&#93;</p><div><div><h2>Default</h2><ol><li><input defaultValue="1"></input>&#32;defaultValue&#32;&#61;&#32;1</li><li><input defaultValue="2"></input>&#32;defaultValue&#32;&#61;&#32;2</li><li><input defaultValue="3"></input>&#32;defaultValue&#32;&#61;&#32;3</li><li><input defaultValue="4"></input>&#32;defaultValue&#32;&#61;&#32;4</li></ol></div><div><h2>Keyed</h2><ol><li><input defaultValue="1"></input>&#32;defaultValue&#32;&#61;&#32;1</li><li><input defaultValue="2"></input>&#32;defaultValue&#32;&#61;&#32;2</li><li><input defaultValue="3"></input>&#32;defaultValue&#32;&#61;&#32;3</li><li><input defaultValue="4"></input>&#32;defaultValue&#32;&#61;&#32;4</li></ol></div><div style="clear:both"></div></div></div>
  3. toTextPlain view returns String plain text with a textual layout that mimics html; useful for text/plain emails or console output!
    1. Try entering html into the textarea below

<em>Hello</em>, world!

Hello, world!

2. Manually empty the values of each input below, then click + button to get count >= 10 and see what HtmlData.Keyed https://guide.elm-lang.org/optimization/keyed.html  is about

-

Count = 4

+

Alphabetical sort: ["1","2","3","4"]

Default

    1.  defaultValue = 1

    2.  defaultValue = 2

    3.  defaultValue = 3

    4.  defaultValue = 4

Keyed

    1.  defaultValue = 1

    2.  defaultValue = 2

    3.  defaultValue = 3

    4.  defaultValue = 4

HtmlData.Lazy

There are 17984 prime numbers between between 2 and 200000

github.com/choonkeat/explore-html-data-extra

0