WHATWG HTML5 specification-compliant, fast and ready for production HTML parsing/serialization toolset for Node.
The parse5 npm package is a fast full-featured specification-compliant HTML parser for Node.js. It allows users to parse HTML documents and manipulate the resulting document tree structure. The package provides a variety of modules for parsing, serializing, and tree adaptation based on the DOM (Document Object Model) interface.
Parsing HTML
This feature allows you to parse an HTML string into a document tree that can be manipulated or queried.
const parse5 = require('parse5');
const html = '<!DOCTYPE html><html><head></head><body>Hi there!</body></html>';
const document = parse5.parse(html);Serializing Document
This feature enables you to serialize a document tree back into an HTML string.
const parse5 = require('parse5');
const document = parse5.parse('<!DOCTYPE html><html><head></head><body>Hi there!</body></html>');
const html = parse5.serialize(document);Streaming
This feature allows you to use parse5 in a streaming mode, which is useful for processing large HTML documents without loading them entirely into memory.
const parse5 = require('parse5');
const fs = require('fs');
const file = fs.createReadStream('example.html');
const parser = new parse5.SAXParser();
parser.on('text', (text) => {
console.log(text);
});
file.pipe(parser);Tree Adapters
This feature allows you to use different tree adapters to interact with the parsed document tree in a way that is compatible with other libraries or your own custom requirements.
const parse5 = require('parse5');
const htmlparser2Adapter = require('parse5-htmlparser2-tree-adapter');
const html = '<!DOCTYPE html><html><head></head><body>Hi there!</body></html>';
const document = parse5.parse(html, { treeAdapter: htmlparser2Adapter });Cheerio is a fast, flexible, and lean implementation of core jQuery designed specifically for the server. It uses a very similar syntax to jQuery, allowing for manipulation of the elements in the parsed document tree. Cheerio is generally faster than parse5 for querying documents but does not strictly adhere to the HTML5 specification.
jsdom is a pure-JavaScript implementation of many web standards, notably the WHATWG DOM and HTML Standards, for use with Node.js. It creates a DOM environment similar to that provided by web browsers, including a window object. jsdom is more feature-rich than parse5, providing a complete emulation of a web browser's environment, but it is also heavier and slower for simple parsing tasks.
htmlparser2 is a forgiving HTML and XML parser. It is fast and has a simple API, but unlike parse5, it does not strictly adhere to the HTML5 parsing specification. It is suitable for parsing non-standard or malformed HTML.
WHATWG HTML5 specification-compliant, fast and ready for production HTML parsing/serialization toolset for Node.
To build TestCafé we needed fast and ready for production HTML parser, which will parse HTML as a modern browser's parser. Existing solutions were either too slow or their output was too inaccurate. So, this is how parse5 was born.
Included tools:
$ npm install parse5
var Parser = require('parse5').Parser;
//Instantiate parser
var parser = new Parser();
//Then feed it with an HTML document
var document = parser.parse('<!DOCTYPE html><html><head></head><body>Hi there!</body></html>')
//Now let's parse HTML-snippet
var fragment = parser.parseFragment('<title>Parse5 is fucking awesome!</title><h1>42</h1>');
Check out this benchmark.
Starting benchmark. Fasten your seatbelts...
html5 (https://github.com/aredridel/html5) x 0.18 ops/sec ±5.92% (5 runs sampled)
htmlparser (https://github.com/tautologistics/node-htmlparser/) x 3.83 ops/sec ±42.43% (14 runs sampled)
htmlparser2 (https://github.com/fb55/htmlparser2) x 4.05 ops/sec ±39.27% (15 runs sampled)
parse5 (https://github.com/inikulin/parse5) x 3.04 ops/sec ±51.81% (13 runs sampled)
Fastest is htmlparser2 (https://github.com/fb55/htmlparser2),parse5 (https://github.com/inikulin/parse5)
So, parse5 is as fast as simple specification incompatible parsers and ~15-times(!) faster than the current specification compatible parser available for the node.
Provides built-in tree adapters which can be passed as an optional argument to the Parser and Serializer constructors.
Default tree format for parse5.
Quite popular htmlparser2 tree format (e.g. used in cheerio and jsdom).
Provides HTML parsing functionality.
Creates new reusable instance of the Parser. Optional treeAdapter argument specifies resulting tree format. If treeAdapter argument is not specified, default tree adapter will be used.
options object provides the parsing algorithm modifications:
Decode HTML-entities like &, , etc. Default: true. Warning: disabling this option may cause output which is not conform HTML5 specification.
Enables source code location information for the nodes. Default: false. When enabled, each node (except root node) has __location property, which contains start and end indices of the node in the source code.
Example:
var parse5 = require('parse5');
//Instantiate new parser with default tree adapter
var parser1 = new parse5.Parser();
//Instantiate new parser with htmlparser2 tree adapter
var parser2 = new parse5.Parser(parse5.TreeAdapters.htmlparser2);
Parses specified html string. Returns document node.
Example:
var document = parser.parse('<!DOCTYPE html><html><head></head><body>Hi there!</body></html>');
Parses given htmlFragment. Returns documentFragment node. Optional contextElement argument specifies context in which given htmlFragment will be parsed (consider it as setting contextElement.innerHTML property). If contextElement argument is not specified then <template> element will be used as a context and fragment will be parsed in 'forgiving' manner.
Example:
var documentFragment = parser.parseFragment('<table></table>');
//Parse html fragment in context of the parsed <table> element
var trFragment = parser.parseFragment('<tr><td>Shake it, baby</td></tr>', documentFragment.childNodes[0]);
Provides SAX-style HTML parsing functionality.
Creates new reusable instance of the SimpleApiParser. handlers argument specifies object that contains parser's event handlers. Possible events and their signatures are shown in the example.
options object provides the parsing algorithm modifications:
Decode HTML-entities like &, , etc. Default: true. Warning: disabling this option may cause output which is not conform HTML5 specification.
Enables source code location information for the tokens. Default: false. When enabled, each node handler receives location object as it's last argument. location object contains start and end indices of the token in the source code.
Example:
var parse5 = require('parse5');
var parser = new parse5.SimpleApiParser({
doctype: function(name, publicId, systemId /*, [location] */) {
//Handle doctype here
},
startTag: function(tagName, attrs, selfClosing /*, [location] */) {
//Handle start tags here
},
endTag: function(tagName /*, [location] */) {
//Handle end tags here
},
text: function(text /*, [location] */) {
//Handle texts here
},
comment: function(text /*, [location] */) {
//Handle comments here
}
});
Raises parser events for the given html.
Example:
var parse5 = require('parse5');
var parser = new parse5.SimpleApiParser({
text: function(text) {
console.log(text);
}
});
parser.parse('<body>Yo!</body>');
Provides tree-to-HTML serialization functionality.
Note: prior to v1.2.0 this class was called TreeSerializer. However, it's still accessible as parse5.TreeSerializer for backward compatibility.
Creates new reusable instance of the Serializer. Optional treeAdapter argument specifies input tree format. If treeAdapter argument is not specified, default tree adapter will be used.
options object provides the serialization algorithm modifications:
HTML-encode characters like <, >, &, etc. Default: true. Warning: disabling this option may cause output which is not conform HTML5 specification.
Example:
var parse5 = require('parse5');
//Instantiate new serializer with default tree adapter
var serializer1 = new parse5.Serializer();
//Instantiate new serializer with htmlparser2 tree adapter
var serializer2 = new parse5.Serializer(parse5.TreeAdapters.htmlparser2);
Serializes the given node. Returns HTML string.
Example:
var document = parser.parse('<!DOCTYPE html><html><head></head><body>Hi there!</body></html>');
//Serialize document
var html = serializer.serialize(document);
//Serialize <body> element content
var bodyInnerHtml = serializer.serialize(document.childNodes[0].childNodes[1]);
Test data is adopted from html5lib project. Parser is covered by more than 8000 test cases. To run tests:
$ npm test
You can create a custom tree adapter so parse5 can work with your own DOM-tree implementation. Just pass your adapter implementation to the parser's constructor as an argument:
var Parser = require('parse5').Parser;
var myTreeAdapter = {
//Adapter methods...
};
//Instantiate parser
var parser = new Parser(myTreeAdapter);
Sample implementation can be found here.
The custom tree adapter should implement all methods exposed via exports in the sample implementation.
If you have any questions, please feel free to create an issue here on github.
FAQs
HTML parser and serializer.
The npm package parse5 receives a total of 42,984,211 weekly downloads. As such, parse5 popularity was classified as popular.
We found that parse5 demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 5 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
An advanced npm supply chain attack is leveraging Ethereum smart contracts for decentralized, persistent malware control, evading traditional defenses.
Security News
Research
Attackers are impersonating Sindre Sorhus on npm with a fake 'chalk-node' package containing a malicious backdoor to compromise developers' projects.
Security News
The npm package for the LottieFiles Player web component was hit with a supply chain attack after a software engineer's npmjs credentials were compromised.