Compact style mutation (#464)

* Don't store the full style attribute change, as small mutations to single style properties result in storage of a rewrite for the full style attribute, which may be very large.

Had an example of a website using http://schillmania.com/projects/snowstorm/ where many direct style changes were happening every second across many 'snowflake' elements, with each attribute change looking like:
"style":"color: rgb(255, 255, 255); position: absolute; width: 8px; height: 8px; font-family: arial, verdana; overflow: hidden; font-weight: normal; z-index: 0; display: block; bottom: auto; opacity: 1; padding: 0px; margin: 0px; font-size: 10px; line-height: 10px; text-align: center; vertical-align: baseline; left: 242.807px; top: 85.7332px;"
even though maybe just the left/top position had been changed

* More compact storage for the much more common attribute value without an `!important` flag - saves 6 chars per style attr in the json :)

* Fix bug: attributes weren't getting removed after changes to treatment of 'style' attributes
This commit is contained in:
Eoghan Murray
2021-07-11 13:04:42 +01:00
committed by GitHub
parent 39c8ba1a24
commit 9875a3df0b
6 changed files with 114 additions and 30 deletions

View File

@@ -294,16 +294,20 @@ export type textMutation = {
value: string | null;
};
export type styleAttributeValue = {
[key:string]: [string, string] | string | false;
};
export type attributeCursor = {
node: Node;
attributes: {
[key: string]: string | null;
[key: string]: string | styleAttributeValue | null;
};
};
export type attributeMutation = {
id: number;
attributes: {
[key: string]: string | null;
[key: string]: string | styleAttributeValue | null;
};
};