@happy-dom/server-rendering v2.49.2
:warning: This package is deprecated. Happy DOM now supports Declarative Shadow DOM which can be used for server-side rendering of web components instead. :warning:
About
Happy DOM is a JavaScript implementation of a web browser without its graphical user interface. It includes many web standards from WHATWG DOM and HTML.
The goal of Happy DOM is to emulate enough of a web browser to be useful for testing, scraping web sites and server-side rendering.
Happy DOM focuses heavily on performance and can be used as an alternative to JSDOM.
This package makes it easier to setup servering side rendering of web components by handling the setup of the Node VM Context for you.
DOM Features
Custom Elements (Web Components)
Shadow Root (Shadow DOM)
Declarative Shadow DOM
Mutation Observer
Tree Walker
Fetch
And much more..
Works With
Installation
npm install @happy-dom/server-rendering
Usage
import { HappyDOMContext } from '@happy-dom/server-rendering';
import { Script } from 'vm';
const context = new HappyDOMContext();
const result = await context.render({
url: 'http://localhost:8080',
evaluateScripts: true,
html: `
<html>
<head>
<title>Test page</title>
</head>
<body>
<div class="container">
<!–– Content will be added here -->
</div>
</body>
</html>
`,
// Optional scripts
scripts: [
new Script(`
const element = document.createElement('div');
const container = document.querySelector('.container');
element.innerHTML = 'Test';
container.appendChild(element);
`)
],
// Optional custom element settings
customElements: {
// Converts custom-elements to normal elements
openShadowRoots: true,
// Extracts CSS from shadow roots
extractCSS: true,
// Scopes extracted CSS
scopeCSS: true,
// Adds CSS to head
addCSSToHead: true
}
});
// Outputs: <html><head><title>Test page</title></head><body><div class="container"><div>Test</div></div></body></html>
console.log(result);
Known Issues
The functionality of CSS scoping has not been completed, so you may encounter some problem where CSS is not scoped correctly.
Performance
Operation | JSDOM | Happy DOM |
---|---|---|
Import / Require | 333 ms | 45 ms |
Parse HTML | 256 ms | 26 ms |
Serialize HTML | 65 ms | 8 ms |
Render custom element | 214 ms | 19 ms |
querySelectorAll('tagname') | 4.9 ms | 0.7 ms |
querySelectorAll('.class') | 6.4 ms | 3.7 ms |
querySelectorAll('attribute') | 4.0 ms | 1.7 ms |
querySelectorAll('class~="name"') | 5.5 ms | 2.9 ms |
querySelectorAll(':nth-child(2n+1)') | 10.4 ms | 3.8 ms |
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago