Hacker Newsnew | past | comments | ask | show | jobs | submitlogin

> A js programmer can get around it by setting up a ref and then using the reference to set innerHTML without the word dangerously appearing.

If DOM nodes during the next render differ from what react-dom expects (i.e. the DOM nodes from the previous render), then react-dom may throw a DOMException. Mutating innerHTML via a ref may violate React's invariants, and the library correctly throws an error when programmers, browser extensions, etc. mutate the DOM such that a node's parent unexpectedly changes.

There are workarounds[1] to mutate DOM nodes managed by React and avoid DOMExceptions, but I haven't worked on a codebase where anything like this was necessary.

[1] https://github.com/facebook/react/issues/11538#issuecomment-...



The reference is used to operate on the subtree when wrapping libraries like CodeMirror https://github.com/uiwjs/react-codemirror/blob/master/core/s... React leaves it alone if the children doesn't change.

innerHTML is useful when there is a trusted HTML source, which is becoming more popular with stuff like HTMX and FastHTML.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: