Opened on 09/26/2018 at 03:23:59 PM
Closed on 09/30/2018 at 08:14:28 AM
Last modified on 03/07/2019 at 08:23:28 AM
#6989 closed change (fixed)
Optimize CSS rule generation
| Reported by: | mjethani | Assignee: | mjethani |
|---|---|---|---|
| Priority: | P2 | Milestone: | |
| Module: | Core | Keywords: | |
| Cc: | Blocked By: | ||
| Blocking: | #7000 | Platform: | Unknown / Cross platform |
| Ready: | yes | Confidential: | no |
| Tester: | Unknown | Verified working: | yes |
| Review URL(s): | |||
Description (last modified by mjethani)
Background
I ran the profiler in DevTools, opened 50 tabs with example.com, and looked at the results. The extension is spending up to 20% of its time in the createStyleSheet function. This is one of the hottest hotspots right now.
After digging a little deeper, I found that most of the time is in fact spent in joining the array of selectors. We should just stop using Array.prototype.join and build the CSS rule ourselves using string concatenation. In my tests, with an alternative implementation, I was able to reduce the amount of time spent in the createStyleSheet function by approximately one-third.
What to change
Reimplement createStyleSheet without using Array.prototype.join.
Hints for testers
The change here is covered by unit tests, there should be nothing to test in the extension.
Attachments (0)
Change History (6)
comment:2 Changed on 09/26/2018 at 04:52:09 PM by abpbot
comment:3 Changed on 09/30/2018 at 08:14:28 AM by mjethani
- Description modified (diff)
- Resolution set to fixed
- Status changed from new to closed
comment:4 Changed on 09/30/2018 at 09:44:13 AM by mjethani
- Blocking 7000 added
comment:5 Changed on 02/07/2019 at 03:23:42 AM by abpbot
A commit referencing this issue has landed:
Issue 6989 - Optimize CSS rule generation
comment:6 Changed on 03/07/2019 at 08:23:28 AM by ukacar
- Verified working set
A commit referencing this issue has landed:
Issue 6989 - Optimize CSS rule generation