Аудит js кода, или как избавиться от лишнего? / Вопросы, проблемы и их решения / Alto CMS

Аудит js кода, или как избавиться от лишнего? (comment #23784)

ptz2007@gmail.com — Wed, 23 Sep 2015 10:06:08 +0300

Меня тоже смущает такая ситуация, у меня сайт на LS с базой в 330 mb плагинов порядка 30 штук full time 0.7 и альто база В 10 раз меньше, плагинов В 2 раза меньше, full time 2,4 правда шаблон не simple а просто experience, на одном vps. Может В этом причина…

Аудит js кода, или как избавиться от лишнего? (comment #23795)

vshemarov@gmail.com — Wed, 23 Sep 2015 12:42:38 +0300

Если речь про значение «full time», которое выводится в футере, то у Альто там два числа: первое считается, как у ЛС, а второе — «по чесноку». Но это, в любом случае, не связано с js, т.к. считается время обработки на сервере, а the-boss ведет речь о файлах, которые грузятся на странице в браузере у юзера

Аудит js кода, или как избавиться от лишнего? (comment #23829)

ptz2007@gmail.com — Thu, 24 Sep 2015 19:46:25 +0300

Я не понял существо вопроса… прошу прощения… но просто почему выводятся столь большие цифры full time: 2.751 / 2.797? Это другая тема конечно… Хотелось бы уменьшить это значение тоже раза в три:)))

Аудит js кода, или как избавиться от лишнего? (comment #23785)

1099511627776@mail.ru — Wed, 23 Sep 2015 11:23:52 +0300

Вот на примере bootbox.js — насколько я могу понять, он используется для вызова модального окна при правке участников в личных сообщений, весит 30Kb, ужатый 9Kb, где он еще используется?

Как ты правильно заметил все очень индивидуально, к примеру bootbox можно попробовать вынести в футер а вот jquery — нет

Аудит js кода, или как избавиться от лишнего? (comment #23787)

create.nfo@gmail.com — Wed, 23 Sep 2015 12:05:10 +0300

Вообще я склоняюсь к тому, чтобы выделить основу из скриптов + css и вынести их загрузку на экшены. Тогда при первой загрузке сайта будет использоваться только самое необходимое: основные стили + jquery + bootstrap js. А все остальное будет подгружаться постепенно. Это хоть как-то поможет разбить монолит.

Если я правильно понял, shtrih в одном из тикетов на гитхабе предлагал Вадиму какую-то php библиотеку для постепенной подгрузки нужных файлов, но чем все закончилось я уже не помню. Пока буду играться с консолью в Хроме ))

Аудит js кода, или как избавиться от лишнего? (comment #23789)

alto@hitagi.ru — Wed, 23 Sep 2015 12:13:33 +0300

Ну этот вариант не настолько хорош, как кажется. Если на каждой странице будут уникальный набор скриптов/стилей, то в случае, если они минимизируются и склеиваются, браузеру придётся заново их скачивать, ибо конечный файл будет всегда разным. Это увеличит кол-во трафика и плохо повлияет на скорость загрузки страницы. Сейчас, поскольку всегда используется один и тот же набор скриптов/стилей, склеенный файл не нужно постоянно перегенерировать, он скачивается и кешируется браузером. Таким образом, скорость загрузки страниц увеличивается за счет использования кеша.

Аудит js кода, или как избавиться от лишнего? (comment #23792)

create.nfo@gmail.com — Wed, 23 Sep 2015 12:19:21 +0300

Я понимаю все плюсы и минусы, но пока решение вот такое, и оно не окончательное, буду тестировать.

Аудит js кода, или как избавиться от лишнего? (comment #23802)

vshemarov@gmail.com — Wed, 23 Sep 2015 13:04:33 +0300

Думаю, можно таким способом оптимизировать: общий набор скриптов так и оставить единым для всех страниц, но разбить его на две части — первую (базовую) загружать в хедере, а вторую в футере. И хоть файлов из одного станет два, но на всех страницах они будут одни и те же

Аудит js кода, или как избавиться от лишнего? (comment #23803)

create.nfo@gmail.com — Wed, 23 Sep 2015 13:09:14 +0300

Тоже вариант

Аудит js кода, или как избавиться от лишнего? (comment #23786)

alto@hitagi.ru — Wed, 23 Sep 2015 11:58:40 +0300

А сколько всё это весит в сжатом минимизированном склеенном виде?

Аудит js кода, или как избавиться от лишнего? (comment #23788)

create.nfo@gmail.com — Wed, 23 Sep 2015 12:08:48 +0300

js ужимается до 450-500Kb под гзипом, только толку от этого нет, сайт из динамического превращается в статический )). А так было бы в самый раз.

Аудит js кода, или как избавиться от лишнего? (comment #23790)

alto@hitagi.ru — Wed, 23 Sep 2015 12:15:04 +0300

только толку от этого нет, сайт из динамического превращается в статический ))

в смысле что-то не работает? В стандартных вроде всё нормально. Если конкретно в вашей теме что-то ломается после минификации — надо разобраться и решить проблему.

Аудит js кода, или как избавиться от лишнего? (comment #23791)

create.nfo@gmail.com — Wed, 23 Sep 2015 12:17:50 +0300

После сжатия гзипом весь js отваливается. Но тестирую пока на денвере на локалке. Посмотрим, как будет в сети.

Аудит js кода, или как избавиться от лишнего? (comment #23793)

alto@hitagi.ru — Wed, 23 Sep 2015 12:19:59 +0300

А это сейчас так, или давно пробовал включать? Там были такие проблемы, но они должны быть уже пофикшены.

Аудит js кода, или как избавиться от лишнего? (comment #23794)

create.nfo@gmail.com — Wed, 23 Sep 2015 12:24:19 +0300

Да буквально полчаса назад пробовал включать на версии 1.1.8, увидел что все отвалилось и вернул назад, глубого не копал. Пока с шаблоном вожусь.

Аудит js кода, или как избавиться от лишнего? (comment #23796)

create.nfo@gmail.com — Wed, 23 Sep 2015 12:50:36 +0300

Вот ошибки из консоли hkar.ru/DVda. Возможно, я как-то не так включаю сжатие gzip через конфиги и в админке, но результат налицо ))

Аудит js кода, или как избавиться от лишнего? (comment #23798)

vshemarov@gmail.com — Wed, 23 Sep 2015 12:54:34 +0300

А, вот ты про какое сжатие! Я что-то подумал, что речь про сжатие средствами сервера. Это надо будет проверить

Аудит js кода, или как избавиться от лишнего? (comment #23799)

alto@hitagi.ru — Wed, 23 Sep 2015 12:59:12 +0300

Судя по всему, файлы сжимаются, но браузер не может их разжать. Может быть, используется какой-то плагин для потокового сжатия данных, которое ни в коем случае не должно применяться к сжатым жс-файлам. А может проблема связана с windows или с тем, что денвер устарел и не нужен. У меня (Apache/2.4.7 (Ubuntu), PHP 5.5.9) проблемы нет.

Аудит js кода, или как избавиться от лишнего? (comment #23804)

create.nfo@gmail.com — Wed, 23 Sep 2015 13:15:57 +0300

Ладно, пока остановимся, как сайт в сеть выкачу, будем смотреть. А то не поймешь, кто виновник.

Аудит js кода, или как избавиться от лишнего? (comment #23808)

vshemarov@gmail.com — Wed, 23 Sep 2015 14:46:55 +0300

… тестирую пока на денвере...

Кстати, очень рекомендую вместо денвера вот это: open-server.ru/

А денверу — увы! — пора на свалку истории.

Аудит js кода, или как избавиться от лишнего? (comment #23820)

create.nfo@gmail.com — Thu, 24 Sep 2015 02:18:56 +0300

Спасибо. Надо будет попробовать. Денвер использую больше по привычке. Инталлятор на винте был, я его и установил.

Аудит js кода, или как избавиться от лишнего? (comment #23797)

vshemarov@gmail.com — Wed, 23 Sep 2015 12:52:07 +0300

Насчет gzip'а что-то не понял. На демо-сайте (который собирается с гитхаба при каждом коммите) gzip работает без проблем:

Аудит js кода, или как избавиться от лишнего? (comment #23801)

create.nfo@gmail.com — Wed, 23 Sep 2015 13:03:20 +0300

Вадим, я тестирую пока на локалке. Выкачу в инет, там посмотрим. На локалке я делаю следующее: в админке включаю сжатие js (два верхних чекбокса), потом еще и в конфигах опцию $config['compress']['js']['gzip'] = true; Потом очищаю кеш и js отваливается. Потому как ссылается на файлы /_run/assets/aafd5c7955ebaf44e1e50ed3178c2c21.min.js.gz.js

Аудит js кода, или как избавиться от лишнего? (comment #23812)

1099511627776@mail.ru — Wed, 23 Sep 2015 21:18:28 +0300

Подтверждаю у меня проблема повторилась. на Ubuntu 14.02 и apache 2.4 но думаю что проблема в приписке в админке

Отдача CSS в виде gzip средствами Alto CMS возможна только если в качестве веб-сервера используется apache и для него установлен модуль mod_headers.

the-boss глянь есть ли у тебя и правильно настроено или нет

Аудит js кода, или как избавиться от лишнего? (comment #23819)

create.nfo@gmail.com — Thu, 24 Sep 2015 02:17:17 +0300

В конфигах апача (httpd.conf) включил mod_headers и файлы, сжатые gzipом, заработали. Надо в описание опции в админке добавить предупреждение об этом. Правда, при включении «Отдавать CSS в виде gzip» страницы показываются без стилей. Нужно ковырять правила в .htaccess.

Аудит js кода, или как избавиться от лишнего? (comment #23813)

1099511627776@mail.ru — Wed, 23 Sep 2015 21:27:05 +0300

Так же подтверждаю что если включить mod_headers в апаче то проблема пропадает

Аудит js кода, или как избавиться от лишнего? (comment #23814)

1099511627776@mail.ru — Wed, 23 Sep 2015 21:34:57 +0300

До aVadim раз уж конфиг настолько серверо зависимый то предлагаю предусмотреть там и работу с nginx и его настройкой gzip_static при включении которой оно будет искать файл .js.gz и отдавать его вместо .js с пометкой о сжатии, это разгрузит апач которому итак есть чем заняться (скорее всего хватит подправить файл PackageJs (PackageCss) строчка 100 или 126 (и аналогичная в CSS ках))

Аудит js кода, или как избавиться от лишнего? (comment #23816)

ivpst@hotmail.com — Thu, 24 Sep 2015 01:01:28 +0300

Поддерживаю. Сервер на nginx…

Аудит js кода, или как избавиться от лишнего? (comment #23821)

create.nfo@gmail.com — Thu, 24 Sep 2015 02:25:57 +0300

С настройкой $config['compress']['js']['gzip'] = true; я тупанул, она включается и через админку, конфиги можно не трогать.

Аудит js кода, или как избавиться от лишнего? (comment #23800)

ivpst@hotmail.com — Wed, 23 Sep 2015 13:00:09 +0300

Очень интересная тема.
Поддерживаю. Хотелось бы вырезать из Альто все, что не нужно и по надобности подключать.
Чем быстрей загружается и меньше весит тема, тем лучше для ПС.

Аудит js кода, или как избавиться от лишнего? (comment #23805)

vshemarov@gmail.com — Wed, 23 Sep 2015 13:20:00 +0300

Вообще, в плане оптимизации скриптов — поле непаханное.

Например, кроме разбивки на два блока скриптов, как писал выше в комментах (т.е. что-то грузим в хедере, что-то в футере), можно (нужно) еще поэкспериментировать с атрибутами defer и async, объединяя скрипты в группы с одинаковыми атрибутами. Например, если используется какой-то скрипт без зависимостей — можно смело ему ставить async — пусть браузер сам решает, когда его грузить и выполнять. А jquery-плагины можно объединять в группу с defer, подключая их после jquery.

Аудит js кода, или как избавиться от лишнего? (comment #23806)

ivpst@hotmail.com — Wed, 23 Sep 2015 14:33:27 +0300

Было бы неплохо добавить такую возможность в админку в новом обновлении.

Аудит js кода, или как избавиться от лишнего? (comment #23807)

vshemarov@gmail.com — Wed, 23 Sep 2015 14:42:18 +0300

Нет, такие настройки в админку выносить смысла нет. Это надо в конфигах/ассетах скинов явно прописывать.

Аудит js кода, или как избавиться от лишнего? (comment #23809)

as12478@bk.ru — Wed, 23 Sep 2015 15:56:08 +0300

Можно вопрос.

Да, и в качестве дружеского совета хотел бы предупредить, если у вас нет знаний в веб разработке, то лучше не используется на своих сайтах шаблон Experience Simple.

А с чем это связано? На какие трудности можно напороться?

Аудит js кода, или как избавиться от лишнего? (comment #23817)

create.nfo@gmail.com — Thu, 24 Sep 2015 01:53:18 +0300

Все недостатки сразу и не вспомню. Вот лишь малая часть: во-первых, он очень тяжелый, во-вторых, избыточен, некоторые правила повторяются сначала в style.experience.min.css (68Kb), потом theme.default.css (91Kb) и в конце еще и в style.bootstrap.min.css (205Kb), в-третьих, перегружен сомнительным функционалом, например, для выпадающего меню сделан эффект анимации и затухания, за красивости расплачиваемся 124Kb кодом в hover.css, за такое руки отрубать надо, изменен календарь для выбора даты, который ничем не лучше стандартного из jquery-ui, при этом старый функционал не выпелен полностью, зато поверх добавлен новый (+21Kb), со всеми вытекающими последствиями, в-четвертых, частично переписан стандартный js темы, который работал со времен LS, а теперь не работает, например, сворачивание и разворачивание комментариев. Кто неопытен или кому нравятся свистоперделки, тому шаблон самый раз. Но все это чаще всего не нужная мишура.

Аудит js кода, или как избавиться от лишнего? (comment #23823)

as12478@bk.ru — Thu, 24 Sep 2015 11:08:05 +0300

Спасибо! Задумался. Хотел именно этот шаблон переделывать под свой…

Аудит js кода, или как избавиться от лишнего? (comment #23830)

lifecom@hotmail.com — Thu, 24 Sep 2015 21:42:22 +0300

Забираем с CDN, если не «тянется» даем свой. Пример

Аудит js кода, или как избавиться от лишнего? (comment #23852)

vshemarov@gmail.com — Sat, 26 Sep 2015 10:41:27 +0300

Решение хорошее, но только когда вручную верстаешь сайт целиком и руками прописываешь скрипты. А тут ведь скрипты собираются подключаются самим движком. Конечно, можно подумать о том, чтоб в описании ассетов как-то задавать условия и альтернативный вариант подключения, но как-то уж очень навороченно получается