mirror of
https://github.com/gorhill/uBlock.git
synced 2024-09-18 08:52:26 +02:00
performance work for pseudo-user styles code
This commit is contained in:
parent
bed2e99e66
commit
7a023077b3
@ -229,55 +229,75 @@ var platformHideNode = vAPI.hideNode,
|
|||||||
}
|
}
|
||||||
|
|
||||||
var uid,
|
var uid,
|
||||||
timerId,
|
timer,
|
||||||
observer,
|
observer,
|
||||||
changedNodes = [];
|
changedNodes = [],
|
||||||
var observerOptions = {
|
observerOptions = {
|
||||||
attributes: true,
|
attributes: true,
|
||||||
attributeFilter: [ 'style' ]
|
attributeFilter: [ 'style' ]
|
||||||
};
|
};
|
||||||
|
|
||||||
var overrideInlineStyle = function(node) {
|
// https://jsperf.com/clientheight-and-clientwidth-vs-getcomputedstyle
|
||||||
var style = window.getComputedStyle(node),
|
// Avoid getComputedStyle(), detecting whether a node is visible can be
|
||||||
display = style.getPropertyValue('display'),
|
// achieved with clientWidth/clientHeight.
|
||||||
attr = node.getAttribute('style') || '';
|
// https://gist.github.com/paulirish/5d52fb081b3570c81e3a
|
||||||
if ( node[uid] === undefined ) {
|
// Do not interleave read-from/write-to the DOM. Write-to DOM
|
||||||
node[uid] = node.hasAttribute('style') && attr;
|
// operations would cause the first read-from to be expensive, and
|
||||||
|
// interleaving means that potentially all single read-from operation
|
||||||
|
// would be expensive rather than just the 1st one.
|
||||||
|
// Benchmarking toggling off/on cosmetic filtering confirms quite an
|
||||||
|
// improvement when:
|
||||||
|
// - batching as much as possible handling of all nodes;
|
||||||
|
// - avoiding to interleave read-from/write-to operations.
|
||||||
|
// However, toggling off/on cosmetic filtering repeatedly is not
|
||||||
|
// a real use case, but this shows this will help performance
|
||||||
|
// on sites which try to use inline styles to bypass blockers.
|
||||||
|
var batchProcess = function() {
|
||||||
|
timer.clear();
|
||||||
|
var cNodes = changedNodes, i = cNodes.length,
|
||||||
|
vNodes = [], j = 0,
|
||||||
|
node;
|
||||||
|
while ( i-- ) {
|
||||||
|
node = cNodes[i];
|
||||||
|
if ( node[uid] !== undefined && node.clientHeight && node.clientWidth ) {
|
||||||
|
vNodes[j++] = node;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
if ( display !== '' && display !== 'none' ) {
|
cNodes.length = 0;
|
||||||
if ( attr !== '' ) { attr += '; '; }
|
while ( j-- ) {
|
||||||
|
node = vNodes[j];
|
||||||
|
var attr = node.getAttribute('style');
|
||||||
|
if ( !attr ) {
|
||||||
|
attr = '';
|
||||||
|
} else {
|
||||||
|
attr += '; ';
|
||||||
|
}
|
||||||
node.setAttribute('style', attr + 'display: none !important;');
|
node.setAttribute('style', attr + 'display: none !important;');
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var timerHandler = function() {
|
|
||||||
timerId = undefined;
|
|
||||||
var nodes = changedNodes,
|
|
||||||
i = nodes.length, node;
|
|
||||||
while ( i-- ) {
|
|
||||||
node = nodes[i];
|
|
||||||
if ( node[uid] !== undefined ) {
|
|
||||||
overrideInlineStyle(node);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
nodes.length = 0;
|
|
||||||
};
|
|
||||||
|
|
||||||
var observerHandler = function(mutations) {
|
var observerHandler = function(mutations) {
|
||||||
var i = mutations.length;
|
var i = mutations.length,
|
||||||
|
cNodes = changedNodes,
|
||||||
|
j = cNodes.length;
|
||||||
while ( i-- ) {
|
while ( i-- ) {
|
||||||
changedNodes.push(mutations[i].target);
|
cNodes[j++] = mutations[i].target;
|
||||||
}
|
|
||||||
if ( timerId === undefined ) {
|
|
||||||
timerId = vAPI.setTimeout(timerHandler, 1);
|
|
||||||
}
|
}
|
||||||
|
timer.start();
|
||||||
};
|
};
|
||||||
|
|
||||||
platformHideNode = function(node) {
|
platformHideNode = function(node) {
|
||||||
if ( uid === undefined ) {
|
if ( uid === undefined ) {
|
||||||
uid = vAPI.randomToken();
|
uid = vAPI.randomToken();
|
||||||
|
timer = new vAPI.SafeAnimationFrame(batchProcess);
|
||||||
}
|
}
|
||||||
overrideInlineStyle(node);
|
if ( node[uid] === undefined ) {
|
||||||
|
node[uid] = node.hasAttribute('style') && (node.getAttribute('style') || '');
|
||||||
|
}
|
||||||
|
// Performance: batch-process nodes to hide.
|
||||||
|
var cNodes = changedNodes;
|
||||||
|
cNodes[cNodes.length] = node;
|
||||||
|
timer.start();
|
||||||
if ( observer === undefined ) {
|
if ( observer === undefined ) {
|
||||||
observer = new MutationObserver(observerHandler);
|
observer = new MutationObserver(observerHandler);
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user