Сокращение времени загрузки или заставление пользователя думать, что время загрузки меньше - PullRequest
3 голосов
/ 24 марта 2010

Я работал над веб-сайтом, и нам удалось снизить общий объем загрузки страницы с 13,7 МБ до 2,4, но загрузка страницы по-прежнему занимает вечность.

Это сайт Joomla (ick), и он имеет много избыточных элементов DOM (2000+ для домашней страницы) и делает 60+ запросов HttpRequest на страницу, считая все запросы css, js и image. В отличие от drupal, Joomla не объединит их всех на лету, и их нужно хранить отдельно, иначе компоненты joomla сойдут с ума.

Что я могу сделать, чтобы улучшить время загрузки?

Вещи, которые я сделал:

  • Добавлены цвета к элементам dom, у которых в качестве фона используются большие изображения, поэтому цвет загружается, затем изображение
  • Уменьшено чрезмерно большое изображение до файлов намного меньшего размера
  • Уменьшено количество элементов DOM до ~ 2000, с ~ 5000
  • Загрузка CSS в начале страницы и javascript в конце
    • Не совсем возможно, Joomla внедряет свой собственный javascript и css и всегда делает это в заголовке.
  • Свернуто большинство JavaScript
  • Настройка кэширования и gziping на сервере

Не кэшированный размер 2,4 МБ, кэшированный размер ~ 300 КБ, но даже с таким большим количеством элементов dom для отображения страницы требуется немало времени.

Что еще я могу сделать, чтобы улучшить время загрузки?

Ответы [ 6 ]

3 голосов
/ 24 марта 2010

Ознакомьтесь с этой статьей.

http://www.smashingmagazine.com/2010/01/06/page-performance-what-to-know-and-what-you-can-do/

Если ссылка будет удалена или утеряна, упомянутые инструменты:

  • YSlow (от Yahoo)
  • Скорость страницы Google
  • Тест веб-страницы AOL
  • Smush.it (инструмент сжатия изображений)
2 голосов
/ 25 мая 2010

Вы включили сжатие HTTP (gzip) на своих веб-серверах? Это уменьшит размер передачи всех текстовых файлов на 60-90%. И ваша страница будет загружаться в 6-10 раз быстрее.

Поиск в StackOverflow или Google, чтобы узнать, как его включить. (Это зависит от программного обеспечения сервера: Apache, IIS и т. Д.).

2 голосов
/ 24 марта 2010

Похоже, вы проделали большую работу по решению настоящей проблемы: этой гигантской графики. Вероятно, вы можете выжать еще больше из кэширования, минимизации и т. Д., Но должен быть способ уменьшить размер изображений. Я работал с командой некоторых из самых требовательных дизайнеров на Земле, и им никогда не требовались несжатые JPEG-файлы. Вы имеете в виду изображения, вырезанные из Photoshop и сохраненные в полном качестве (10)? Если это так, то реальное решение (и я ценю, что вы, возможно, не сможете этого сделать) - это вести напряженную беседу, в которой вы объясняете проектной компании: «Вы не ваши пользователи». Если целью сайта является только произвести впечатление на других визуальных дизайнеров верностью ваших изображений, возможно, это нормально. Если целью сайта является создание портфолио, которое приносит пользу вашей компании, им необходимо пересмотреть, кто является их аудиторией и чего хочет эта аудитория. Что, я полагаю, не составляет 2 минуты загрузки.

1 голос
/ 24 марта 2010

Нужны ли все элементы DOM? Если они есть, можно ли их скрыть при загрузке страницы? По сути, у вас будут важные элементы dom, необходимые для отображения на странице, а затем, когда документ загружен, вы можете при необходимости отобразить остальные элементы

$('.hidden').removeClass('hidden')

0 голосов
/ 03 июня 2010

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

Как только вы доберетесь до критической точки, вам нужно будет сравнить количество усилий, которое вам потребуется для дальнейшего сжатия сайта, с усилием выбросить наиболее дорогостоящие компоненты с пропускной способностью в окно. Например, вы можете потратить еще 20 часов на сжатие своего сайта на 1%. Вы также можете потратить 40 часов на то, чтобы выбросить тему Joomla и начать заново, сэкономив 50%. (хотя, вероятно, нет).

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

0 голосов
/ 24 марта 2010

Очевидно, есть плагины для сжатия и объединения файлов JS / CSS:

http://extensions.joomla.org/extensions/site-management/site-performance

http://extensions.joomla.org/extensions/site-management/site-performance/7350

...