Optimize HTML-documents.
Closed, WontfixPublic

Description

TL;DR: Optimization is needed

Hi there! It’s my first task here!

Pokeru loads very slowly. I suppose, other ShoutWikis too. HTML files need optimization.

I created a page that has only few words in it, opened HTML and started to search problems. Lots of text.

<!DOCTYPE html>
<html lang="ru" dir="ltr" class="client-nojs">
<head>
<meta charset="UTF-8" />
<title>Участник:Bouncepaw/TEST9 — Покеру</title>

dir="ltr". Why is it specified?

<script>document.documentElement.className = document.documentElement.className.replace( /(^|\s)client-nojs(\s|$)/, "$1client-js$2" );</script>
<script>window.RLQ = window.RLQ || []; window.RLQ.push( function () {
mw.config.set({"wgCanonicalNamespace":"User","wgCanonicalSpecialPageName":!1,"wgNamespaceNumber":2,"wgPageName":"Участник:Bouncepaw/TEST9","wgTitle":"Bouncepaw/TEST9","wgCurRevisionId":1665,"wgRevisionId":1665,"wgArticleId":1015,"wgIsArticle":!0,"wgIsRedirect":!1,"wgAction":"view","wgUserName":"Bouncepaw","wgUserGroups":["bureaucrat","steward","sysop","*","user","autoconfirmed","emailconfirmed"],"wgCategories":[],"wgBreakFrames":!1,"wgPageContentLanguage":"ru","wgPageContentModel":"wikitext","wgSeparatorTransformTable":[",\t."," \t,"],"wgDigitTransformTable":["",""],"wgDefaultDateFormat":"dmy","wgMonthNames":["","январь","февраль","март","апрель","май","июнь","июль","август","сентябрь","октябрь","ноябрь","декабрь"],"wgMonthNamesShort":["","янв","фев","мар","апр","май","июн","июл","авг","сен","окт","ноя","дек"],"wgRelevantPageName":
"Участник:Bouncepaw/TEST9","wgRelevantArticleId":1015,"wgUserId":24956263,"wgUserEditCount":2784,"wgUserRegistration":1456914630000,"wgUserNewMsgRevisionId":null,"wgIsProbablyEditable":!0,"wgRestrictionEdit":[],"wgRestrictionMove":[],"wgRelevantUserName":"Bouncepaw","wgMetrolookEnabledModules":{"collapsiblenav":!0},"wgCategoryTreePageCategoryOptions":"{\"mode\":0,\"hideprefix\":20,\"showcount\":true,\"namespaces\":false}"});mw.loader.implement("user.options",function($,jQuery){mw.user.options.set({"ccmeonemails":"1","disablemail":"","enotifwatchlistpages":"","gender":"male","timecorrection":"Offset|0"});});mw.loader.implement("user.tokens",function($,jQuery){mw.user.tokens.set({"editToken":"f5f55d67970b8fef04ae73917f881b5a57a46b07+\\","patrolToken":"302a2a203f372d1a706c9cb88efba0a257a46b07+\\","watchToken":"fdd0f51fe919b7d8f9397396d85d8e7e57a46b07+\\"});});mw.loader.load(["mediawiki.page.startup","mediawiki.legacy.wikibits","skins.metrolook.js"]);
} );</script>
<link rel="stylesheet" href="/w/load.php?debug=false&amp;lang=ru&amp;modules=ext.wikihiero%7Cmediawiki.legacy.commonPrint%2Cshared%7Cmediawiki.sectionAnchor%7Cmediawiki.skinning.interface%7Cskins.metrolook.styles.responsive&amp;only=styles&amp;skin=metrolook" />
<meta name="ResourceLoaderDynamicStyles" content="" />

Two scripts. They should be in external JS-file.

<link rel="stylesheet" href="//www.shoutwiki.com/w/load.php?debug=false&amp;lang=ru&amp;modules=ext.globalCssJs.site.styles&amp;only=styles&amp;skin=metrolook" />
<link rel="stylesheet" href="/w/load.php?debug=false&amp;lang=ru&amp;modules=site&amp;only=styles&amp;skin=metrolook" />

Two CSS-files. OK

<style>a:lang(ar),a:lang(kk-arab),a:lang(mzn),a:lang(ps),a:lang(ur){text-decoration:none}</style>

Useless.

<script async="" src="/w/load.php?debug=false&amp;lang=ru&amp;modules=startup&amp;only=scripts&amp;skin=metrolook"></script>
<meta name="generator" content="MediaWiki 1.26.3" />
<meta name="alexaVerifyID" content="CTcaaiwZDPTElMKyQj4OtlddZNQ" />
<meta name="description" content="Snow can always be broken down and rebuilt into something more useful. This simple fact fills you with determination." />
<meta name="viewport" content="width=device-width, initial-scale=1" />

OK.

<link rel="alternate" type="application/x-wiki" title="Править" href="/w/index.php?title=%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9&amp;action=edit" />
<link rel="edit" title="Править" href="/w/index.php?title=%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9&amp;action=edit" />

What is it? I don’t understand :(

<link rel="shortcut icon" href="http://images.shoutwiki.com/pokeru/6/64/Favicon.ico" />
<link rel="search" type="application/opensearchdescription+xml" href="/w/opensearch_desc.php" title="Покеру (ru)" />
<link rel="EditURI" type="application/rsd+xml" href="http://pokeru.shoutwiki.com/w/api.php?action=rsd" />
<link rel="copyright" href="http://creativecommons.org/licenses/by-sa/3.0/" />
<link rel="alternate" type="application/atom+xml" title="Покеру — Atom-лента" href="/w/index.php?title=%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%A1%D0%B2%D0%B5%D0%B6%D0%B8%D0%B5_%D0%BF%D1%80%D0%B0%D0%B2%D0%BA%D0%B8&amp;feed=atom" />
<!--[if lt IE 7]><style type="text/css">body{behavior:url("/w/skins/Metrolook/csshover.min.htc")}</style><![endif]-->

This Atom thing doesn’t work. This IE thing is not needed, because IE users should burn in hell :)

</head>
<body class="mediawiki ltr sitedir-ltr ns-2 ns-subject page-Участник_Bouncepaw_TEST9 skin-metrolook action-view">

Two ltr-classes. Useless.

		<div id="mw-page-base" class="noprint"></div>
		<div id="mw-head-base" class="noprint"></div>
		<div id="content" class="mw-body overthrow" role="main">
			<a id="top"></a>

						<div class="mw-indicators">
</div>

Some useless spaces and empty tags.

			<h1 id="firstHeading" class="firstHeading" lang="ru">Участник:Bouncepaw/TEST9</h1>
									<div id="bodyContent" class="mw-body-content">
									<div id="siteSub">Материал из Покеру</div>

More useless spaces. id="firstHeading" class="firstHeading"? Why?

								<div id="contentSub"><span class="subpages">&lt; <a href="/wiki/%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw" title="Участник:Bouncepaw">Участник:Bouncepaw</a></span></div>

Spaces. A in Span in Div. Why not A in Div?

												<div id="jump-to-nav" class="mw-jump">
					Перейти к:					<a href="#mw-head">навигация</a>, 											<a href="#p-search">поиск</a>
									</div>

Spaces. I didn’t find this «навигация»-thing.

				<div id="mw-content-text" lang="ru" dir="ltr" class="mw-content-ltr"><p>Snow can always be broken down and rebuilt into something more useful. This simple fact fills you with determination.</p>

Spaces. Actual content. Two ltr.

<!-- 
NewPP limit report
Parsed by monolith
Cached time: 20160805103105
Cache expiry: 86400
Dynamic content: false
CPU time usage: 0.075 seconds
Real time usage: 0.145 seconds
Preprocessor visited node count: 1/1000000
Preprocessor generated node count: 0/1000000
Post‐expand include size: 0/2097152 bytes
Template argument size: 0/2097152 bytes
Highest expansion depth: 1/40
Expensive parser function count: 0/100
-->

<!-- 
Transclusion expansion time report (%,ms,calls,template)
100.00%    0.000      1 - -total
-->

<!-- Saved in parser cache with key pokeru_wiki:pcache:idhash:1015-0!*!*!*!*!*!* and timestamp 20160805103110 and revision id 1665
 -->

Spaces. Lots of info that user won’t ever need.

</div>					<div class="printfooter">
						Источник — «<a dir="ltr" href="http://pokeru.shoutwiki.com/w/index.php?title=Участник:Bouncepaw/TEST9&amp;oldid=1665">http://pokeru.shoutwiki.com/w/index.php?title=Участник:Bouncepaw/TEST9&amp;oldid=1665</a>»					</div>

Links in version for printer? Ltr? Useless.

				<div id='catlinks' class='catlinks catlinks-allhidden'></div>				<div class="visualClear"></div>
					<div id="footer" role="contentinfo">
				<hr />
							<ul id="footer-info">
											<li id="footer-info-lastmod"> Последнее изменение этой страницы: 10:31, 5 августа 2016.</li>
											<li id="footer-info-copyright">Содержимое доступно по лицензии <a class="external" rel="nofollow" href="http://creativecommons.org/licenses/by-sa/3.0/">Creative Commons Attribution-Share Alike 3.0</a> (если не указано иное).</li>
									</ul>
							<ul id="footer-places">
											<li id="footer-places-privacy"><a href="http://www.shoutwiki.com/wiki/Privacy_policy" title="s:Privacy policy">Политика конфиденциальности</a></li>
											<li id="footer-places-about"><a href="/wiki/%D0%9F%D0%BE%D0%BA%D0%B5%D1%80%D1%83:%D0%9E%D0%BF%D0%B8%D1%81%D0%B0%D0%BD%D0%B8%D0%B5" title="Покеру:Описание">Описание Покеру</a></li>
											<li id="footer-places-disclaimer"><a href="http://www.shoutwiki.com/wiki/Terms_of_use" title="s:Terms of use">Условия пользования</a></li>
									</ul>
										<ul id="footer-icons" class="noprint">
											<li id="footer-copyrightico">
							<a href="http://creativecommons.org/licenses/by-sa/3.0/"><img src="/w/resources/assets/licenses/cc-by-sa.png" alt="Creative Commons Attribution-Share Alike 3.0" width="88" height="31" /></a>						</li>
											<li id="footer-poweredbyico">
							<a href="//www.mediawiki.org/"><img src="/w/resources/assets/poweredby_mediawiki_88x31.png" alt="Powered by MediaWiki" srcset="/w/resources/assets/poweredby_mediawiki_132x47.png 1.5x, /w/resources/assets/poweredby_mediawiki_176x62.png 2x" width="88" height="31" /></a><a href="http://www.shoutwiki.com/"><img src="http://www.shoutwiki.com/w/hosted_by_ShoutWiki.png" alt="Hosted by ShoutWiki" width="88" height="31" /></a>						</li>
									</ul>
						<div style="clear:both"></div>
		</div>
								<div class="visualClear"></div>
							</div>
		</div>

Spaces. Why is it written from UL? Some empty tags.

		<div id="mw-navigation">
			<h2>Навигация</h2>

		<div id="mw-head">
			<div id="hamburgerIcon">
				<img
				class="hamburger"
				alt=""
				src="//www.shoutwiki.com/w/skins/Metrolook/images/Transparent.gif?303" />
			</div>

Spaces. I haven’t found this «Навигация».

							<div style="padding-left:10px;">
					<div class="lighthover siteLogoBar">
						<div class="onhoverbg">
							<h4 class="title-name">
								<a href="/wiki/%D0%97%D0%B0%D0%B3%D0%BB%D0%B0%D0%B2%D0%BD%D0%B0%D1%8F_%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86%D0%B0">
									<span class="title-name">
										Покеру									</span>
								</a>
							</h4>
						</div>
					</div>
				</div>

Spaces. Inline style. Div > div > div > h4 > a > span. Why?

															<div class="lighthover siteLogoBar">
								<img
				class="line"
				alt=""
				src="//www.shoutwiki.com/w/skins/Metrolook/images/Transparent.gif?303"
				/>
									</div>
																			<div class="lighthover siteLogoBar">
								<img
				class="downarrow"
				alt=""
				src="//www.shoutwiki.com/w/skins/Metrolook/images/Transparent.gif?303"
				/>
									</div>
			<div class="vectorMenu" id="usermenu">
				<div class="no-js">
					<a href="#" class="user-icon-container">
						<span id="username-top">
							<span id="username-text">Bouncepaw</span>
							<span class="username-space spacer"> </span>
							<span id="userIcon20"><img class="userIcon20" src="//www.shoutwiki.com/w/skins/Metrolook/images/Transparent.gif?303" alt="" /></span>
							<span class="spacer"> </span>
							<span id="userIcon40"><img class="userIcon40" src="//www.shoutwiki.com/w/skins/Metrolook/images/Transparent.gif?303" alt="" /></span>
						</span>
					</a>

Spaces.

					<div class="menu personal-menu">
											<div id="p-personal" role="navigation" class="" aria-labelledby="p-personal-label">
						<h5 id="p-personal-label">Персональные инструменты</h5>
						<ul>
							<li id="pt-userpage"><a href="/wiki/%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw" dir="auto" title="Ваша страница участника [.]" accesskey=".">Bouncepaw</a></li><li id="pt-mytalk"><a href="/wiki/%D0%9E%D0%B1%D1%81%D1%83%D0%B6%D0%B4%D0%B5%D0%BD%D0%B8%D0%B5_%D1%83%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA%D0%B0:Bouncepaw" class="new" title="Ваша страница обсуждения [n]" accesskey="n">Обсуждение</a></li><li id="pt-preferences"><a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B8" title="Ваши настройки">Настройки</a></li><li id="pt-watchlist"><a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%A1%D0%BF%D0%B8%D1%81%D0%BE%D0%BA_%D0%BD%D0%B0%D0%B1%D0%BB%D1%8E%D0%B4%D0%B5%D0%BD%D0%B8%D1%8F" title="Список страниц, изменения в которых вы отслеживаете [l]" accesskey="l">Список наблюдения</a></li><li id="pt-mycontris"><a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%92%D0%BA%D0%BB%D0%B0%D0%B4/Bouncepaw" title="Список ваших правок [y]" accesskey="y">Вклад</a></li><li id="pt-logout"><a href="/w/index.php?title=%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%97%D0%B0%D0%B2%D0%B5%D1%80%D1%88%D0%B5%D0%BD%D0%B8%D0%B5_%D1%81%D0%B5%D0%B0%D0%BD%D1%81%D0%B0&amp;returnto=%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA%3ABouncepaw%2FTEST9" title="Завершить сеанс работы">Выйти</a></li>						</ul>
					</div>
										</div>
				</div>
			</div>
			<div id="echoNotifications">
				<ul>
									</ul>
			</div>

Spaces. No one reads descriptions.

			<div id="left-navigation">
									<a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%97%D0%B0%D0%B3%D1%80%D1%83%D0%B7%D0%BA%D0%B0">
						<div class="onhoverbg" id="uploadbutton">
							<img
							class="uploadbutton"
							alt=""
							src="//www.shoutwiki.com/w/skins/Metrolook/images/Transparent.gif?303" />
								<span class="uploadbutton">
									Загрузить файл								</span>
						</div>
					</a>

Spaces. Div > a > div > img, span.

													<div id="p-namespaces" role="navigation" class="vectorTabs" aria-labelledby="p-namespaces-label">
						<h5 id="p-namespaces-label">Пространства имён</h5>
						<ul>
															<li  id="ca-nstab-user" class="selected"><span><a href="/wiki/%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9"  title="Персональная страница участника [c]" accesskey="c">Участник</a></span></li>
															<li  id="ca-talk" class="new"><span><a href="/w/index.php?title=%D0%9E%D0%B1%D1%81%D1%83%D0%B6%D0%B4%D0%B5%D0%BD%D0%B8%D0%B5_%D1%83%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA%D0%B0:Bouncepaw/TEST9&amp;action=edit&amp;redlink=1"  title="Обсуждение основной страницы [t]" accesskey="t" rel="discussion">Обсуждение</a></span></li>
													</ul>
					</div>

Spaces. Descriptions.


										<div id="p-variants" role="navigation" class="vectorMenu emptyPortlet" aria-labelledby="p-variants-label">
												<h5 id="p-variants-label">
							<span>Варианты</span><a href="#"></a>
						</h5>

						<div class="menu">
							<ul>
															</ul>
						</div>
					</div>
Spaces. Div > h5 > span, empty a. Empty .menu.
										<div id="p-views" role="navigation" class="vectorTabs" aria-labelledby="p-views-label">
						<h5 id="p-views-label">Просмотры</h5>
						<ul>
															<li id="ca-view" class="selected"><span><a href="/wiki/%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9" >Просмотр</a></span></li>
															<li id="ca-edit"><span><a href="/w/index.php?title=%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9&amp;action=edit"  title="Редактировать данную страницу [e]" accesskey="e">Править</a></span></li>
															<li id="ca-history" class="collapsible"><span><a href="/w/index.php?title=%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9&amp;action=history"  title="Журнал изменений страницы [h]" accesskey="h">История</a></span></li>
															<li id="ca-unwatch" class="icon"><span><a href="/w/index.php?title=%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9&amp;action=unwatch&amp;token=7289374eff96121e4cc8b6aeb6a1054257a46b07%2B%5C"  title="Удалить эту страницу из вашего списка наблюдения [w]" accesskey="w">Не следить</a></span></li>
													</ul>
					</div>
Spaces. Descriptions. Li > span > a.
										<div id="p-cactions" role="navigation" class="vectorMenu actionmenu" aria-labelledby="p-cactions-label">
						<h5 id="p-cactions-label"><span>Действия</span><a href="#"></a></h5>

						<div class="menu">
							<ul>
																	<li id="ca-delete">
										<a href="/w/index.php?title=%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9&amp;action=delete"  title="Удалить эту страницу [d]" accesskey="d">Удалить</a>
									</li>
																	<li id="ca-move">
										<a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%9F%D0%B5%D1%80%D0%B5%D0%B8%D0%BC%D0%B5%D0%BD%D0%BE%D0%B2%D0%B0%D1%82%D1%8C_%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86%D1%83/%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9"  title="Переименовать страницу [m]" accesskey="m">Переименовать</a>
									</li>
																	<li id="ca-protect">
										<a href="/w/index.php?title=%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9&amp;action=protect"  title="Защитить страницу от изменений [=]" accesskey="=">Защитить</a>
									</li>
															</ul>
						</div>
					</div>
								</div>
Spaces. Descriptions.
									<img
					class="searchbar"
					alt=""
					src="//www.shoutwiki.com/w/skins/Metrolook/images/Transparent.gif?303" />
								<img
				class="editbutton"
				alt=""
				src="//www.shoutwiki.com/w/skins/Metrolook/images/Transparent.gif?303" />
Spaces. Transparent.gif? Is it 1×1px transparent picture? Support for old browsers?
			<div id="right-navigation">
															<div id="p-search" role="search">
							<h5>
								<label for="searchInput">Поиск</label>
							</h5>

							<form action="/w/index.php" id="searchform">
								<div
									 id="simpleSearch"								>
								<input type="search" name="search" placeholder="Поиск" title="Искать в Покеру [f]" accesskey="f" id="searchInput" /><input type="hidden" value="Служебная:Поиск" name="title" /><input type="submit" name="fulltext" value="Найти" title="Найти страницы, содержащие указанный текст" id="mw-searchButton" class="searchButton mw-fallbackSearchButton" /><input type="submit" name="go" value="Перейти" title="Перейти к странице, имеющей в точности такое название" id="searchButton" class="searchButton" />								</div>
							</form>
						</div>
													</div>
		</div>
Spaces.
							<div id="mw-panel">
											<div id="p-logo" role="banner"><a class="mw-wiki-logo" href="/wiki/%D0%97%D0%B0%D0%B3%D0%BB%D0%B0%D0%B2%D0%BD%D0%B0%D1%8F_%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86%D0%B0"  title="Перейти на заглавную страницу"></a></div>
Div > div > a
															<div class="portal" role="navigation" id='p-navigation' aria-labelledby='p-navigation-label'>
				<h5 id='p-navigation-label'>Навигация</h5>
									<div class="body">
												<ul>
						<li id="n-mainpage-description"><a href="/wiki/%D0%97%D0%B0%D0%B3%D0%BB%D0%B0%D0%B2%D0%BD%D0%B0%D1%8F_%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86%D0%B0" title="Перейти на заглавную страницу [z]" accesskey="z">Заглавная страница</a></li><li id="n-recentchanges"><a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%A1%D0%B2%D0%B5%D0%B6%D0%B8%D0%B5_%D0%BF%D1%80%D0%B0%D0%B2%D0%BA%D0%B8" title="Список последних изменений [r]" accesskey="r">Свежие правки</a></li><li id="n-randompage"><a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%A1%D0%BB%D1%83%D1%87%D0%B0%D0%B9%D0%BD%D0%B0%D1%8F_%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86%D0%B0" title="Посмотреть случайно выбранную страницу [x]" accesskey="x">Случайная статья</a></li><li id="n-help"><a href="http://www.mediawiki.org/wiki/Special:MyLanguage/Help:Contents" title="Место, где можно получить справку">Справка</a></li>					</ul>
							</div>
		</div>
						<div class="portal" role="navigation" id='p-tb' aria-labelledby='p-tb-label'>
				<h5 id='p-tb-label'>Инструменты</h5>
									<div class="body">
												<ul>
						<li id="t-whatlinkshere"><a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%A1%D1%81%D1%8B%D0%BB%D0%BA%D0%B8_%D1%81%D1%8E%D0%B4%D0%B0/%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9" title="Список всех страниц, ссылающихся на данную [j]" accesskey="j">Ссылки сюда</a></li><li id="t-recentchangeslinked"><a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%A1%D0%B2%D1%8F%D0%B7%D0%B0%D0%BD%D0%BD%D1%8B%D0%B5_%D0%BF%D1%80%D0%B0%D0%B2%D0%BA%D0%B8/%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9" title="Последние изменения в страницах, на которые ссылается эта страница [k]" accesskey="k">Связанные правки</a></li><li id="t-contributions"><a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%92%D0%BA%D0%BB%D0%B0%D0%B4/Bouncepaw" title="Список страниц, которые изменял этот участник">Вклад участника</a></li><li id="t-log"><a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%96%D1%83%D1%80%D0%BD%D0%B0%D0%BB%D1%8B/Bouncepaw">Журналы</a></li><li id="t-blockip"><a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%97%D0%B0%D0%B1%D0%BB%D0%BE%D0%BA%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D1%82%D1%8C/Bouncepaw">Заблокировать участника</a></li><li id="t-emailuser"><a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%9F%D0%B8%D1%81%D1%8C%D0%BC%D0%BE_%D1%83%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA%D1%83/Bouncepaw" title="Отправить письмо этому участнику">Письмо участнику</a></li><li id="t-userrights"><a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%A3%D0%BF%D1%80%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5_%D0%BF%D1%80%D0%B0%D0%B2%D0%B0%D0%BC%D0%B8/Bouncepaw">Управление правами участника</a></li><li id="t-upload"><a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%97%D0%B0%D0%B3%D1%80%D1%83%D0%B7%D0%BA%D0%B0" title="Загрузить файлы [u]" accesskey="u">Загрузить файл</a></li><li id="t-specialpages"><a href="/wiki/%D0%A1%D0%BB%D1%83%D0%B6%D0%B5%D0%B1%D0%BD%D0%B0%D1%8F:%D0%A1%D0%BF%D0%B5%D1%86%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86%D1%8B" title="Список служебных страниц [q]" accesskey="q">Спецстраницы</a></li><li id="t-print"><a href="/w/index.php?title=%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9&amp;printable=yes" rel="alternate" title="Версия этой страницы для печати [p]" accesskey="p">Версия для печати</a></li><li id="t-permalink"><a href="/w/index.php?title=%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9&amp;oldid=1665" title="Постоянная ссылка на эту версию страницы">Постоянная ссылка</a></li><li id="t-info"><a href="/w/index.php?title=%D0%A3%D1%87%D0%B0%D1%81%D1%82%D0%BD%D0%B8%D0%BA:Bouncepaw/TEST9&amp;action=info" title="Подробнее об этой странице">Сведения о странице</a></li>					</ul>
							</div>
		</div>
Spaces. Descriptions. Long URLs. Why not to use URL-shortener?
						<div class="portal" role="navigation" id='p-.D0.A1.D0.BE.D0.BE.D0.B1.D1.89.D0.B5.D0.BD.D0.B8.D1.8F_ShoutWiki' aria-labelledby='p-.D0.A1.D0.BE.D0.BE.D0.B1.D1.89.D0.B5.D0.BD.D0.B8.D1.8F_ShoutWiki-label'>
				<h5 id='p-.D0.A1.D0.BE.D0.BE.D0.B1.D1.89.D0.B5.D0.BD.D0.B8.D1.8F_ShoutWiki-label'>Сообщения ShoutWiki</h5>
									<div class="body">
									<ul><li><a href="http://ru.shoutwiki.com/">Главная ShoutWiki</a></li>
			<li><a href="http://www.shoutwiki.com/wiki/Special:CreateWiki">Создать вики</a></li><li><a href="http://www.shoutwiki.com/wiki/Forum:Index">Форум ShoutWiki</a></li>

</ul>
<hr /><ul>

					<li>
						<p><a href="http://www.shoutwiki.com/wiki/Forum:Summer_2015_Product_Discussion" class="extiw" title="s:Forum:Summer 2015 Product Discussion">Join us in discussing new and upcoming features!</a><br/><a class="external text" href="http://blog.shoutwiki.com">More ShoutWiki news...</a></p>
					</li>
				</ul>			</div>
		</div>
					</div>
Spaces, long IDs, outdated links. Nice!
			
							<div class="top-tile-bar-inner-container">
					<div class="topleft">
						<div class="tilebar" id="bartile">
							<div id="tilegrouptable">
								<div id="tilegroup">
																	</div>
							</div>
						</div>
					</div>
				</div>
					</div>

		<div id="mw-panel-right" class="noprint">
					</div>
5 divs in a row!
		<script>window.RLQ = window.RLQ || []; window.RLQ.push( function () {

mw.loader.state({"ext.globalCssJs.site":"loading","ext.globalCssJs.user":"ready","user":"ready","user.groups":"ready"});mw.loader.load("//www.shoutwiki.com/w/load.php?debug=false\u0026lang=ru\u0026modules=ext.globalCssJs.site\u0026only=scripts\u0026skin=metrolook");mw.loader.load(["mediawiki.action.view.postEdit","site","mediawiki.user","mediawiki.hidpi","mediawiki.page.ready","mediawiki.searchSuggest","mediawiki.page.watch.ajax","skins.metrolook.collapsibleNav"]);
} );</script><!-- Piwik -->
<script src="http://piwik.staff.shoutwiki.com/piwik.js" type="text/javascript"></script>
<script type="text/javascript">
/* <![CDATA[ */
try {
var piwikTracker = Piwik.getTracker(pkBaseURL + "piwik.php", 8468);
piwikTracker.setDocumentTitle("Участник:Bouncepaw/TEST9");
piwikTracker.setIgnoreClasses("image");

piwikTracker.trackPageView();
piwikTracker.enableLinkTracking();
} catch( err ) {}
/* ]]> */
</script><noscript><p><img src="http://piwik.staff.shoutwiki.com/piwik.php?idsite=8468" style="border:0" alt=""/></p></noscript>
<!-- /Piwik --><script>window.RLQ = window.RLQ || []; window.RLQ.push( function () {
mw.config.set({"wgBackendResponseTime":160,"wgHostname":"monolith"});
} );</script> </body>
</html>

Scripts must be in JS-files.


As you can see, code is bad.

You may say that it is Metrolook and it is third-party skin. But there’re same problems for Aurora skin.

Metrolook and Aurora are both mobile-friendly skins. But Aurora is hard to use and isn’t flat (Pokeru uses Flat Design as much as possible).

It would be nice if you optimize code.

Thank you!

jack added a subscriber: jack.Aug 5 2016, 4:21 PM

dir="ltr". Why is it specified?

Page content and User Interface language can be different. But you'd have to ask upstream for a definitive answer.

Two scripts. They should be in external JS-file.

The majority of JS is already in external files and they're loaded via ResourceLoader, which greatly improves performance compared to old versions of MediaWiki (1.15 and older) which didn't have ResourceLoader. Wikimedia's performance team is constantly working on improving MediaWiki's performance, and each new release of MediaWiki includes more and more performance tweaks.

The inline <script>s you mentioned cannot be moved elsewhere due to being essential for just about all other scripts (AFAIK).

What is it? I don’t understand :(

These two <link> elements are related to the Universal Edit Button. (These are output from OutputPage::getHeadLinksArray())

This Atom thing doesn’t work.

What do you mean by that? The feed stuff comes from MediaWiki core, so provided that it's not a configuration issue with ShoutWiki, we should report it upstream if it hasn't already been fixed there.

This IE thing is not needed, because IE users should burn in hell :)

That is your subjective opinion and you're perfectly entitled to that, but it is not ShoutWiki's official opinion nor the opinion of MediaWiki developers. However, as of MediaWiki 1.27, users using Internet Explorer 8 or older version are no longer served JavaScript (see the MediaWiki.org page on compatibility for details).

Two ltr-classes. Useless.

You should talk to upstream about this if this is something you feel strongly about, but I suspect these classes aren't going away anytime soon because MediaWiki takes their i18n and l10n far more seriously than most (FOSS) projects.

id="firstHeading" class="firstHeading"? Why?

Legacy reasons mainly. IIRC the ID was there first, then someone added the class, and now both exist. At least this way user scripts etc. won't break easily.

I haven’t found this «Навигация».

div#mw-navigation in Metrolook is practically hidden via CSS but kept accessible for screen readers (see /skins/Metrolook/components/navigation.less).

Empty .menu.

This appears to be the language variants menu, used mainly for languages like Chinese or Serbian. I agree that it seems silly to output an empty menu. This is done in MetrolookTemplate::renderNavigation(). It shouldn't be too hard to not output this at all when there are no language variants...

Transparent.gif? Is it 1×1px transparent picture? Support for old browsers?

I believe so, yes. See upstream ticket T113179 for some more info about this.

Div > div > a

Metrolook is a fork of the Vector skin, which explains (but doesn't necessarily justify) some strange design choices, such as this one.

Long URLs. Why not to use URL-shortener?

It's true that URLs for languages not written in the Latin script are somewhat long. This is more of an upstream issue, though, than something specific to ShoutWiki. As for URL shorteners, the relevant Wikipedia article discusses their shortcomings.

outdated links

The contents of the NewsBox are pulled from MediaWiki:Newsbox on the Interface Messages Wiki. It is true that the linked page is somewhat old and unfortunately named, but nevertheless we are always interested in hearing your thoughts!
Alas, the NewsBox is probably our best way of reaching out to a great number of ShoutWiki users, even though the NewsBox isn't shown in the Aurora skin. The other option would be to use the GlobalNotice extension, but I think that'd be way too obtrusive.

5 divs in a row!

I agree, this seems silly.

You may say that it is Metrolook and it is third-party skin. But there’re same problems for Aurora skin.

This is partially true. However, I'm pretty confident we're not going to achieve a massive improvement in page loading times by removing all the spaces and whatnot from the source files. You're right in that optimization is needed, but I'd argue that back-end optimization will be more useful in the long run.

Certain things you described in this ticket, such as silly HTML structure or the transparent.gif file are indeed Metrolook-specific. I encourage you to file these tickets on upstream Phabricator and get in touch with Paladox, the main developer of the Metrolook skin, about these matters.

Looking at your site in particular, one third of the things Google has as a "Should fix" are actually nothing to do with us - your site loads an external stylesheet from Wikia which is yet another DNS lookup and request which has to be processed by their servers, and then rendered by your browser, after the stylesheet calling for it to be loaded has been processed by our servers.

You've got a point, that there are some issues in the HTML, but you're there's also a lot where you're simply applying theories on the web and page loading to ShoutWiki/MediaWiki's HTML that are. just, simply theories that don't work in a lot of practical cases.

What do you mean by that? The feed stuff comes from MediaWiki core, so provided that it's not a configuration issue with ShoutWiki, we should report it upstream if it hasn't already been fixed there.

I heard that it is Chromium-specific error. See screenshot.

The contents of the NewsBox are pulled from MediaWiki:Newsbox on the Interface Messages Wiki. It is true that the linked page is somewhat old and unfortunately named, but nevertheless we are always interested in hearing your thoughts!

To be honest, there aren’t any interesting things to link to them. Russian Wikia (and maybe others too) has monthly competition (users vote for best wiki on forum and on VK (Facebook analog) and staff votes too). I think, ShoutWiki needs competitions and other cool stuff.

This is partially true. However, I'm pretty confident we're not going to achieve a massive improvement in page loading times by removing all the spaces and whatnot from the source files. You're right in that optimization is needed, but I'd argue that back-end optimization will be more useful in the long run.

I found some whitespace-removing services. They removed 4KB from HTML. It isn’t much, I agree.


Looking at your site in particular, one third of the things Google has as a "Should fix" are actually nothing to do with us

And other two thirds?

your site loads an external stylesheet from Wikia which is yet another DNS lookup and request which has to be processed by their servers, and then rendered by your browser, after the stylesheet calling for it to be loaded has been processed by our servers.

You are right, I do not use this Wikia-thing much. I removed it.

lewiscawte closed this task as Wontfix.Sep 7 2016, 10:04 PM
lewiscawte claimed this task.