selderee - npm Package Compare versions
Comparing version 0.5.0 to 0.6.0
| # Changelog | ||
| ## Version 0.6.0 | ||
| * Give priority to more common attribute values (Previously the first matching simple selector was taken instead); | ||
| * Repeated simple selectors should not affect the tree balance and should not produce extra tree nodes (But they affect the specificity). | ||
| ## Version 0.5.0 | ||
@@ -4,0 +9,0 @@ |
| { | ||
| "name": "selderee", | ||
| "version": "0.5.0", | ||
| "version": "0.6.0", | ||
| "description": "Selectors decision tree - choose matching selectors, fast", | ||
@@ -5,0 +5,0 @@ "keywords": [ |
@@ -16,5 +16,5 @@ # selderee | ||
| The naive approach is to walk through the DOM and test each and every selector against each Element. This means `n * m` complexity. | ||
| The naive approach is to walk through the DOM and test each and every selector against each Element. This means *O(n\*m)* complexity. | ||
| It is pretty clear though that if we have selectors that have something in common then we can reduce the number of checks. | ||
| It is pretty clear though that if we have selectors that share something in common then we can reduce the number of checks. | ||
@@ -47,2 +47,3 @@ The main `selderee` package offers the tree structure. Working decision functions for specific DOM implementations are built via plugins. | ||
| | [selderee](https://www.npmjs.com/package/selderee) | [](https://www.npmjs.com/package/selderee) | [/packages/selderee](https://github.com/mxxii/selderee/tree/main/packages/selderee/) | [changelog](https://github.com/mxxii/selderee/blob/main/packages/selderee/CHANGELOG.md) | | ||
| | [@selderee/plugin-htmlparser2](https://www.npmjs.com/package/@selderee/plugin-htmlparser2) | [](https://www.npmjs.com/package/@selderee/plugin-htmlparser2) | [/packages/plugin-htmlparser2](https://github.com/mxxii/selderee/tree/main/packages/plugin-htmlparser2/) | [changelog](https://github.com/mxxii/selderee/blob/main/packages/plugin-htmlparser2/CHANGELOG.md) | | ||
@@ -53,3 +54,3 @@ | ||
| ```shell | ||
| > npm i selderee | ||
| > npm i selderee @selderee/plugin-htmlparser2 | ||
| ``` | ||
@@ -66,12 +67,15 @@ | ||
| ```js | ||
| const htmlparser2 = require('htmlparser2'); | ||
| const util = require('util'); | ||
| const { DecisionTree, Treeify } = require('selderee'); | ||
| const { hp2Builder } = require('@selderee/plugin-htmlparser2'); | ||
| // Object can also be used if there are no repeating selectors. | ||
| const selectorValuePairs = [ | ||
| ['div', 'A'], | ||
| ['div.foo[bar]', 'B'], | ||
| ['p > div', 'C'], | ||
| ['p.foo', 'D'], | ||
| ['p > div.foo', 'E'], | ||
| ['div[class~=foo]', 'F'], | ||
| ['p', 'A'], | ||
| ['p.foo[bar]', 'B'], | ||
| ['p[class~=foo]', 'C'], | ||
| ['div.foo', 'D'], | ||
| ['div > p.foo', 'E'], | ||
| ['div > p', 'F'], | ||
| ['#baz', 'G'] | ||
@@ -86,4 +90,21 @@ ]; | ||
| const prettyTree = selectorsDecisionTree.build(Treeify.treeify); | ||
| console.log(prettyTree); | ||
| console.log(prettyTree); | ||
| const html = /*html*/`<html><body> | ||
| <div><p class="foo qux">second</p></div> | ||
| </body></html>`; | ||
| const dom = htmlparser2.parseDocument(html); | ||
| const element = dom.children[0].children[0].children[1].children[0]; | ||
| // `hp2Builder` produces a picker that can pick values | ||
| // from the selectors tree. | ||
| const picker = selectorsDecisionTree.build(hp2Builder); | ||
| // Get all matches | ||
| const allMatches = picker.pickAll(element); | ||
| console.log(util.inspect(allMatches, { breakLength: 50, depth: null })); | ||
| // or get the value from the most specific match. | ||
| const bestMatch = picker.pick1(element); | ||
| console.log(`Best matched value: ${bestMatch}`); | ||
| ``` | ||
@@ -96,3 +117,3 @@ | ||
| ├─◻ Tag name | ||
| │ ╟─◇ = div | ||
| │ ╟─◇ = p | ||
| │ ║ ┠─▣ Attr value: class | ||
@@ -102,6 +123,6 @@ │ ║ ┃ ╙─◈ ~= "foo" | ||
| │ ║ ┃ ┃ ┖─◁ #1 [0,2,1] B | ||
| │ ║ ┃ ┠─◁ #5 [0,1,1] F | ||
| │ ║ ┃ ┠─◁ #2 [0,1,1] C | ||
| │ ║ ┃ ┖─◉ Push element: > | ||
| │ ║ ┃ └─◻ Tag name | ||
| │ ║ ┃ ╙─◇ = p | ||
| │ ║ ┃ ╙─◇ = div | ||
| │ ║ ┃ ┖─◁ #4 [0,1,2] E | ||
@@ -111,5 +132,5 @@ │ ║ ┠─◁ #0 [0,0,1] A | ||
| │ ║ └─◻ Tag name | ||
| │ ║ ╙─◇ = p | ||
| │ ║ ┖─◁ #2 [0,0,2] C | ||
| │ ╙─◇ = p | ||
| │ ║ ╙─◇ = div | ||
| │ ║ ┖─◁ #5 [0,0,2] F | ||
| │ ╙─◇ = div | ||
| │ ┖─▣ Attr value: class | ||
@@ -121,2 +142,7 @@ │ ╙─◈ ~= "foo" | ||
| ┖─◁ #6 [1,0,0] G | ||
| [ { index: 2, value: 'C', specificity: [ 0, 1, 1 ] }, | ||
| { index: 4, value: 'E', specificity: [ 0, 1, 2 ] }, | ||
| { index: 0, value: 'A', specificity: [ 0, 0, 1 ] }, | ||
| { index: 5, value: 'F', specificity: [ 0, 0, 2 ] } ] | ||
| Best matched value: E | ||
| ``` | ||
@@ -123,0 +149,0 @@ |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by9.3%
50140
- Lines of code
- increased by6.55%
1269
- Number of lines in readme file
- increased by22.03%
144
No dependency changes