The problem is that the JS and CSS code is included in Widget:CodeSelect which duplicates and executes the code many times. The obvious solution would be to place the CSS and JS codes in external files.

Could you do that please with mediawiki?

I split the code in 3 files and made use of the client-(no)js css class. The codeselect.js has to be loaded after jQuery because it is used do determine when the DOM is ready.

codeselect.css653 BDownload

(<link rel="stylesheet" href="/path/to/codeselect.css" /> in wiki header)

codeselect.js567 BDownload

(<script src="/path/to/codeselect.js"></script> after jQuery)

codeselect.html493 BDownload

(content of Widget:CodeSelect)

In MediaWiki custom css and js can be added as explained here:
https://www.mediawiki.org/wiki/Manual:Interface/Stylesheets
https://www.mediawiki.org/wiki/Manual:Interface/JavaScript

Append codeselect.css to:
https://www.whonix.org/wiki/MediaWiki:Common.css

And append codeselect.js to:
https://www.whonix.org/wiki/MediaWiki:Common.js

Patrick assigned this task to Lobster.Jul 3 2016, 3:20 PM

Awesome!

with CodeSelect - https://www.whonix.org/w/index.php?title=Using_Tunnels_with_Whonix&oldid=18784 - https://gtmetrix.com/reports/www.whonix.org/jizvabJd - 3,0 s

Down from 80,3 s to 3,0 s. Ignoring the measurement inaccuracy, it is safe to say, that the new CodeSelect is as fast as without CodeSelect. In other words, the CodeSelect slow down bug is fixed!

I missed some new bugs... With javascript disabled now it got worse.

it shows a defunct select code button
it duplicates the contents (it now shows the <pre></pre> box as well as the javascript box which is much too small... Could the javascript box be hidden if javascript is disabled?)

Could you fix that please?

Somehow the styles from https://www.whonix.org/wiki/MediaWiki:Common.css don't get loaded, which would hide the select code button and the textarea

It seems like the current skin (Strapping) is not using these MediaWiki styles, but it should work by modifying the screen.css and theme.css as explained here: https://github.com/OSAS/strapping-mediawiki/#themecss

https://github.com/OSAS/strapping-mediawiki/blob/master/screen.css

In the screen.css file, uncomment the theme.css import.

How do I do that?

Oh, sorry, the github page seems to be incorrect, theme.css gets loaded directly (at least in our case):

<link rel="stylesheet" href="/w/skins/strapping/theme.css?303" media="screen" />

So inserting the codeselect.css into the theme.css should be enough.

This works. Awesome!

	F37700: codeselect.html
	Jul 3 2016, 1:57 PM

	F37699: codeselect.css
	Jul 3 2016, 1:57 PM

	F37701: codeselect.js
	Jul 3 2016, 1:57 PM

CodeSelect template / widget unusably slow on big pagesClosed, ResolvedPublicActions

Description

Details

Related Objects

Event Timeline

CodeSelect template / widget unusably slow on big pages
Closed, ResolvedPublic
Actions