WordPress.org

Make WordPress Core

Opened 13 months ago

Last modified 13 months ago

#45068 new defect (bug)

Specific CSS attribute slows down customizer panels on Chrome and Opera

Reported by: Themezly Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version: 4.9.8
Component: Customize Keywords: reporter-feedback
Focuses: Cc:
PR Number:

Description

CSS class declared like this

[class*='contains'] [class*='sub_contains']{...}

kills the panel switch and you start thinking that is the amount of options

Here is video showing the issue
https://monosnap.com/file/hrdFWrFqizkx1Cxtra1TIzHdckxuSo

I was able to isolate it to this specific declaration

[class*='contains'] [class*='sub_contains']{...}

if you use this only

[class*='contains']{...}
[class*='contains'] .something {...}

or even a no space

[class*='contains'][class*='sub_contains']{...}

everything works fine.

Change History (5)

#1 @mukesh27
13 months ago

  • Keywords reporter-feedback added

@Themezly, Can you please share more details as i try to find this [class*='contains'] [class*='sub_contains']{...} class in wp-admin and wp-includes folder but can't fine it.

This Trac is used for enhancements and bug reporting for the WordPress core software, not for individual support questions.

Last edited 13 months ago by mukesh27 (previous) (diff)

#2 follow-up: @Themezly
13 months ago

@mukesh27 class is not present in WP, this is related to anyone's custom CSS that is included in the page itself.
This is not individual support but it is more likely browser related than WP but it affects WP very much so. There were numerous reports of users complaining about the panels speed and how on Firefox customizer is faster. This little nugget plays huge role on rendering in Chrome. You can close the issue if you like but users should be aware of possible performance issues if .class [ANYTHING] is used within their CSS.

Last edited 13 months ago by Themezly (previous) (diff)

#3 in reply to: ↑ 2 @mukesh27
13 months ago

You mean if we use css like you have suggested then it will load customize faster?

Replying to Themezly:

@mukesh27 class is not present in WP, this is related to anyone's custom CSS that is included in the page itself.
This is not individual support but it is more likely browser related than WP but it affects WP very much so. There were numerous reports of users complaining about the panels speed and how on Firefox customizer is faster. This little nugget plays huge role on rendering in Chrome. You can close the issue if you like but users should be aware of possible performance issues if .class [ANYTHING] is used within their CSS.

#4 @mukesh27
13 months ago

  • Keywords dev-feedback added; reporter-feedback removed

#5 @Themezly
13 months ago

  • Keywords reporter-feedback added; dev-feedback removed

No it will slow it down, here is better explanation

https://github.com/ThemeFuse/Unyson/issues/3620

basically if you add space after a class and use specific attribute lookup like

.class [data-something]

it kills the rendering because of that very little space in between the class and specific attribute

Note: See TracTickets for help on using tickets.