Форум успешных вебмастеров - GoFuckBiz.com

  Форум успешных вебмастеров - GoFuckBiz.com > Бизнес-решения > Скрипты, программы и технические решения
Дата
USD/RUB58.6370
BTC/USD0.0000
Скрипты, программы и технические решения Обсуждаем скрипты, программы и новые технологии.

Закрытая тема
Опции темы Опции просмотра
Старый 01.08.2014, 07:55   #1
chesser
автоматизирую интернеты
 
Аватар для chesser
 
Регистрация: 05.07.2009
Адрес: chesser.ru
Сообщений: 3,382
Бабло: $470735
Question Как подключать jquery и другие js/css на сайте?

сабж, надо чтобы сайт не тормозил.

В данный момент использую такую схему:

More

Порядок загрузки примерно следующий:
1) начало загрузки html
2) загрузка css через CDN или из клиентского кеша
3) загрузка html, начало отрисовки элементов, подгрузка и запуск js-кода, который не использует DOM, асинхронный вызов js
4) синхронная загрузка jquery
5) загрузка дополнительных CSS
6) асинхронная подгрузка доп. скриптов
7) конец загрузки html
8) DOM-построен
9) выполнение всяких $(document).ready(function(){.....}) , зависящих от DOM

в этой схеме не нравится 4-ый пункт, имхо лучше грузить jquery асинхронно, но тогда начнутся "гонки" скриптов, ждущих $(document).ready

смотрю в сторону js-лоадеров, выбираю.

дык как подключать jquery?
__________________
USA и NL серверы и VPS | wiki | блог | Drupal | NginxТДС
Ave, Google, morituri te salutant! © chesser
chesser вне форума  
Старый 01.08.2014, 09:13   #2
flo0
Senior Member
 
Аватар для flo0
 
Регистрация: 24.04.2007
Адрес: Красноярск
Сообщений: 352
Бабло: $48790
По умолчанию

а зачем так голову морочить, что улучшит асинхронная загрузка jquery?
__________________
PharmCash - Лучшие условия и профит в фарме. Hold-0, Refunds-0, Commission–50%, CPU+500. Google нас любит!
flo0 вне форума  
Старый 01.08.2014, 09:23   #3
chesser
автоматизирую интернеты
 
Аватар для chesser
 
Регистрация: 05.07.2009
Адрес: chesser.ru
Сообщений: 3,382
Бабло: $470735
ТС -->
автор темы ТС По умолчанию

Цитата:
Сообщение от flo0 Посмотреть сообщение
а зачем так голову морочить, что улучшит асинхронная загрузка jquery?
тут два вопроса:

Цитата:
Сообщение от flo0 Посмотреть сообщение
а зачем так голову морочить
этим занимаются многие крупные проекты, сайты-приложения и тд.
Гугл постоянно выпускает все новые и новые статьи типа такой:
https://developers.google.com/speed/...s/mobile?hl=ru - 4-ый пункт

Цитата:
Сообщение от flo0 Посмотреть сообщение
что улучшит асинхронная загрузка jquery?
увеличит скорость "прогрузки" страницы и скорость появления статической картинки. Для медленного (мобильного) интернета это актуально.

а что хорошего в блокирующем javascript?
__________________
USA и NL серверы и VPS | wiki | блог | Drupal | NginxТДС
Ave, Google, morituri te salutant! © chesser
chesser вне форума  
Старый 01.08.2014, 09:38   #4
flo0
Senior Member
 
Аватар для flo0
 
Регистрация: 24.04.2007
Адрес: Красноярск
Сообщений: 352
Бабло: $48790
По умолчанию

В примере яваскрипт загружается в конце, т.е. картинка уже будет. Jquery грузится с другого домена, т.е. уже типа параллельно + это сеть доставки и кеш валяется практически в соседнем подъезде. То есть борьба идет за доли секунд наверное?
__________________
PharmCash - Лучшие условия и профит в фарме. Hold-0, Refunds-0, Commission–50%, CPU+500. Google нас любит!
flo0 вне форума  
Старый 01.08.2014, 10:01   #5
SoftMaster
я крут як root
 
Аватар для SoftMaster
 
Регистрация: 28.05.2012
Адрес: HTTPHEADER
Сообщений: 333
Бабло: $49360
По умолчанию



Сначала один ресурс 600 мс, потом второй 600 мс. Параллельно, но вдруг один начнет тормозить и неважно на каком быстром сервере сайт.
Видел где-то плагины, которые собирают все скрипты и стили в одни файлы.
SoftMaster вне форума  
Старый 01.08.2014, 10:43   #6
chesser
автоматизирую интернеты
 
Аватар для chesser
 
Регистрация: 05.07.2009
Адрес: chesser.ru
Сообщений: 3,382
Бабло: $470735
ТС -->
автор темы ТС По умолчанию

Цитата:
Сообщение от flo0 Посмотреть сообщение
В примере яваскрипт загружается в конце, т.е. картинка уже будет. Jquery грузится с другого домена, т.е. уже типа параллельно + это сеть доставки и кеш валяется практически в соседнем подъезде.
Тот вариант, который я предложил работает нормально, не зря я с ним экспериментировал несколько дней. Время загразки страницы визуально возросло раза в 2-4 наверно, а в опере вообще раз в 20.

но т.к. в моем примере jquery грузится синхронно, то в месте ее загрузки процесс отрисовки контента остановится, все будут ждать конца загрузки и интерпретации jquery.js. Если и этот файл грузить асинхронно, то все ваще будет супер.

Цитата:
Сообщение от flo0 Посмотреть сообщение
То есть борьба идет за доли секунд наверное?
конечно за доли секунды. Сайты, которые грузятся более 1 секунды, можно смело назвать говном.
Это и делают посетители медленных сайтов, выбирая более быстрые, поэтому пару лет назад началась эта гонка за доли секунды.
__________________
USA и NL серверы и VPS | wiki | блог | Drupal | NginxТДС
Ave, Google, morituri te salutant! © chesser
chesser вне форума  
Старый 01.08.2014, 11:17   #7
flo0
Senior Member
 
Аватар для flo0
 
Регистрация: 24.04.2007
Адрес: Красноярск
Сообщений: 352
Бабло: $48790
По умолчанию

Если перенести в шапку custom.css, то отрисовка контента не остановится, т.к. страница разбирается последовательно.

А если использовать загрузчик, то не потратятся ли на его разбор и исполнение те-же доли секунды, которые ранее шли на jquery.

Под долями секунд я имею ввиду максимум сотые, если ли бы десятые то и вопросов не было.
__________________
PharmCash - Лучшие условия и профит в фарме. Hold-0, Refunds-0, Commission–50%, CPU+500. Google нас любит!
flo0 вне форума  
Старый 01.08.2014, 11:35   #8
chesser
автоматизирую интернеты
 
Аватар для chesser
 
Регистрация: 05.07.2009
Адрес: chesser.ru
Сообщений: 3,382
Бабло: $470735
ТС -->
автор темы ТС По умолчанию

Цитата:
Сообщение от flo0 Посмотреть сообщение
Если перенести в шапку custom.css, то отрисовка контента не остановится, т.к. страница разбирается последовательно.
да, можно. Но в том виде, как сейчас, мне больше понравилось, причину точную подзабыл: либо большой размер custom.css, либо я погнался за этой штукой, либо опера чудила

Цитата:
Сообщение от flo0 Посмотреть сообщение
А если использовать загрузчик, то не потратятся ли на его разбор и исполнение те-же доли секунды, которые ранее шли на jquery.
загрузчики обычно занимают пару килобайт....ну я собственно и интересуюсь эффектом. Может какие-то популярные веб-фреймворки их используют? (В друпале, например, есть модули для labjs и headjs(или requirejs), я пробовал включать на одном сайте, но не сильно помогло, потому что в js скриптах темы такой бардак, что эти лоадеры почти бессильны)
__________________
USA и NL серверы и VPS | wiki | блог | Drupal | NginxТДС
Ave, Google, morituri te salutant! © chesser
chesser вне форума  
Старый 01.08.2014, 12:04   #9
xanxy
Senior Member
 
Регистрация: 18.08.2010
Сообщений: 361
Бабло: $66100
По умолчанию

Меня как юзера больше бесит не скорость загрузки, а когда элементы начинают перемещатся во время загрузки страницы. Или когда элемент уже отобразился, но не работает. Я так понимаю это как раз случай когда jquery грузится после основного html

> этим занимаются многие крупные проекты, сайты-приложения

У крупных проектов немного другие заботы, чем у вебмастеров
xanxy вне форума  
Старый 01.08.2014, 13:11   #10
editeur
Senior Member
 
Регистрация: 27.09.2013
Сообщений: 620
Бабло: $89330
По умолчанию

Я проводил подобные эксперименты с шопом в зоне ру.
Первоначальная скорость загрузки шопа на конверт не влияет, если она в разумных пределах.
Если начинают тормозить повторные операции - открытие другой страницы шопа, нажатие на кнопку 'купить', просмотр корзины - посетители уходят, конверт падает.

Поэтому насчет подгрузки скриптов вывод следующий - не заморачиваться. Просто убедиться что они кешируются, что к ним там рэндом гет-параметром не приписывается, как это любят делать некоторые. Если подключать jquery с cdn гугла есть хороший шанс на то, что скрипт уже будет закеширован у посетителя даже при его первом хите.

Перенос css/js прямо в кол документа нецелесообразен - не будет кеширования, все это богатство будет грузиться заново при каждой перезагрузке страницы. Имеет смысл собирать js и css из нескольких файлов в один большой. Но опять же, это все мелочи по сравнению с БД и keep-alive в HTTP 1.1 сводит проблему множества мелких файлов к минимуму. Что еще там можно придумать... ну gzip на вебсервере должен быть включен чтобы соптимизировать трафик.

Оптимизировать надо в первую очередь корзину и другие операции с БД. По возможности выносить их в асинхронный ajax, чтобы не было перезагрузки страницы. Смотреть, чтобы шоп не делал 100500 запросов к БД на одну операцию обновления страницы.
editeur вне форума  
Закрытая тема



Опции темы
Опции просмотра