HTML entity encoding: when to use &, <, and Unicode escapes
Always entity-encode user-supplied text in HTML. Let your framework do it automatically. Only use named/numeric entities for literal characters you're writing yourself in static HTML. For emoji and non-ASCII text, use UTF-8 directly rather than numeric entities.
HTML entity encoding replaces characters that have special meaning in HTML with named or numeric entities: < becomes <, > becomes >, & becomes &, and double-quote becomes ". This is a security requirement, not a style choice. Without it, user-supplied text containing <script> tags will execute in the browser.
By TechCompare · Updated
How this is calculated
The five characters that must always be entity-encoded in HTML text content are ampersand, less-than, greater-than, single-quote, and double-quote. Modern frameworks (React, Vue, Svelte) do this automatically when you use their templating syntax. The risk surfaces when you use dangerouslySetInnerHTML, innerHTML in vanilla JS, or server-side template engines that don't auto-escape. For UTF-8 characters beyond ASCII, you can use them directly in HTML source (no entity needed) as long as the page declares <meta charset='utf-8'>. Numeric entities like 😀 (😀) are a fallback for environments where the source file encoding is uncertain.
Verdict
Five characters gate the XSS surface: ampersand, less-than, greater-than, single-quote, and double-quote. React, Vue, and Svelte handle the encodings automatically through their templating syntax, so the risk only surfaces with dangerouslySetInnerHTML, raw innerHTML, or non-escaping server engines. For non-ASCII characters including emoji, declare <meta charset='utf-8'> and ship them directly instead of leaning on numeric entities like 😀.