Задача
Мне захотелось ускорить мою DokuWiki, чтобы она быстрее открывалась. Один из способов сделать это - отключить загрузку некритичных библиотек и скриптов. В частности - JQuery. Я буду отключать загрузку JQuery для незалогиненных пользователей (гостей), которые имеют права только на чтение статей.
Решение
Библиотеки JQuery загружаются кодом из файлика ./inc/template.php:
// load jquery $jquery = getCdnUrls(); foreach($jquery as $src) { $head['script'][] = array( 'type' => 'text/javascript', 'charset' => 'utf-8', '_data' => '', 'src' => $src ); }
Уровень привилегий пользователя можно определить с помощью функции auth_quickaclcheck($ID), которая возвращает число от 1 до 255. Гости с правом чтения имеют значение уровня привилегий 1. Вот кусочек из inc/auth.php:
define('AUTH_NONE', 0); define('AUTH_READ', 1); define('AUTH_EDIT', 2); define('AUTH_CREATE', 4); define('AUTH_UPLOAD', 8); define('AUTH_DELETE', 16); define('AUTH_ADMIN', 255);
Соответственно, для достижения желаемого нам надо обернуть код загрузки JQuery в условие, которое проверит уровень привилегий пользователя:
if(auth_quickaclcheck($ID) > 1){ // load jquery $jquery = getCdnUrls(); foreach($jquery as $src) { $head['script'][] = array( 'type' => 'text/javascript', 'charset' => 'utf-8', '_data' => '', 'src' => $src ); } }
Теперь у незалогиненных пользователей мой сайтик грузится на ~30% быстрее. Без существенных потерь в функциональности и качестве отображения.
Делаем загрузку js асинхронной
Многие скирипты можно загружать ассинхронно, тем самым значительно ускоряя отрисовку.
./lib/plugins/ckgedit/action/meta.php
Функцию loadScript приводим к такому виду (вставляем слово async в строку <script type=“text/javascript” async> ):
function loadScript(Doku_Event $event) { echo <<<SCRIPT <script type="text/javascript" async> //<![CDATA[ function LoadScript( url ) { document.write( '<scr' + 'ipt type="text/javascript" src="' + url + '"><\/scr' + 'ipt>' ) ; } function LoadScriptDefer( url ) { document.write( '<scr' + 'ipt type="text/javascript" src="' + url + '" defer><\/scr' + 'ipt>' ) ; } //]]>
./inc/template.php
В функции _tpl_metaheaders_action, которая генерирует метатеги, которые, в свою очередь загружают скрипты, нужно добавить проверку привилегий пользователя и для незалогиненных пользователей добавить слово async в строке:
echo '>', $attr['_data'], '</', $tag, '>';
То есть функция будет выглядеть так:
function _tpl_metaheaders_action($data) { foreach($data as $tag => $inst) { if($tag == 'script') { echo "<!--[if gte IE 9]><!-->\n"; // no scripts for old IE } foreach($inst as $attr) { if ( empty($attr) ) { continue; } echo '<', $tag, ' ', buildAttributes($attr); if(isset($attr['_data']) || $tag == 'script') { if($tag == 'script' && $attr['_data']) $attr['_data'] = "/*<![CDATA[*/". $attr['_data']. "\n/*!]]>*/"; if(auth_quickaclcheck($ID) > 1){ echo '>', $attr['_data'], '</', $tag, '>'; } else { echo ' async>', $attr['_data'], '</', $tag, '>'; } } else { echo '/>'; } echo "\n"; } if($tag == 'script') { echo "<!--<![endif]-->\n"; } } }
Таким образом, для незалогиненных пользователей страница будет загружаться гораздо быстрее, но иногда возможны несущественные артефакты из-за ассинхронной загрузки скриптов.
bootstrap3 Template Optimization
Jquery not loaded
После очередного обновления DokuWiki сломался темплейт bootstrap3 - перестали работать выпадающие меню, а отладочная консоль браузера говорила, что нету jquery.
Оказалось, что нужно пойти в настройки (doku.php?do=admin&page=config) и выключить (снять галочку) defer_js (или внести те же изменения в config.php вручную).
Font Optimization
https://web.dev/font-display/?utm_source=lighthouse&utm_medium=unknown
В файлик ./lib/tpl/bootstrap3/assets/fonts/united.fonts.css нужно вставить свойство:
font-display: swap
Discussion
Без JQuery не работает indexmenu, а жаль действительно странички работают в разы шустрее.