Add a common class for hiding things from non-javascript displays
Open, Needs TriagePublic
Actions

Assigned To

None

Authored By

	DannyS712
	Sep 18 2021, 6:38 AM

Description

I recently found that there are a number of ResourceLoader modules registered, both in core and extensions, that only serve to hide specific elements when the client-nojs class is present. Instead of needing to use multiple modules for this, I suggest introducing a standard class, eg mw-nojs-hidden, that has the styles

.client-nojs .mw-nojs-hidden {
	display: none;
}

always applied, so that we don't need multiple modules for this.

Examples:

core - mediawiki.checkboxtoggle.styles module just hides .mw-checkbox-toggle-controls from non-js views
UniversalLanguageSelector - ext.uls.preferencespage module just hides .uls-preferences-link-wrapper from non-js views
RevisionSlider - ext.RevisionSlider.noscript module just hides .mw-revslider-container from non-js views
PerformanceInspector (not deployed) - ext.PerformanceInspector.noscript module just hides #t-performanceinspector from non-js views

Event Timeline

DannyS712 created this task.Sep 18 2021, 6:38 AM

Restricted Application added projects: Performance-Team, User-DannyS712. · View Herald TranscriptSep 18 2021, 6:38 AM

Restricted Application added a subscriber: Aklapper. · View Herald Transcript

DannyS712 moved this task from Unsorted to Reports on the User-DannyS712 board.Sep 18 2021, 6:38 AM

DannyS712 updated the task description. (Show Details)Sep 18 2021, 6:41 AM

Peachey88 subscribed.Sep 19 2021, 8:42 AM

We're generally moving away from centralised utility classes like this. There are number of downsides to them, including:

Hard discover which ones exist.
Hard to discover where they are defined, when they are loaded and when not (and why not when not). For example, can a skin decide not to load them?
Performance cost, as these utilities tend to become an append-only file, and unused on most pages.

Centralising this rule does not benefit end-users or developers, I think, as it does not abstract or defer certain knowledge or expertise. There is nothing to maintain here, and it is trivial to define locally as needed.

I would also say that based on past experience with on-wiki use of a similar utility class, that I believe absence of this provides just the right small amount of friction to encourage developers to think whether they really want to just hide or split interfaces completely vs a single interface that is more graceful or progressive in nature.

Untagging from ResourceLoader as this is not a bug or feature request for the loader framework.

Krinkle moved this task from Limbo to Watching on the Performance-Team (Radar) board.Sep 20 2021, 5:19 AM

In T291318#7364477, @Krinkle wrote:

We're generally moving away from centralised utility classes like this. There are number of downsides to them, including:

Hard discover which ones exist.

Hard to discover where they are defined, when they are loaded and when not (and why not when not). For example, can a skin decide not to load them?

Performance cost, as these utilities tend to become an append-only file, and unused on most pages.

Centralising this rule does not benefit end-users or developers, I think, as it does not abstract or defer certain knowledge or expertise. There is nothing to maintain here, and it is trivial to define locally as needed.

I would also say that based on past experience with on-wiki use of a similar utility class, that I believe absence of this provides just the right small amount of friction to encourage developers to think whether they really want to just hide or split interfaces completely vs a single interface that is more graceful or progressive in nature.

Even if we don't add a style that is always loaded, what about replacing mediawiki.checkboxtoggle.styles which such a utility module, so that the others can be replaced with just loading that?

Krinkle removed a project: Performance-Team (Radar).Aug 18 2023, 8:13 PM

Add a common class for hiding things from non-javascript displaysOpen, Needs TriagePublicActions

Description

Event Timeline

Add a common class for hiding things from non-javascript displays
Open, Needs TriagePublic
Actions