Page MenuHomePhabricator

Replace TimedMediaHandler's use of deprecated jQuery UI with OOUI
Closed, DeclinedPublic

Description

TimedMediaHandler's use of jQuery UI adds a set of additional loads to any page that has timed media on it. This is (a) ugly and (b) expensive in terms of client time/network/CPU.

Instead, let's use OOUI's styles, which are arguably not better but are at least consistent, and don't need additional loads (as right now many, and soon enough every, page load already loads this).

Note that we are also considering dropping those parts completely as part of T100106.

Related Objects

StatusSubtypeAssignedTask
OpenNone
OpenNone
DeclinedNone
Resolved brion
Resolved brion
ResolvedTheDJ
Resolved brion
Resolved brion
ResolvedTheDJ
ResolvedTheDJ
ResolvedTheDJ
ResolvedJdforrester-WMF
Resolved brion
Resolved brion
ResolvedTheDJ
Resolved brion
ResolvedTheDJ
ResolvedTheDJ
InvalidNone
Resolvedovasileva
ResolvedLadsgroup
ResolvedQuiddity
ResolvedFeature brion
ResolvedBUG REPORTTheDJ
ResolvedKrinkle

Event Timeline

Jdforrester-WMF raised the priority of this task from to Needs Triage.
Jdforrester-WMF updated the task description. (Show Details)
Jdforrester-WMF added subscribers: Jdforrester-WMF, ori.
Restricted Application added a subscriber: Aklapper. · View Herald Transcript

although a worthy goal to use oojs-ui, i'd say cleanup TMH itself first :)

although a worthy goal to use oojs-ui, i'd say cleanup TMH itself first :)

From IRC, selected lines:

ori: that's 300kb of javascript on barack obama for the media player http://i.imgur.com/5jx7QRq.png
marktraceur: Oh no.
marktraceur: Wait, jquery UI is HOW BIG?
marktraceur: WHAT THE HELL
ori: something's wrong, right?
ori: it grew
James_F: marktraceur: We could switch to something else that's more performant, maybe?
marktraceur: Maybe.
James_F: But switching from jQuery UI to OOjs UI might be less effort for the same general pay-off.

I think "Making TMH better" is rather more epic than justifies blocking this issue.

jQUI is ~200K minified/uncompressed, OOUI is 300K, so as long as OOUI is not included on every page this will actually increase the payload. I don't think it's very significant anyway; gzip will shrink these to 10-20%, and TMH is a video player; a typical video is probably in the megabytes and will dominate traffic costs. There might be valid reasons for replacing jQUI with OOUI, but script size is not one of them, at least for the moment.

ori: that's 300kb of javascript on barack obama for the media player http://i.imgur.com/5jx7QRq.png

For posterity, the imgur image:

5jx7QRq.png (488×2 px, 112 KB)

TMH is like UploadWizard. Tinker on one end, and it breaks on the other.

This has partialy been done.

Transcode was switched to oo-ui.

All that needs left as far as it looks is the MwEmbedModules/ folder.

But also they are thinking off switching to videojs which is more modern.

One thing that can really still be 'easily' done is to replace the popup dialog for enlarging thumbed videos to OOjs UI. The Kaltura player is however fully build with jQuery UI, so not likely that it will be removed from there.

Volker_E renamed this task from Replace TimedMediaHandler's use of deprecated jQuery UI with OOjs UI to Replace TimedMediaHandler's use of deprecated jQuery UI with OOUI.Jan 18 2018, 9:42 PM
Volker_E updated the task description. (Show Details)

@TheDJ / @brion: Is it true that the video.js mode in TMH does not involve jQuery UI? Are there other parts of TMH (e.g. special pages, TimedText stuff etc.) still that use jQuery UI, or would this task be resolved after T100106?

On a Commons page with TMH in videoJS mode, jQUI is now still loaded, because:

  • jquery.ui.core.styles
    • jquery.ui.core
      • jquery.ui.button
        • jquery.ui.dialog
          • ext.gadget.AjaxQuickDelete
          • ext.gadget.Stockphoto
      • jquery.ui.draggable
        • (jquery.ui.dialog again)
      • jquery.ui.resizable
        • (jquery.ui.dialog again)

Not AFAICT pulled in by TMH at all, just the gadgets.

Since we're replacing the Kaltura player with Video.js (T100106), which apparently doesn't rely on jQueryUI, and we'll eventually be migrating from OOUI to Vue.js components anyway, can we close this task as Declined?

Since we're replacing the Kaltura player with Video.js (T100106), which apparently doesn't rely on jQueryUI, and we'll eventually be migrating from OOUI to Vue.js components anyway, can we close this task as Declined?

This will be Resolved when we finish deploying videojs, yes.

This comment was removed by Iniquity.

Mass-Declining all open tasks about the Kaltura audio/video player, as that code is no longer used and has been deleted. See T306971 for more information.