Веб скорость ЛС

А вы знаете, что:

Размер главной страницы ЛС составляет 342,78 кб!!! из которых:
— HTML: 11,87 кб
— HTML Images: 219,25 кб
— CSS Images: 34,09 кб
— Total Images: 253,34 кб
— Javascript: 65,24 кб
— CSS: 12,33 кб
Время загрузки страницы ужасное:
— 14.4K: 284.67 seconds
— 28.8K: 151.83 seconds
— 33.6K: 132.86 seconds
— 56K: 87.31 seconds
— ISDN 128K: 39.92 seconds
— T1 1.44Mbps: 20.82 seconds

Оптимизация внутренней структуры ядра — дело благое, но и про веб скорость забывать негоже!

Еще из отчёта:

TOTAL_HTMLCongratulations, the total number of HTML files on this page (including the main HTML file) is 1 which most browsers can multithread. Minimizing HTTP requests is key for web site optimization. Y

TOTAL_OBJECTS — Warning! The total number of objects on this page is 95 which by their number will dominate web page delay. Consider reducing this to a more reasonable number. Above 20 objects per page the overhead from dealing with the actual objects (description time and wait time) accounts for more than 80% of whole page latency. See Figure II-3: Relative distribution of latency components showing that object overhead dominates web page latency in Website Optimization Secrets for more details on how object overhead dominates web page latency. Combine, refine, and optimize your external objects. Replace graphic rollovers with CSS rollovers to speed display and minimize HTTP requests. Consider using CSS sprites to help consolidate decorative images. Using CSS techniques such as colored backgrounds, borders, or spacing instead of graphic techniques can reduce HTTP requests. Replace graphic text headers with CSS text headers to further reduce HTTP requests. Finally, consider optimizing parallel downloads by using different hostnames or a CDN to reduce object overhead.

TOTAL_IMAGES — Warning! The total number of images on this page is 69, consider reducing this to a more reasonable number. Recommend combining, replacing, and optimizing your graphics. Replace graphic rollover menus with CSS rollover menus to speed display and minimize HTTP requests. Consider using CSS sprites to help consolidate decorative images. Use CSS techniques such as colored backgrounds, borders, or spacing instead of graphic techniques to reduce HTTP requests. Replace graphic text headers with CSS text headers to further reduce HTTP requests. Finally, consider optimizing parallel downloads by using different hostnames to reduce object overhead.

TOTAL_CSS — Warning! The total number of external CSS files on this page is 8, consider reducing this to one or two external files. Combine, refine, and optimize your external CSS files. Ideally you should have one (or even embed CSS for high-traffic pages) on your pages. You can optimize CSS files using shorthand properties, grouping, and then minify and GZIP compress them to reduce their footprint. Remember to place CSS files in the HEAD and JavaScript files at the end of the BODY to enable progressive display.

TOTAL_SIZE — Warning! The total size of this page is 342776 bytes, which will load in 87.31 seconds on a 56Kbps modem. Consider reducing total page size to less than 100K to achieve sub 20 second response times on 56K connections. Pages over 100K exceed most attention thresholds at 56Kbps, even with feedback. Consider optimizing your site with Website Optimization Secrets, Speed Up Your Site or contacting us about our optimization services.

TOTAL_SCRIPT — Warning! The total number of external script files on this page is 17, consider reducing this to a more reasonable number. Combine, refactor, and minify to optimize your JavaScript files. Ideally you should have one (or even embed scripts for high-traffic pages) on your pages. Consider suturing JavaScript files together at the server to minimize HTTP requests. Placing external JavaScript files at the bottom of your BODY, and CSS files in the HEAD enables progressive display in XHTML web pages.

HTML_SIZECongratulations, the total size of this HTML file is 11869 bytes, which less than 50K. Assuming that you specify the HEIGHT and WIDTH of your images, this size allows your HTML to display content in under 10 seconds, the average time users are willing to wait for a page to display without feedback.

IMAGES_SIZE — Warning! The total size of your images is 253343 bytes, which is over 100K. Consider switch graphic formats to achive smaller file sizes (from JPEG to PNG for example). Finally, substitute CSS techniques for graphics techniques to create colored borders, backgrounds, and spacing.

SCRIPT_SIZE — Warning! The total size of external your scripts is 65238 bytes, which is over 20K. Consider optimizing your JavaScript for size, combining them, and using HTTP compression where appropriate for any scripts placed in the HEAD of your documents. You can substitute CSS menus for JavaScript-based menus to minimize or even eliminate the use of JavaScript.
CSS_SIZE — Caution. The total size of your external CSS is 12326 bytes, which is above 8K and less than 20K. For external files, ideally keep them less than 1160 bytes to fit within one higher-speed TCP-IP packet (or an approximate multiple thereof). Consider optimizing your CSS and eliminating features to reduce this to a more reasonable size.

22 комментария

avatar
инфа конечно полезная, спасибо, есть над чем задумаццо, но…
у меня 1мбит, грузится за 5 секунд, а не за 20…
avatar
Полностью с вами согласен. Вообще уже давно стало ясно, что клиентская оптимизация порой более важная чем серверная.
В качестве временного решения можно объеденить внешние JS скрипты в один файл и тоже самое с CSS файлами. Времени работы вам на 15 мин, а результат будет значительный.
  • t3x
  • 0
avatar
конечно знаем!
только размер страницы никак не является аргументом и мал имеет отношение к реалиям.
340кб размер главной страницы, из них 220кб это вес картинок загруженных в топиках… К слову, вес этих картинок может достигать и нескольких мегобайт, всё зависит от того, что вставляют пользователи в свои топики.
Например, вес главной nnm.ru больше 1мб, а habr.ru больше 600кб.
С чем согласен так это с большим количеством JS файлов, но это и многое другое решается использованием вебоптимайзером от webo.in, правда наблюдаются небольшие глюки совместимости, но это мы поправим в ближайшее время.
  • ort
  • +1
avatar
Вот от тормозах js и речь. Я пробовал ставить ЛС на разные хостинги, в т.ч. и на выделенный сервак в Норвегии. Везде один итог — медленно грузится js даже при пустой главной. Почему — х.з. Вроде 65 кб немного. Наверное, из-за количества файлов.
avatar
Вот от тормозах js и речь.
читая топик такого чувства не возникает, скорее он написан о «большом» размере страницы. Причем с копи-пастом тонны буржуйского текста. Тебе понятно что там написано? Если да, то опиши суть на русском, если нет, то зачем он здесь?
65кб — это сжатый в gzip, так он весит 250кб — нужно правильно настроить свой сервер
avatar
Ааа. Вот почему он так долго грузится! У мну нет gzip'а не сервере. :(

Размер страницы — первое, что бросается в глаза.
Второе — количество скриптов js. 17 штук. Много. Размер общий тоже рекомендуют не больше 20 кб. У нас 65 кб.
Третье — количество объектов на странице 95, рекомендуют не больше 20.
Картинки — дело личное, но рекомендации не больше 100 кб остаются. :)

Текст на инглише не копи-паст, а рекомендации по оптимизации именно ЛС. Т.к. прогонял через сервисы главную лс.ру

Цсс тоже не нравится сервисам. 8 файлов, говорят, многовато. Рекомендуют объединить в 1-2 файла.
avatar
Текст на инглише не копи-паст, а рекомендации по оптимизации именно ЛС. Т.к. прогонял через сервисы главную лс.ру
ну не руками же ты его сюда впечатывал, осознавая смысл каждого предложения? большинству здесь вообще не понятно, что скрывается за тонной этих букв
avatar
и для кого эта рекомендация? Если для разработчиков ЛС, то я тоже не владею буржуйским :) Можно на русском?
avatar
Главное:

1) Общее количество внешних файлов CSS на странице 8 штук. Объедините их в один или два файла. В идеале это должен быть один файл (или вложите в один файл). Вы можете оптимизировать CSS, используя короткие имена свойств, группировки, а затем ужать все GZIP'ом. Не забывайте размещать файлы CSS в HEAD, а JavaScript в конце BODY.

2) Про JS коротко: объединить. :) Опять же в идеале в один файл.

3) Верстку желательно оптимизировать. Для сравнения: на дигг.ком 48 объектов на главной, на ЛС — 95!
avatar
лучше топик исправить
avatar
Смысл? Главное, ты меня услышал. Принял — не принял, уже второстепенно. Топик вообще можно удалить.
avatar
дак я как бы и был в курсе клиентской оптимизации + тема уже неоднократно поднималась
avatar
Не забывайте размещать файлы CSS в HEAD, а JavaScript в конце BODY.


И получите ещё пачку ошибок при валидации
avatar
можешь посмотреть в сторону ресурса по оптимизации webo.in/ там думаю более понятно :)
avatar
У всех страниц вес разный в зависимости от шаблона. Скорость загрузки варьируется в зависимости от десятков факторов, управляемых и неуправляемых.
Топик ниочем вообще =(
avatar
Коммент ниочем.
avatar
Вся суть в 97 (по-моему) http запросов к серверу, что сами понимаете…
avatar
это на чистом LS без постов, если что…
avatar
Почитайте про то, сколько запросов генерит чистый Друпал ;-) Вот это шок! =)
avatar
Мы сейчас говорил про LiveStreet конкретно. И это совсем не кошерно =)
avatar
Надо бы отделить мух от котлет.
1) Есть движок
2) Есть дизайн
3) Есть клиентский контент

Количество и объем js-скриптов к движку стоит отнести, т.к. он обеспечивают необходимый функционал. Но тупо ручками сливать несколько js-файлов в один — неумно. Тут нужны какие-то системные решения (напр., упомянутый вебоптимайзер).

По числу объектов — тут уже каждый владелец ресурса сам должен решать эту проблему (самостоятельнь или с помощью нанятого дизайнера). Я лично рассматриваю скины, идущие в комплекте, как руководство к действию, а не как готовое к использованию продукт.

И вот число и вес картинок — это уже к юзерм :)
avatar
как было не один десяток раз сказано «livestreet — это тесто» т.е. совсем не готовый продукт, готовый к запуску сразу после закачки на сервер. мне кажется, что в данном случае разбивка на большое количество логично понятных файлов гораздо удобнее разработчику проекта, чем запакованный сразуже в дистрибутиве для более быстрой работы код.
объединить скрипты и цсс в один файл сможет любой мало-мальски грамотный разработчик, когда его проект будет готов к запуску.
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.