Друзья, кто-нибудь решал вопрос асинхронной загрузки? Сайт жутко тормозит, в первую очередь из-за кучи скриптов и таблиц стилей, Сделал асинхронную загрузку через скрипт гугла Код: <script src="http://extsrcjs.googlecode.com/svn/trunk/extsrc.js"></script> <script type="text/javascript" extsrc="catalog/view/javascript/jquery/jquery-1.7.1.min.js"></script> Но во-первых это решило только вопрос с загрузкой js а стили все так же тормозят. Во-вторых, джаваскрипт все-равно грузится достаточно долго, грузятся последовательно и png загружаются все так же после загрузки всех js, хотя скорость в целом выросла, но хотелось бы результат лучше. Скрипты и стили сжимал, все что определил как лишнее и ненужное удалил. 1)Как подгружать css асинхронно? 2)Может быть есть другие варианты борьбы с тормозами такого плана? 3)Почему png все-равно грузятся после загрузки js? Вообще, есть подозрение что в js много левоты, которая не используется на сайте вообще. К примеру я удалил процентов 70 jquery.colorbox.js (кажется) - и все работает так же как и работало, так же и скрипт меджикзум+ имеет просто огромный размер, но при этом подключается на все страницы, хотя и используется только на странице товара. Да и само содержимое скрипта наверняка не все используется.
Исправьте ссылки для jquery и jqueryUI на ссылки с Google Hosted Libraries. Можно подгрузить css для colorbox и другие чуть позже, с помощью чистого JavaScript либо скрипта http://yepnopejs.com/ (с js он тоже работает) Объедините css файлы, которые используются на всех страницах, в один. Чтобы меджикзум+ загружался только на странице продукта нужно открыть контроллер catalog/controller/product/product.php в самой первой функции index() добавить PHP: $this->document->addScript('catalog/view/javascript/jquery/tabs.js');# только путь смените Вопрос по png - они из стилей или скриптов? или со страницы (img) ?
Спасибо за ответ, итак по порядку: 1) тоже наткнулся на скрипт yepnope, интересно описывается все, попробую им воспользоваться. 2) тоже решил объединить css + нашел плагин Dust Me Selrctors для лисы - который помогает удалить неиспользуемые селекторы из css - у него есть один минус - если используется кроссплатформенная верстка то может отметить как лишние нужные поля. Надо аккуратно удалять. 3) Меджикзум вынес только на страницу продукта таким образом Код: <?php echo $header; ?> <link type="text/css" href="admin/controller/module/magictoolbox/magiczoomplus.css" rel="stylesheet" media="screen" /> <script type="text/javascript" src="admin/controller/module/magictoolbox/magiczoomplus.js"></script> т.е. в макет, но предложеный способ нравится больше, попробую, спасибо. 4) картинки png из стилей
Картинки можно кодировать в data:base64 и вставить прямо в css, это избавит Вас от лишних запросов к серверу. --- Добавлено, 29 дек 2013 --- Кстати, если сервер Apache и он настолько слабый, что приходится все оптимизировать могу посоветовать настойки .htaccess.
На самом деле желание все оптимизировать вызвано желанием освоить этот процесс, в первую очередь, процентов 60 сайтов в сети работают еще медленнее, и не парятся. Итак, подведу промежуточный итог, все стили слил в один мегадокумент, в него же записал картинки через base64. Надо сказать что премиум шаблоны, перегружены стилями и скриптами, что тормозит нереально работу сайта. На входе было штук 12 css после того как слил в один файл, пробежался плагином Dust Me Selrctors - про него хочу сказать что он божественен. на самом деле им надо просто правильно пользоваться, надо побегать по сайту, так чтобы он зацепил все задействованные стили, в результате он выдает файл, в котором все лишние селекторы закомментированы - полученный файл прогоняем сервисом сжатия css и на выходе получил файл в 2 раза меньший чем изначальный. Уже сами манипуляции с css дали прирост скорости. Изменения в конфигурационном файле не дали изменений, у меня джино, скорее всего там запрещено сжатие. Прошу немного растолковать как использовать yepnope - в сети не нашел ни одного примера с готовым кодом, вот так сейчас у меня выглядит содержание хедера Код: <link rel="stylesheet" type="text/css" href="catalog/view/theme/<?php echo $this->config->get('config_template'); ?>/stylesheet/dw.css" /> <script type="text/javascript" src="catalog/view/javascript/jquery/jquery-1.7.1.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> <script type="text/javascript" src="catalog/view/javascript/jquery/ui/external/jquery.cookie.js"></script> <script type="text/javascript" src="catalog/view/javascript/jquery/colorbox/jquery.colorbox.js"></script> <script type="text/javascript" src="catalog/view/javascript/jquery/tabs.js"></script> <script type="text/javascript" src="catalog/view/javascript/fast_order.js"></script> <script type="text/javascript" src="catalog/view/theme/<?php echo $this->config->get('config_template'); ?>/js/jquery.selectbox-0.2.js"></script> <script type="text/javascript" src="catalog/view/theme/<?php echo $this->config->get('config_template'); ?>/js/jquery.elastislide.js"></script> <script type="text/javascript" src="catalog/view/theme/<?php echo $this->config->get('config_template'); ?>/js/AC_RunActiveContent.js"></script> <script type="text/javascript" src="catalog/view/theme/<?php echo $this->config->get('config_template'); ?>/js/custom.js"></script> <!--[if !IE]><!--> <script>if(/*@cc_on!@*/false){document.documentElement.className+='ie10';}</script> <!--<![endif]--> <!--обратный звонок--> <script type="text/javascript" src="/callme/js/callme.js"></script> - Буду признателен если покажете пример внедрения, у меня что-то не получилось. Проводил эксперимент со сваливанием js в один файла - получается фигня, такой файл грузится еще дольше. когда прикручивал асинхронную загрузку через гугловский скрипт, выяснилось что далеко не все скрипты можно отсрочить, например у меня товары в категории выводятся через скрипт js - который не показывает товары при асинхронной загрузке пока не сделать в категории действий (смена сортировки, типа отображения) при этом самые тяжелые скрипты убрать в асинхронную не получается, например библиотеку jq. насколько я понял yepnope решает эту проблему?
