Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
linux_faq:dokuwiki_disable_jquery_for_guest_users [2020/06/15 11:54]
admin [./inc/template.php]
linux_faq:dokuwiki_disable_jquery_for_guest_users [2020/06/15 11:55] (current)
admin [Jquery not loded]
Line 1: Line 1:
 +====== Задача ======
 +Мне захотелось ускорить мою **DokuWiki**, чтобы она быстрее открывалась. Один из способов сделать это - отключить загрузку некритичных библиотек и скриптов. В частности - **JQuery**. Я буду отключать загрузку **JQuery** для незалогиненных пользователей (гостей), которые имеют права только на чтение статей.
  
 +====== Решение ======
 +Библиотеки **JQuery** загружаются кодом из файлика **./inc/template.php**:
 +<code>
 +// load jquery
 +$jquery = getCdnUrls();
 +foreach($jquery as $src) {
 +    $head['script'][] = array(
 +        'type' => 'text/javascript', 'charset' => 'utf-8', '_data' => '', 'src' => $src
 +    );
 +}
 +</code>
 +Уровень привилегий пользователя можно определить с помощью функции **auth_quickaclcheck($ID)**, которая возвращает число от 1 до 255. Гости с правом чтения имеют значение уровня привилегий **1**. Вот кусочек из **inc/auth.php**:
 +<code>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);
 +</code>
 +Соответственно, для достижения желаемого нам надо обернуть код загрузки **JQuery** в условие, которое проверит уровень привилегий пользователя:
 +<code>
 +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
 +        );
 +    }
 +}
 +</code>
 +Теперь у незалогиненных пользователей мой сайтик грузится на ~**30%** быстрее. Без существенных потерь в функциональности и качестве отображения.
 +
 +===== Делаем загрузку js асинхронной =====
 +Многие скирипты можно загружать ассинхронно, тем самым значительно ускоряя отрисовку.
 +==== ./lib/plugins/ckgedit/action/meta.php ====
 +Функцию **loadScript** приводим к такому виду (вставляем слово **async** в строку **<script type="text/javascript" async>** ):
 +<code>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>' ) ;        
 +
 +    }
 +//]]> </code>
 +
 +==== ./inc/template.php ====
 +В функции **_tpl_metaheaders_action**, которая генерирует метатеги, которые, в свою очередь загружают скрипты, нужно добавить проверку привилегий пользователя и для незалогиненных пользователей добавить слово **async** в строке:
 +  echo '>', $attr['_data'], '</', $tag, '>'; 
 +То есть функция будет выглядеть так:
 +
 +<code>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";
 +        }
 +    }
 +}
 +</code>
 +Таким образом, для незалогиненных пользователей страница будет загружаться гораздо быстрее, но иногда возможны несущественные артефакты из-за ассинхронной загрузки скриптов.
 +
 +====== 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
  • linux_faq/dokuwiki_disable_jquery_for_guest_users.txt
  • Last modified: 2020/06/15 11:55
  • by admin