Как сделать сайт быстрее?

Question

Я нахожусь в своих первых трехмесячных веб-разработках, и я занимался некоторыми сценариями на стороне сервера в виде ColdFusion, а также некоторыми Javascript, JQuery и CSS.

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

Сколько стоит сбор (точнее, я должен сказать, рекомендую) конкретную игру в браузере в этой игре?

веселит

Answer 1

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

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

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

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

Answer 2

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

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

Я бы порекомендовал this book.

Answer 3

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

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

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

Он также получил несколько книг из.

Answer 4

Просто суммировать вещи вверх сверху:

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

• сервера
• Подключение
• Client

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

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

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

Клиент: Если вы делаете wacky javascript или имеете медленные селектор css, это может повредить производительность на клиенте. Но это зависит от скорости компьютера клиента.

Answer 5

Вы не должны рекомендовать какой-либо конкретный браузер, но при необходимости настройте свою веб-страницу на действующие стандарты с некоторыми исправлениями для более старых моделей. С моей точки зрения, все может иметь влияние на скорость, но CSS является наименее важным, а в реальных примерах пользователь этого не заметит. В большинстве случаев четкое разделение html и деклараций стиля будет выполнять эту работу. Что на самом деле влияет? Прежде всего, вы можете просто бросить деньги на проблему, получив лучший хостинг-контракт (возможно, выделенный сервер). Другое дело, чтобы повысить скорость, которую веб-сайт загружает, - это уменьшить качество ваших изображений и использование CSS-спрайтов. Очень часто на динамических веб-страницах база данных является узким местом, поэтому кэширование и хороший уровень абстракции базы данных могут улучшить ситуацию (PHP: PDO вместо простого использования mysql()). GZip ваш выход для пользователя. Есть гораздо больше вещей, но многие из них очень зависят от языка.

Я рекомендую использовать FireBug и loadimpact.com для тестирования.

Answer 6

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

Answer 7

Я бы рекомендовал прочитать Best Practices for Speeding Up Your Web Site и весь контент на Яху! 'S Exceptional Performance страница.

Если вам нравятся книги, возможно, вас заинтересует High Performance Websites (обратите внимание, что в этом товаре содержится статья Best Practices for Speeding Up Your Web Site) и Even Faster Websites.

Вот несколько из моих любимых правил из Best Practices for Speeding Up Your Web Site:

• Минимизация HTTP запросов
• Добавить Истекает или Cache-Control Header
• Gzip Компоненты
• Сделать JavaScript и CSS Внешний
• Мини-код JavaScript и CSS

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

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

Стив

Answer 8

Если у вас есть много Javascript вы можете хотите использовать сжатие Javascript. Dojo предоставляет один такой инструмент SHRINKSAFE для сжатия вашего javascript. Найдите ссылку ниже: http://www.dojotoolkit.org/docs/shrinksafe

Существует еще один инструмент, открытый поисковой системой Google, которая может помочь вам оптимизировать производительность сайта. Он использовался внутри, прежде чем он был открыт для всех в последнее время. http://google-code-updates.blogspot.com/2009/06/introducing-page-speed.html http://code.google.com/speed/page-speed/

Надеюсь, это поможет.

Answer 9

Google в настоящее время собирает все виды советов по повышению эффективности на их новые «Давайте сделаем веб faster'-страницу здесь: http://code.google.com/intl/de-CH/speed/articles/

FYI: Не вся информация на этих страницах действительна, particularily в PHP советы далеко ,

Answer 10

Существует действительно большой плагин для 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/

Answer 11

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

Answer 12

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

Answer 13

Несколько основных правил тестирования производительности:

• Performance ничего не значит, если программа/веб-страница/все, что неправильно.
• Не пытайтесь улучшить производительность без надежной формы измерения.
• Вы должны прокомментировать свой сайт/программу/все, чтобы узнать, что мешает.
  • Corrolary: Не просто изменяйте вещи наугад, чтобы узнать, все ли улучшится.

Answer 14

Cache все (веб-сервер и кэш браузера).

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

Answer 15

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