Page MenuHomePhabricator

Switch existing wikis from high density logos to SVG
Open, LowPublic


Now that mediawiki supports svg with png fallback for logo's[1], we should use svg over high density logo's.


to switch, it's as easy as doing

$wgLogo = 'png_image', (optional)

$wgLogoHD = [
 'svg' => 'svg_image',

or for mw-configuation

'wgLogo' => [
	'enwiki' => '.png',

'wgLogoHD' => [
	'enwiki' => [ 'svg' => '.svg' ],

before deleting the 1.5 and 2.x images wait a couple of days.

Event Timeline

Paladox created this task.Oct 24 2017, 7:15 PM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptOct 24 2017, 7:15 PM
Paladox updated the task description. (Show Details)Oct 24 2017, 7:19 PM
Urbanecm added a subscriber: Urbanecm.

IMHO Wikimedia-Site-requests is more relevant than MediaWiki-Configuration. Feel free to revert if you disagree @Paladox or everyone else.

I'm interested in this task, putting it onto my radar.

Urbanecm moved this task from Backlog to Later on the User-Urbanecm board.Dec 3 2017, 5:06 PM
Reedy updated the task description. (Show Details)Dec 3 2017, 5:07 PM
Reedy added a subscriber: Reedy.

I would suggest waiting a couple of weeks (possibly even a month) before deleting anything

Paladox updated the task description. (Show Details)Dec 3 2017, 5:13 PM
tomasz renamed this task from Switch existing wiki's from high density logo's to svg to Switch existing wikis from high density logos to SVG.Dec 4 2017, 3:37 PM

I'm going to convert all the wikis without deleting HD logos.

Urbanecm triaged this task as Low priority.Dec 22 2017, 11:41 AM
Urbanecm moved this task from Later to Working on on the User-Urbanecm board.Dec 22 2017, 12:12 PM
Fito added a subscriber: Fito.Dec 22 2017, 12:20 PM

Change 399805 had a related patch set uploaded (by Urbanecm; owner: Urbanecm):
[operations/mediawiki-config@master] Switch from $wgLogoHD to direct using of a SVG

I've just uploaded a patch that uploads bunch of SVGs from Commons (named File:Wikipedia-logo-v2-LANGCODE.svg). I didn't checked they match the PNGs.

I've also changed the IS.php file to match the new syntax.

This commit is for Wikipedias only.

Also, some projects may disappeard from the $wgLogo section, I've based the section on wikipedia.dblist (manually deleted arbcom wikis from that dblist).

Also, I didn't updated $wgLogoHD, will amend that commit later.

Reviews are welcomed.

Martin Urbanec

Wiki13 added a subscriber: Wiki13.Dec 22 2017, 1:30 PM

Ad my above comment: I've removed all Wikipedia entries from $wgLogoHD in the commit linked above.

Urbanecm added a project: User-notice.EditedDec 26 2017, 5:01 PM

This should be announced in tech news.

For managers of User-notice: All Wikipedias should start to use SVGs as HD logos on January 2nd. Other families will come later (nobody knows when yet).

Change 399805 merged by jenkins-bot:
[operations/mediawiki-config@master] Switch Wikipedias from $wgLogoHD to direct using of a SVG

Mentioned in SAL (#wikimedia-operations) [2018-01-02T14:32:36Z] <zfilipin@tin> Synchronized static/images/project-logos/: SWAT: [[gerrit:399805|Switch Wikipedias from $wgLogoHD to direct using of a SVG (T178942)]] (duration: 01m 59s)

Change was reverted. Something very bad is happening here, 5000 errors/minute.

Notice: Array to string conversion in /srv/mediawiki/php-1.31.0-wmf.12/includes/skins/Skin.php on line 937
Warning: strpos() expects parameter 1 to be string, array given in /srv/mediawiki/php-1.31.0-wmf.12/includes/OutputPage.php on line 3800

Mentioned in SAL (#wikimedia-operations) [2018-01-02T14:41:17Z] <zfilipin@tin> Synchronized wmf-config/InitialiseSettings.php: SWAT: [[gerrit:401509|Revert "Switch Wikipedias from $wgLogoHD to direct using of a SVG" (T178942)]] (duration: 00m 51s)

Mentioned in SAL (#wikimedia-operations) [2018-01-02T14:42:40Z] <zfilipin@tin> Synchronized static/images/project-logos/: SWAT: [[gerrit:401509|Revert "Switch Wikipedias from $wgLogoHD to direct using of a SVG" (T178942)]] (duration: 00m 51s)

Paladox updated the task description. (Show Details)Jan 2 2018, 2:51 PM

Updated description with the correct configuration now. Sorry about that. Tested the correct configuration locally and i doint get that error now.

Change 401523 had a related patch set uploaded (by Urbanecm; owner: Urbanecm):
[operations/mediawiki-config@master] Switch Wikipedias from $wgLogoHD to direct using of a SVG

Krinkle added a project: Performance-Team.EditedJan 2 2018, 6:58 PM
Krinkle added a subscriber: Krinkle.

TL;DR: SVGs can be very detailed, which can make them more expensive to download and render than PNGs (site performance) and can also cause rendering problems in browsers that support SVGs but don't have very good renderings (usability).

I'm blocking this on site performance and usability grounds until confirmed otherwise. While SVGs are nice in many ways, they are not by-definition better than PNGs for the purpose of rendering as fixed-size image on a web page.

The proposed configuration (SVG) does not render better than PNGs for the vast majority of use cases (any user reading the page at normal zoom level on a device with a pixel ratio of 1x, 2x or in-between).

Using an SVG would in theory make it effortless to render ideal-resolution images on devices with even higher pixel-densities, such as 3x of 4x, without us needing to create separate PNGs for those.

However, we should not do this technically-appealing change (saving future maintenance work) at the cost of site performance or usability, so we need to verify the following:

  • Do all supported browsers render these complex SVGs without issue? We have considered serving SVGs of graphs in articles instead of images in the past, and often decided not to. Because of inconsistent or incorrect renderings in some browsers. SVG renderings in browsers varied quite a lot.
  • Is the SVG smaller in file size than the current PNGs?

I haven't checked, but for the most part these SVGs from Wikimedia Commons are the original files used as reference material for designers. They are not optimised for web rendering or small-scale rendering (less than 200x200px) where most detail would be invisible anyway.

We should consider and verify this cost first. For example, we might need to generate lower-detail SVGs, or consider serving them only for densities above 3x or above 2x, depending on where the file-size benefit starts making sense.

@Jdrewniak had some insights into using SVGs for logos on Wikimedia-Portals.

As stated on the patch, please also take into account when adding SVGs into production environments.

What @Krinkle said. On the page, we converted the logos to SVG except for the Wikipedia logo and the Wikinews logo. These SVG's are just too big and complex to serve over the wire. The Wikipedia logo weighs in at 169kb (I'll give it 70kb gzipped & svgo'd), whereas the raster version is about 30kb.

Imarlier moved this task from Inbox to Radar on the Performance-Team board.Jan 8 2018, 9:14 PM
Imarlier edited projects, added Performance-Team (Radar); removed Performance-Team.
Krinkle moved this task from Watching to Perf issue on the Performance-Team (Radar) board.

Change 401523 abandoned by Urbanecm:
Switch Wikipedias from $wgLogoHD to direct using of a SVG

See code reviews and the task

Urbanecm removed Urbanecm as the assignee of this task.Feb 28 2018, 6:55 PM
Urbanecm removed a project: User-Urbanecm.
Viztor added a subscriber: Viztor.Wed, Aug 7, 1:08 AM

Is it possible to request thumb-nailed version of the svg logos? This could remove the performance overhead and make it easy to update logos, instead of making different sized png and optimize them manually, this could be done in a deployment script.