Как заставить сайт работать быстрее? - PullRequest
6 голосов
/ 29 июня 2009

У меня первые 3 месяца веб-разработки, и я занимался некоторыми серверными сценариями в форме ColdFusion, а также Javascript, JQuery и CSS.

Я читал об оптимизации CSS и хотел бы знать, каковы другие важные факторы, способствующие повышению производительности сайта. Какие все факторы может проявить разработчик и оптимизировать?

Какую роль играет выбор (или, скорее, я бы сказал, рекомендация) конкретной игры браузера в этом поиске производительности?

ура

Ответы [ 15 ]

18 голосов
/ 29 июня 2009

Установить YSlow и Pagespeed плагины для Firefox. Тогда начните смотреть на все способы, которыми Ваш сайт неоптимизирован. Это очень похоже на попытку сделать глоток воды из пожарного гидранта.

Использование минимизированного (и, возможно, агрегированного) Javascript и CSS вместе с хорошим, здоровым далекым будущим - действительно хороший способ начать.

  • Не забудьте gzip.
  • И используйте Etags.
  • И поместите свой CSS вверху документа.
  • И поместите JavaScript в конец.
  • И использовать отдельные домены для статических ресурсов.
  • И избегайте переадресации URL.
  • И удалите дубликаты JavaScript и CSS.

И ... посмотри, что я имею в виду под пожарный гидрант!

6 голосов
/ 29 июня 2009

Просто подведем итог выше:

Скорость сайта зависит от нескольких вещей:

  • Сервер
  • Соединение
  • Клиент

И в каждой этой части вы можете делать улучшения.

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

Соединение: Здесь пригодятся YSlow и Pagespeed, а также Fiddler . Вы можете сделать некоторое кэширование статического контента (CSS и JS). Установите срок их действия в далеком будущем. Использование GZIP для уменьшения их содержимого и объединение статических файлов в определенной степени помогают. Кроме того, возможно, сервер имеет низкую пропускную способность.

Клиент: Если вы делаете дурацкий JavaScript или используете медленные селекторы CSS, это может снизить производительность на клиенте. Но это зависит от скорости компьютера клиента.

5 голосов
/ 29 июня 2009

Я бы рекомендовал прочитать Рекомендации по ускорению работы вашего веб-сайта и весь контент на Исключительной производительности Yahoo! .

Если вам нравятся книги, вас могут заинтересовать высокопроизводительные веб-сайты (обратите внимание, что большая часть этого контента содержится в статье Best Practices для ускорения работы вашего веб-сайта ) и Еще более быстрые сайты .

Вот несколько моих любимых правил из Лучшие практики для ускорения вашего сайта :

  • Свернуть HTTP-запросы
  • Добавление заголовка Expires или Cache-Control
  • Компоненты Gzip
  • Сделать JavaScript и CSS внешним
  • Сокращение JavaScript и CSS

Кроме того, smush.it хорошо подходит для сжатия изображений (что оказывает большое влияние на скорость загрузки веб-страницы).

Что касается браузеров, Safari 4 утверждает, что это "самый быстрый браузер в мире", и я могу сказать, что версия для Mac, безусловно, хороша и быстра (не говоря уже о элегантности!). Однако приведенные выше предложения будут иметь гораздо большее значение, чем то, какой браузер вы используете.

Steve

3 голосов
/ 29 июня 2009

С ColdFusion вы захотите убедиться, что ваши запросы кэшируются . Используйте анализатор запросов (если используете сервер mssql), чтобы убедиться, что медленная загрузка страницы не является результатом неправильного запроса. В конце базы данных вы также захотите обеспечить правильную индексацию.

Большим фактором производительности является количество HTTP-запросов на изображения, файлы и т. Д. YSlow покажет вам эту информацию. Доступно только для Firefox.

Я бы порекомендовал эту книгу .

2 голосов
/ 29 июня 2009

Существует действительно отличный плагин для Firefox под названием Dust-Me Selectors. Он сканирует ваши CSS-файлы и позволяет найти селекторы, которые не используются / стали избыточными в вашей разметке.

https://addons.mozilla.org/en-US/firefox/addon/5392

Вы также должны передавать статический контент с CDN. Параллельная загрузка статических файлов ускорит рендеринг вашей страницы. Лучшее объяснение здесь: http://www.sitecheck.be/tips/speed-up-your-site-using-a-cdn/

2 голосов
/ 29 июня 2009

Google в настоящее время собирает всевозможные советы по повышению производительности на своей новой странице «Давайте сделаем Интернет быстрее» здесь: http://code.google.com/intl/de-CH/speed/articles/

К вашему сведению: не вся информация на этих страницах действительна, особенно советы PHP.

2 голосов
/ 29 июня 2009

Посмотрите эти видео от Стива Соудерса (автор YSlow):

http://www.youtube.com/watch?v=aJGC0JSlpPE

http://www.youtube.com/watch?v=BTHvs3V8DBA

У него также есть пара книг.

1 голос
/ 16 октября 2010

Самая большая проблема, которую я имею, - это создание быстро работающих, красиво оформленных страниц с богатым контентом. Это одна вещь, которую чрезвычайно трудно сделать с современными технологиями.

1 голос
/ 30 июня 2009

Для IE см. http://www.fiddler2.com/fiddler/Perf/ Новый плагин neXpert для Fiddler (http://www.fiddler2.com/fiddler2/addons/nexpert.asp) предлагает функции, аналогичные тем, которые есть в YSlow и PageSpeed.

1 голос
/ 29 июня 2009

Меньше файлов - CSS-спрайты , возможно, стоит подумать. По моему опыту, вы должны балансировать свой CSS-файл между скоростью и удобством обслуживания - одно правило более или менее не будет иметь значения между днем ​​и ночью ...

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...