As part of the desktop improvements project we spent time investing in the core code that powers skins. With support from volunteers (the majority of this support coming from the prolific @Ammarpad), we identified code patterns and made changes to the MediaWiki-Core-Skin-Architecture to retroactively define a data layer API for generating a skin.

Once this was in place, we updated the legacy MediaWiki skins Monobook, Modern, CologneBlue to use Mustache to bring them in line with how Vector and Minerva were built.

The rationale for doing this was as follows:

1. We wanted to centralize code into core, and standardize markup, to make it easier to roll out changes to all skins. Often developers found ourselves updating every skin every time we wanted to make a small change or forced to use specific classes to markup elements (e.g. T248137, T253938).
2. We wanted to move away from server-side technologies to client-side technologies to play better to the strengths of frontend engineers and designers who worked on skins.
3. Since many of these skins do not see active development, we wanted to support them better by reducing lines of code
4. Many of the skins didn't support certain extensions because they used different code (for example certain skins didn't run hooks that were used by certain features) e.g. 6ce3ce1acb68f0a3fdf1bd8824f6d0717bffa320 T259400
5. Stop supporting features in core that were never widely adopted e.g. T97892

This process reduced 106,078 lines of code to 85,310 lines of code - a 20% decrease.
Before the change around 45% of skin code was PHP. After the change PHP only accounted for 15% of the code.

It would be great to in the future migrate Timeless too, but Timeless using the legacy skin platform does help keep us accountable for ensuring we continue to support skins built on this platform.

Methodology for result

To measure code makeup we can run github-linguist before and after the change.

Monobook

Before:

46.53%  22713      Less
36.83%  17981      PHP
16.53%  8071       JavaScript
0.10%   50         CSS
Lines of code: 48815

After change (abe94aa4082dbc4f8b9060528a1b4fea2d0af0f1)

59.28%  22831      Less
20.96%  8071       JavaScript
11.67%  4496       Mustache
7.96%   3066       PHP
0.13%   50         CSS
Lines of code: 38514

Modern

Before:

52.25%  13752      CSS
40.99%  10790      PHP
4.16%   1094       Less
2.61%   686        JavaScript
Lines of code: 26322

After change (c74d67950b6de2bafd9e3b1e05e601caaa7d9452)

68.87%  13877      CSS
18.22%  3672       Mustache
5.43%   1094       Less
4.07%   821        PHP
3.40%   686        JavaScript
Lines of code: 20150

Cologne Blue

Before:

62.00%  19183      PHP
34.82%  10773      CSS
2.22%   686        JavaScript
0.97%   299        Less
Lines of code: 30941

After change (bf06742467f6c6c2bb42367f2e073eb26ed5d495)

40.40%  10765      CSS
31.87%  8491       PHP
24.04%  6405       Mustache
2.57%   686        JavaScript
1.12%   299        Less
Lines of code: 26646

PHP

The total number of lines of PHP before the change: 47954
After the change: 12378 lines of PHP
(This is a 74% decrease in lines of code)