<commit_before># intraHTML
## like div.innerHTML, but doesn't suck

### Usage
`intraHTML(element, strNewInnerHTMLContent);`

### Replace the old and busted:
` main.innerHTML=myContent; ` <br />
` main.html(myContent); `

### With the fresh and shiny:
` intraHTML(main, myContent); ` <br />
` $(main).intraHTML(myContent); `

## Why use it?
It combines the user-friendliness of data-binding with the flexibility of html string generation.

Setting div.innerHTML with new content normal destroys form values, selections, scroll positions, and A.T. cursors. Sadly, generating HTML these days is incredibly fast and convenient, with everything from templates like Mustache/Handlbars/Jade, to PHP and it's cornucopia of frameworks. If one could simply generate new HTML and show it, apps would be easy to develop. With intraHTML, you can basically update your entire view all the time without the nasty side-effects. This lets any and all template systems seamlessly keep a view updated. 


### How does it work?

1. Turns existing dom branch into a JS-object virtual DOM
2. Turn the new HTML content into a virtual DOM
3. DIFF the existing and new vdom to generate a change list
4. apply the list of changes to the live DOM to update the view

If you have html that defines 1000 table rows and you change 1 row, only 1 row on the screen will be adjusted, preserving text inputs and selections on the 999 unchanged rows.


### How is intraHTML different than react, vue, deku, angular, and others?
intraHTML is less dogmatic; it's just a function that updates the DOM with a string, wherever that string might come from. There is no API, no special way of building components, no list of banned libraries or practices, no build process required, and no browser blacklist; even IE8 works with just a generic ES5 polyfill. In short, there's not much to intraHTML, which means less to get in your way, less to learn, and less to worry about.


### Is it fast?
intraHTML can easily re-render a template and re-sync the DOM at 60FPS on a modest ultrabook. DOM updates are applied at about the same rate as react. Views comprised of hundreds of elements are typically DIFFed in less than a millisecond. While a heavy-investment setup like React will likely scale better to huge interfaces (10,000+ elements), for most real-world applications, intraHTML's updates occur well-within human expectations.




<commit_msg>add demo links<commit_after># intraHTML
## like div.innerHTML, but doesn't suck

### Usage
`intraHTML(element, strNewInnerHTMLContent);`

### Replace the old and busted:
` main.innerHTML=myContent; ` <br />
` main.html(myContent); `

### With the fresh and shiny:
` intraHTML(main, myContent); ` <br />
` $(main).intraHTML(myContent); `

## Why use it?
It combines the user-friendliness of data-binding with the flexibility of html string generation.

Setting div.innerHTML with new content destroys form values, selections, scroll positions, and mode. Conversely, generating HTML these days is incredibly fast and convenient with everything from templates like Mustache/Handlbars/Jade, to PHP and it's cornucopia of frameworks. 

If one could simply generate new HTML and show it, apps would be easy to develop. Now, it's easy to do just that. With intraHTML, you can update your entire view without the nasty side-effects. Any and all template systems can seamlessly keep a view updated. 


### How does it work?

1. Turns existing dom branch into a JS-object virtual DOM
2. Turn the new HTML content into a virtual DOM
3. DIFF the existing and new vdom to generate a change list
4. apply the list of changes to the live DOM to update the view

The [infoview demo](http://danml.com/intrahtml/demos/infoview/) makes the parts and workings clear.


If you have html that defines 1000 table rows and you change 1 row, only 1 row on the screen will be adjusted, preserving text inputs and selections on the 999 unchanged rows.


### How is intraHTML different than react, vue, deku, angular, and others?
intraHTML is less dogmatic; it's just a function that updates the DOM with a string, wherever that string might come from. There is no API, no special way of building components, no list of banned libraries or practices, no build process required, and no browser blacklist; even IE8 works with just a generic ES5 polyfill. In short, there's not much to intraHTML, which means less to get in your way, less to learn, and less to worry about.


### Is it fast?
intraHTML can easily re-render a template and re-sync the DOM at 60FPS on a modest ultrabook. DOM updates are applied at about the same rate as react. Views comprised of hundreds of elements are typically DIFFed in less than a millisecond. While a heavy-investment setup like React will likely scale better to huge interfaces (10,000+ elements), for most real-world applications, intraHTML's updates occur well-within human expectations.

The [perf demo](http://danml.com/intrahtml/demos/perf/) lets you tests dynamic lists of various sizes.


### Got any demos?

* The [Github Cards Demo](http://danml.com/intrahtml/demos/githubcards/) was modeled after a react demo, but uses a lot less code.
* The [Todo Demo](http://danml.com/intrahtml/demos/todo/) is a todoMVC-ish demo that uses intraHTML for the model display
* The [Minimal Investment Demo](http://danml.com/intrahtml/demos/minimal/) uses a half-dozen lines to sync view + bundle updates



{'fraction_non_alphanumeric': 0.06537396121883657, 'fraction_numerical': 0.008125577100646353, 'mean_word_length': 4.421421421421422, 'pattern_counts': {'":': 0, '<': 7, '<?xml version=': 0, '>': 7, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1286345', 'n_tokens_mistral': 1500, 'n_tokens_neox': 1387, 'n_words': 800}