» » Увеличение скорости загрузки сайта на DLE (часть 1) обновлено

Увеличение скорости загрузки сайта на DLE (часть 1) обновлено

27.08
153
61 782
Увеличение скорости загрузки сайта на DLE (часть 1) обновлено


Всем известно, что DLE - один из самых быстрых движков. Но не все знают о возможности его ускорения простыми средствами.
Не верите? Просто проверьте свой сайт и вы поймёте, что он медленный.

Проверили? Медленный? Тогда эта статья для Вас.


В статье я буду рассматривать уже более-менее оптимизированный сайт, на котором скрипты и стили вынесены в файлы, а не лежат по всем шаблонам инлайново.

Оптимизация номер один - размещение скриптов на странице


Это, на мой взгляд, должно присутствовать изначально в двиге.

ВНИМАНИЕ!


Не советую производить первый шаг если не разбираетесь в подключении скриптов. Т.к. скорее всего при этом будет много ошибок js на разных страницах сайта
Первое, что проще всего сделать в чистой вёрстке для ускорения страницы - положить все скрипты в конец страницы, перед тегом </body>.
В DLE такого нет и мы это исправим.

Открываем index.php
Для DLE до версии 9.6
находим:
$tpl->set ( '{headers}', $metatags."n".build_js($js_array, $config) );

меняем на:
$tpl->set ( '{headers}', build_js($js_array, $config) );
$tpl->set ( '{metatags}', $metatags );


Для DLE 9.6 (и скорее всего более поздних версий)
находим:
$tpl->set ( '{headers}', $metatags."n".$js_array );

меняем на:
$tpl->set ( '{headers}', $js_array );
$tpl->set ( '{metatags}', $metatags );

Это разделит метатеги и скрипты. Иначе не получится правильно оформить страницу.

Открываем main.tpl
Находим {headers} и заменяем на {metatags}
Находим и удаляем {AJAX}
Перед </body> вставляем:
{headers}
{AJAX}

Важно эти теги вставить до вызова всяких счётчиков и сторонних скриптов типа VK и т.д.
Так же необходимо перенести ниже этих тегов все скрипты, подключаемые к шаблону, иначе теряется смысл оптимизации.

Оптимизация номер два - gzip-сжатие скриптов и стилей


  1. Теперь самое простое и интересное: включаем gzip-сжатие для js и css, лежащих в шаблоне.
    Для этого необходимо пройти в админку и включить сжатие js-файлов. Далее:
    Предположим у нас есть 2 файла стилей:
    <link media="screen" href="{THEME}/style/styles.css" type="text/css" rel="stylesheet" />
    <link media="screen" href="{THEME}/style/engine.css" type="text/css" rel="stylesheet" />

    Заеняем эти строки на:
    <link rel="stylesheet" href="/engine/classes/min/index.php?charset=windows-1251&amp;f={THEME}/style/styles.css,{THEME}/style/engine.css&amp;7" />

    Где:
    charset=windows-1251&amp; - указание на кодировку файла (можно удалить если нет русских символов в файле или сайт на utf-8)
    &amp;7 - количество дней, на которое кешируется файл.

    Таким же образом поступаем с перенесёнными в конец main.tpl (если всё же решили проделать первый шаг) дополнительными скриптами:
    <script type="text/javascript" src="{THEME}/js/libs.js"></script>
    <script type="text/javascript" src="{THEME}/js/somesctipt.js"></script>

    превращаем в:
    <script type="text/javascript" src="/engine/classes/min/index.php?charset=windows-1251&amp;f={THEME}/js/libs.js,{THEME}/js/somesctipt.js&amp;7"></script>

    В итоге существенно увеличивается скорость загрузки страниц. Однако нужно иметь ввиду, что при редактировании файлов необходимо очищать кеш DLE и кеш браузера.
  2. Снова проверяем сайт с помощью гугла (ссылка в начале поста) и радуемся существенному прибавлению баллов.


В следующий раз постараюсь рассказать как использовать кеш браузера для ещё большего ускорения страниц.

Похожие материалы

Комментарии

ПафНутиЙ
ПафНутиЙ 19 октября 2012 09:37
С вероятностью в 99.9% скрипт слайдера отвалился. Смотрите через отладчик. Ну или пропустите первый пункт.
abasive
abasive 22 октября 2012 02:02
А что нужно сделать чтобы он сработал?
ПафНутиЙ
ПафНутиЙ 22 октября 2012 17:16
Посмотреть через отладчик, найти причину неисправности и исправить.
kabmir
kabmir 3 ноября 2012 22:55
Если вы перенесете:
<link media="screen" href="/engine/editor/css/default.css" type="text/css" rel="stylesheet"/>
в конец кода, то НЕ будет оформляться редактор например комментов, т.к. $js_array содержит также и этот default.css...
ПафНутиЙ
ПафНутиЙ 3 ноября 2012 23:15
.css не переносят в конец? т.к. css-файлы имеют первостепенную роль в оформлении сайта.. в конец переносят .js
kabmir
kabmir 3 ноября 2012 23:30
... т.к. $js_array содержит также и этот default.css...
ПафНутиЙ
ПафНутиЙ 4 ноября 2012 00:10
Я так понимаю речь идёт о визуальном редакторе. Тогда лучше просто не переносить.
P.S. очень редко кто пользуется визуальным редактором, поэтому я даже не рассматриваю случаи, когда он включен.
kabmir
kabmir 4 ноября 2012 23:53
Кстати, интересно ваше мнение - лучше не включать визуальный редактор?
ПафНутиЙ
ПафНутиЙ 5 ноября 2012 00:19
Кому как.
Кто привык руками код писать - вообще не нужен редактор.
А кто копирует из word - без визуальника ну никак, только код в этом случаи лучше не пытаться понять, его зачастую больше, чем самого текста в несколько раз.
lsdoptom
lsdoptom 10 декабря 2012 07:43
ПафНутиЙ а скорость загрузки страниц зависит от хостинга ? у меня на главной 83 на других
75-78 это приемлемо? хостинг бесплатный!
ПафНутиЙ
ПафНутиЙ 10 декабря 2012 08:52
нет. Это показатель оптимизации сайта для ускорения загрузки. Главная страница и внутренние всегда различаются. К примеру полной новости добавляются скрипты, относящиеся к форме добавления комментариев - это уменьшает кол-во баллов т.к. скрипты лежат инлайново.
Arsen
Arsen 7 января 2013 23:30
После шага со стилями гриво отображаеться шаблон, как буто стили не прописал
ПафНутиЙ
ПафНутиЙ 7 января 2013 23:34
адрес сайта?
Arsen
Arsen 8 января 2013 20:30
ПафНутиЙ,
Цитата: ПафНутиЙ
адрес сайта?

Проблема устранена неправильно прописал имя стилей))) Сайт действительно ускорился))
ПафНутиЙ
ПафНутиЙ 8 января 2013 22:40
отлично! smile
ecotraid
ecotraid 16 февраля 2013 20:01
Здравствуйте! А как включить gzip-сжатие для css если в шаблоне такой вывод:
<style type="text/css" media="all">
@import url({THEME}/css/style.css);
</style>

<style type="text/css" media="all">
@import url({THEME}/css/engine.css);
</style>

Спасибо!
ПафНутиЙ
ПафНутиЙ 16 февраля 2013 21:25
@import CSS - зло, откажитесь от подобного вида конструкций и жить станет легче)
ecotraid
ecotraid 16 февраля 2013 21:27
Подскажите как, только не меняя шаблон.
ПафНутиЙ
ПафНутиЙ 16 февраля 2013 21:31
<link href="{THEME}/css/style.css" rel="stylesheet">
<link href="{THEME}/css/engine.css" rel="stylesheet">
ecotraid
ecotraid 16 февраля 2013 21:33
ПафНутиЙ,спасибо! Буду пробовать.
Все получилось, и сжатие подключил. Еще раз спасибо!
Gopr
Gopr 20 июля 2013 23:10
Пару дней назад поставил первый пункт. Появились проблемы на странице добавления новостей. Перестали появляться подсказки в поле теги. То есть при написании уже существующего тега в этом поле не срабатывало авто заполнение. Еще пропала анимация при добавлении комментов. При нажатии на кнопку "Отправить" страница подпрыгивает до упора вверх. Анимацию удаления не проверял. Сайт на 9.7. Если не заменять {headers}, а дописать после него {metatags} то все нормально. Но такое решение возвращает визуально к стандартам dle и смысл такой оптимизации теряется, поэтому отказался.
ПафНутиЙ
ПафНутиЙ 20 июля 2013 23:47
всё так и должно быть, у вас просто отвалились js, использующие jquery.
не переносите подключение скриптом в футер.
Gopr
Gopr 21 июля 2013 01:21
Вроде бы все js перед </body>
Вот так было в main.tpl:
<html>
<head>{metatags} + css</head>
<body>
<div>
<div>шапка</div>
<div>контент</div>
<footer>подвал</footer></div>
{headers}{AJAX} + js</body></html>
ПафНутиЙ
ПафНутиЙ 21 июля 2013 01:25
все ваши js да, но не системые, которые выводятся через жопу в DLE своеобразно.
Golden_Eagle
Golden_Eagle 2 ноября 2013 12:25
Добрый день, спасибо за статью!!

Я выполнил 1 шаг, 2 шаг пропустил, 3 шаг (2 часть статьи) выполнил,

Выполнив 2 шаг, у меня пошли серьёзные баги, поэтому я его не стал делать.

А после 1,3 шагов у меня оптимизация возрасла до 94%, но PageSpeed ругается на "Удалите из верхней части страницы код javascript и CSS, блокирующий отображение"

Еще у меня перестала работать кнопка: "наверх" и косячно работает "добавление материалов"

Можете зайти глянуть???

Сайт тут http://vk.cc/1WU649
Скан сайта тут http://vk.cc/1WU5Rf
ПафНутиЙ
ПафНутиЙ 2 ноября 2013 17:16
забейте, подобные сайты не нужно оптимизировать)
Golden_Eagle
Golden_Eagle 3 ноября 2013 07:20
а как быть с нерабочей кнопкой наверх и с нерабочим добавлением материалов?
ПафНутиЙ
ПафНутиЙ 3 ноября 2013 13:20
Учиться пользоваться отладчиком.
Golden_Eagle
Golden_Eagle 4 ноября 2013 13:17
А где его найти в Chrome?
ScreN
ScreN 3 июня 2014 17:25
Все бы классно, но...
После таких манипуляций, перестает работать отправка сообщений CTRL+ENTER в чате + перестает работать плеер. Плеер стоит Media Elements

Добавить комментарий

Комментировать могут только зарегистрированные пользователи

Информация

Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.