There is a whole bunch of websites which require JavaScript to present the document-like content and later on use substantial amounts of RAM and CPU for some reason. I want to create an extension which allows the user to remove scripts from page on demand or once some predefined conditions are met. Afaik there is easy way to do it and quite complex workaround is needed to achieve it.
My proof-of-concept extension works in following manner:
- clone the state of DOM of a page (including shadow DOM and changes made dynamically to stylesheets)
- strip
scripttags - enumerate present Web Components and create bootstrap code for them
- merge the above into HTML document
- set one-time webRequest listener
- reload the page
- wait for the remote to respond
- modify headers in case the charset differs from UTF-8
- capture the response and throw it away
- serve prepared HTML instead
This routine results in a pixel perfect copy of the page despite being quite CPU heavy. However an obvious and major drawback is the need to be online and to poke the server.
Alternative approach involving extension pages induces following problems:
- some sites checks cookies or referer header before serving resources such as images
- CSP …
- ~fonts are often quite reluctant to load~
- there are visual glitches which I cannot trace origin of
- zoom is easy to preserve per website basis
- HTTP cache is not used as much as it could be
- it interferes with tracking protection or other extensiosn such as uBlock (or rather the problem is it do not in this case)
Is there an easier way to achieve the effect (perfectly by doing this in place – without effectively reloading the page)? Or perspectives for an API which would allow it?