Тенденции. 2014. 2015...

Board index Общие разделы Оффтопик

Description: Здесь можно обсудить всё, что не связано с тематикой сайта.
Moderator: Поддержка

Post #61by factotum » 23.07.2014, 17:59

Sumanai wrote:Но не вижу, почему это конструкция подключения скрипта напрямую в страницу в одночасье устарела
есть два метода загрузить скрипт асинхронно. Надеюсь,понимание зачем, найдется.
1. Добавить в тег объявления скрипта атрибут async. Работает это прекрасно, но до тех пор, пока нет зависимостей. Например, в своих проектах первым объявляю Modernizr. За ним идет несколько глобальных переменных, используемых во всех скриптах, объявляемых ниже. Например:
Code: Select all
// event trigger after animation/transition end.
vralle.transitionEndEventName = transitionEndEventNames[Modernizr.prefixed('transition')];
vralle.animationEndEventName  = animationEndEventNames[Modernizr.prefixed('animation')];
// click or touch event
vralle.btnPressedEvent = (Modernizr.touch) ? 'touchstart' : 'click';
при асинхронной загрузке скриптов нет гарантий того, что скрипт, например, лайтбокса загрузиться позже Modernizr и определения глобальных переменных. Для решения этого вопроса нам придется либо отказаться от асинхронной загрузки. Либо свалить все скрипты в один файл с определением зависимостей уже в нем. Либо прибегнуть к второму методу асинхронной загрузки - через соответствующие библиотеки.
2. Подгружаем загрузчик. Как правило это 2-3кб. Подгружаем файл с зависимостями. Загрузчик загружает необходимые скрипты асинхронно, не блокируя рендеринг страницы. Исполняет скрипты в соответствии с объявленными зависимостями. При обильном использовании JS в проекте, выигрыш во времени загрузки может составлять 1-5 секунд.
Как-то так...
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #62by Sumanai » 23.07.2014, 18:31

factotum wrote:1. Добавить в тег объявления скрипта атрибут async.

Есть же defer. Он сохраняет порядок подключения. Страдает только опера 12, но она устарела и скоро помрёт.

factotum wrote:Например, в своих проектах первым объявляю Modernizr.

Его можно грузить синхронно, он небольшой.
Можно определить минимальное ядро приложения, и грузить его первым, а остальное- индивидуально для групп страниц, асинхронно.
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1608
With us: 4 yaers 9 months

Post #63by factotum » 23.07.2014, 18:37

немного картинок:
Эта страница:
screenshot.106.jpg

Если не считать, что стили отказываются кешироваться, то данные загрузки примерно таковы:
страница была отдана на 600мс
DomContentLoader сработал сработал 1.05 ( примерно через 400мс после загрузки тела )
Полная загрузка страницы и окончательный рендеринг на 2.87 ( примерно через 2.27с после загрузки тела)
Итого тело -> загрузка страницы = 2.27с
Все это на 62 запроса и 43кб

Пример с асинхронной загрузкой:
screenshot.107.jpg

Медленный сервер отдал страницу на 1.56с (все никак не подружу мускул с ipv6)
DomContentLoader сработал сработал 1.84с ( примерно через 280мс после загрузки тела )
Полная загрузка страницы и окончательный рендеринг на 2.15с ( примерно через 0.6с после загрузки тела)
Итого тело -> загрузка страницы = 0.6с
Все это на 93 запроса и 533кб! При отдаче тела страницы на 0.6с, пользователь получает страницу через 1.2с после рефреша. В первом варианте - через 2.87с

Вот такое вот почти реальное сравнение
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #64by VEG » 23.07.2014, 19:27

factotum wrote:Если не считать, что стили отказываются кешироваться
Стили отлично кэшируются. При нормальных переходах между страницами делается в среднем два запроса, один из которых — счётчик:
Image
С наилучшими пожеланиями, Евгений
VEG M
Администратор
Avatar
Age: 30
Location: Минск, Беларусь
Reputation: 1574
With us: 5 years 6 months

Post #65by factotum » 23.07.2014, 20:15

VEG, хром с Вами не согласен.

Firefox 31:
Added after 6 minutes 18 seconds:
screenshot.108.jpg

Встроенная панель разработчика Firefox так же отдает вопросительные данные

firebug:
screenshot.109.jpg

screenshot.111.jpg
Last edited by factotum on 23.07.2014, 20:29, edited 1 time in total.
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #66by Sumanai » 23.07.2014, 20:28

factotum wrote:Встроенная панель разработчика Firefox

У меня 3-4 раза грузит :eek: Что встроенная что файрбаг. Точно помню что раньше было всё нормально. Хотя вот только что на 31 версию обновился. Может там глюк?

Added after 2 minutes 28 seconds:
Sumanai wrote:Что встроенная что файрбаг.

А, нет, ситуация интереснее. Включение встроенной панели заставляет грузить стиль по несколько раз, как по показаниям встроенной панели, так по файрбагу. В файрбаге, если его включить отдельно, всё нормально.
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1608
With us: 4 yaers 9 months

Post #67by factotum » 23.07.2014, 20:31

Sumanai wrote:Может там глюк?
Тогда FF глючит в паре с Хромом. В любом случае, мои картинки сравнения сделаны в одном браузере и одинаковой настройкой
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #68by Sumanai » 23.07.2014, 20:33

factotum, вы видимо нажимаете F5. Если просто переходить по страницам, то перезагрузки не будет.
Но вот почему /style.php не отдаёт 304 код, это отдельный вопрос, скорее всего действительно баг.

factotum wrote:Тогда FF глючит в паре с Хромом.

Пояснил выше.
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1608
With us: 4 yaers 9 months

Post #69by VEG » 23.07.2014, 20:37

factotum, в Chrome тоже всё ок. Учитывайте, что при нажатии F5 (даже без Ctrl) браузер всегда отсылает запросы мимо кэша, просто при нажатом Ctrl серверу не даётся возможности сообщить барузеру, чтобы он использовал версию файла из кэша (If-Modified-Since не отсылается). При обычных переходах то, что лежит в кэше, он не спрашивает. То есть кликайте, например, по разным страницам темы, чтобы смотреть, какие запросы отсылаются при переходах между страницами и что отвечает сервер на это.

Added after 2 minutes 11 seconds:
Sumanai wrote:Но вот почему /style.php не отдаёт 304 код, это отдельный вопрос, скорее всего действительно баг.
На сколько я помню, там такой логики нет. Надо будет изучить этот вопрос.
С наилучшими пожеланиями, Евгений
VEG M
Администратор
Avatar
Age: 30
Location: Минск, Беларусь
Reputation: 1574
With us: 5 years 6 months

Post #70by factotum » 23.07.2014, 20:40

VEG wrote:Учитывайте, что при нажатии F5
простите. чтобы следить за беседой на этой странице, мне пришлось много раз кликать F5. Я поступаю не правильно?
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #71by VEG » 23.07.2014, 20:42

factotum, всё-таки пользователи чаще переходят со страницы на страницу, нежели нажимают F5. Так что проблема невелика. Всё равно F5 всегда медленне, чем обычный переход, и даже 304 код для style.php не исправит это.
С наилучшими пожеланиями, Евгений
VEG M
Администратор
Avatar
Age: 30
Location: Минск, Беларусь
Reputation: 1574
With us: 5 years 6 months

Post #72by factotum » 23.07.2014, 20:45

VEG wrote:всё-таки пользователи чаще переходят
если бы это был сугубо информационный ресурс, согласился бы. Но показалось, эта беседа с вытекающими F5- как раз то, что называют форумом :smile:

Added after 3 minutes 31 second:
VEG wrote:If-Modified-Since не отсылается
а разве вина тому не обработка запросов через php с параметрами в линке?
ок. сейчас в инете через провода. а как беседовать с мобилки? трафик, время, батарея?

Added after 4 minutes 5 seconds:
возвращаясь к повести выше: /viewtopic.php?p=13822#p13822
Один браузер. Оба скрина по F5. Оба в одном браузере. Разная организация загрузки ресурсов = Разное поведение. О чем и была повесть :)
Last edited by factotum on 23.07.2014, 20:54, edited 1 time in total.
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #73by Sumanai » 23.07.2014, 20:54

VEG wrote:и даже 304 код для style.php не исправит это.

Исправит загрузку 18 кб и трату ресурсов на сжатие :smile:

Added after 1 minute 37 seconds:
factotum wrote:а разве вина тому не обработка запросов через php с параметрами в линке?

Да нет. Я где- то видел 304 ответ от файла стилей, но там явно кастомный код.

factotum wrote:Разная организация загрузки ресурсов. Поведение разное.

Как и сами скрипты разные. Там всё разное, и сравнивать их нельзя.
Вот перепишите phpBBex под асинхронный код, тогда и сравним :toothless:
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1608
With us: 4 yaers 9 months

Post #74by factotum » 23.07.2014, 21:04

Sumanai wrote:Вот перепишите phpBBex под асинхронный код, тогда и сравним
мне есть что переписывать. и переписанное работает :)
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #75by VEG » 23.07.2014, 21:10

Всё, теперь style.php умеет отдавать 304 ответ :)
С наилучшими пожеланиями, Евгений
VEG M
Администратор
Avatar
Age: 30
Location: Минск, Беларусь
Reputation: 1574
With us: 5 years 6 months

Post #76by factotum » 23.07.2014, 21:22

VEG wrote:Всё, теперь style.php умеет отдавать 304 ответ :)
подтверждаю. 304 для стилей и в хроме, и в фф.
screenshot.112.jpg

время срабатывания таймера DCL сократилось с 400мс до 250мс. Соответственно и таймер загрузки страницы. Еще немного в этом направлении и можно будет получить страницу через 0.7-0.8с :)
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #77by factotum » 24.07.2014, 08:01

http://wptavern.com/hashcash-io-reveals-strategy-for-capitalizing-on-spammers
Hashcash.io Reveals Strategy for Capitalizing on Spammers

Added after 1 hour 12 minutes:
скорее для phpbbex при использовании Google CDN:
Code: Select all
<meta http-equiv="x-dns-prefetch-control" content="on">
<link rel="dns-prefetch" href="//ajax.googleapis.com">
при отсутствии в кеше DNS, позволяет убрать задержки на поиск хоста

Added after 31 minute 48 seconds:
подытоживая вчерашний разговор о распараллеливании загрузки ресурсов, уже давно не новая статья Михаила Давыдова, подробно освящающая данный вопрос: http://habrahabr.ru/post/145269/
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #78by factotum » 25.07.2014, 16:15

factotum wrote:Привет require.js, Webpack, browserify, LMD
пообщался с browserify. Это счастье! (с). Проект собирается проще простого.
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #79by Sumanai » 25.07.2014, 17:56

factotum wrote:при отсутствии в кеше DNS, позволяет убрать задержки на поиск хоста

Сейчас это не даст результата, так как джейквери подключается почти в самом верху. А вот для 3.1, где скрипты подключаются в конце body, это актуально.
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1608
With us: 4 yaers 9 months

Post #80by factotum » 25.07.2014, 19:11

Sumanai wrote:где скрипты подключаются в конце body
Вроде тысяча и один раз доказано, что загрузка jQ в хиде менее болезнена, чем ниже. Может что-то изменилось? :spy:
Last edited by factotum on 25.07.2014, 19:13, edited 1 time in total.
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

PreviousNext

Return to Оффтопик