GoogleChrome / GoogleChrome/lighthouse
Consider reducing the weight of comment nodes and adjacent text nodes in excessive DOM nodes warning
- Dominant language
- JavaScript
- Stars
- 30.8k
- Forks
- 9.8k
- Avg merge
- 1d 14h
- Merged PRs (30d)
- 20
Description
Some HTML rendering systems use comments to separate static and dynamic parts of HTML. For example, in Lit, the template:
```typescript
html`
Hello, ${this.name}!
````
Will render as the HTML:
```html
TextNode(Hello, )
TextNode(World)
TextNode(!)
```
Or in the latest proposed API for the [DOM Parts standard](https://github.com/WICG/webcomponents/issues/990) a template system would render the HTML:
```html
Hello World!
```
We could walk the DOM before rendering a template and remove the comment nodes and in some cases merge adjacent text nodes in order to get a better Lighthouse score, but in benchmarking we've found that comment nodes are very cheap, and that it's generally slower to do so.
While I do appreciate that each DOM node does have a memory cost, it seems like the predominant cost is in style calculation, layout, and paint, and on those metrics comments and adjacent text nodes are far cheaper than an element.
Contributor guide
Assessment
This issue has not been assessed yet.