Especially, for items that shouldn't load too often, like <iframe>
.
In short, incremental-dom
You can replace the entire HTML output with incremental DOM tree. (Much of the code comes from here.)
import { Parser } from 'htmlparser2'
import { elementOpen, elementClose, text } from 'incremental-dom'
import { Serialize } from 'any-serialize'
const ser = new Serialize()
export function makeIncremental (s: string): () => void {
const open = (name: string, attr: Record<string, string> = {}) => {
elementOpen(name, name + '-' + ser.hash(attr), Object.values(attr).flat())
}
const close = (name: string) => {
elementClose(name)
}
const iDOMParser = new Parser(
{
onopentag: open,
ontext: text,
onclosetag: close
},
{
decodeEntities: true,
lowerCaseAttributeNames: false,
lowerCaseTags: false,
recognizeSelfClosing: true
}
)
return () => {
iDOMParser.write(s)
}
}
About htmlparser2, it does work in web browser, but I need to install @types/node
(in devDependencies)...
The real project is here -- https://github.com/patarapolw/blogdown-cms/tree/heroku and it is
- Markdown editor that supports
- Presentation (reveal-md) editor
- Via same-origin
iframe.contentWindow
- Via same-origin
Well, reveal.js sometimes create problem for me as well. Might create my own someday.
Top comments (0)