Increase SELECTOR_GROUP_SIZE used by addElemHideSelectors

[kzar]

Background

The addElemHideSelectors function inside the include.preload.js content script inserts element hiding selectors into the stylesheet. Historically browsers had issue with adding too many selectors at once and so we inserted just 20 at a time. These days addElemHideSelectors is a performance pain point #4036 and it is likely modern browsers allow many rules to be inserted at a time.

What to change

Investigate how many rules can be inserted at a time (or how long the overall length of an inserted selector can be). As far as possible test this in all supported browsers. Once a safe number (or length) has been decided increase the SELECTOR_GROUP_SIZE constant.

Hints for testers

Ensure element hiding still works for all supported platforms. This change is unlikely to cause problems but we should still test it. Most importantly test old supported versions of Chrome and Safari.

[sebastian]

For reference, as discussed on IRC, Wladimir experimented with different number of selectors and couldn't reproduce any limitation on Chrome but believes that it will be at 1M selectors. On Safari, the limit seems to be 8192 selectors, but some selectors might be counted as multiple selectors.

So I suggest to insert selectors in chunks of 100 on Safari, and all selectors in one chunk on other platforms. If we should ever reach 1M selectors the browser will explode for most users anyway.

[kzar]

We found that in practice Chrome had an issue when the limit was more than around 6200. We decided therefore to have a limit of 200 for all browsers for now.

[abpbot]

A commit referencing this issue has landed:
​https://hg.adblockplus.org/adblockpluschrome/rev/0b402b4e978a