Секретные записки веб-программиста

ПОРТФОЛИО СТАТЬИ ПОЛЕЗНОСТИ ФОТО ГОСТЕВАЯ КОНТАКТЫ



Метки статей:
100mbru, CentOS, cms, drupal, joomla, LAMP, linux, mysql, nicru, Open-Source, Red Hat, seo, Typo3, ubuntu, авто, администрирование, алгоритмы, алкоголь, бизнес, битрикс, видео, военмех, выборы, германия, джино, домены, интересности, исследования, картинки, кино, кодинг, компьютеры, ливия, магазин, маразм, мастерхост, обработка-изображений, пейнтбол, политика, политэкономия, прикольное-видео, путешествия, работа, религия, рунет, сайтостроение, сео, сми, технологии, украина, форум, хиханьки, холивары, хостинг

Советы вебмастеру по повышению технической эффективности веб-сайта и инструменты

- 13-11-09

Теги статьи: сайтостроение
перевод статьи из блога SUN.COM

Советы по повышению эффективности веб-сайта

  • Делайте меньше HTTP-запросов
    • сократите количество компонентов на странице, CSS объедините в одну таблицу стилей, JS - в один сценарий
  • Используйте распределённые сети для хранения и доставки контента
    • такие как Akamai Technologies, зеркала сайта , либо Limelight Networks.
  • Добавьте заголовок Expires
    • Для статических компонентов сайта данных укажите, когда в будущем истекает его актуальность
    • для динамического контента используйте заголовок Cache-Control
  • Используйте GZIP
    • он уменьшает время отклика за счет уменьшения размера ответа HTTP.
  • Положите CSS в самом верху страницы
    • это позволит браузеру отображать содержание станицы как можно скорее.
  • Положите скрипты в самом конце страницы
    • ранняя их трансляция замедляет рендеринг страницы
  • Избегайте CSS выражения для динамических свойств
    • они могут быть оценен в тысячи раз и может влиять на производительность вашей странице.
  • Сделайте JS и CSS внешними файлами
    • Если несколько страниц будут повторно использовать эти же сценарии и таблицы стилей положите их отдельными файлами, поскольку файлы кэшируются браузером.
  • Уменьшите поиск в DNS
    • Сократите число уникальных имён хостов, используемых на странице - изображения, файлы сценариев, таблицы стилей .. Это сокращает число поисков DNS, но и уменьшает количество параллельных загрузок. Пусть их будет по меньшей мере 2, но не более 4 хостов.
  • сократите размер JavaScript
    • Удалите ненужные символы из кода для уменьшения его размера: удалить пробел, комментарии ...
    • Два наиболее популярных инструментов для сжатия JavaScript кода: JSMin и YUI Compressor.
  • Избегайте Redirect страницы
    • redirect - медленный способ, используйте Alias и mod_rewrite - они быстрее
  • Удалите дубликаты скриптов
  • Настройка ETags
    • ETag является строкой, которая однозначно идентифицирует конкретную версию контента или компонента страницы. Используется в условных GET запросах, при этом браузер использует If-None-Match заголовки. Когда используется ETags и возвращается 304 Код статуса то ответ сокращается до только заголовка.
  • Оптимизируйте изображения для уменьшения их размера
  • Уменьшите размер Cookie
    • Информация coockies, которой они обмениваются в заголовке HTTP между веб -серверами и браузерами. Храните размер coockies как можно меньшими, чтобы свести к минимуму его влияние на время ответа.
  • Избегайте ошибки 404
  • JavaScript:
    • Сделайте AJAX ответ кэширующимся, добавьте заголовок Cache-Control.
    • Создайте эффективный JS
    • сократите количество DOM элементов
    • Сделайте количество сообщений между сервером и браузером как можно меньше
    • Не переписывайте серверное приложений в JavaScript (как я понимаю - речь идёт о том, что не нужно производить тяжёлые вычисления, рассчитанные на быстродействие серверных языков не предназначенным для таких вычислений JavaScript-ом )
  • Генерируйте содержимое только при изменениях
    • разделите систему на компоненты, так чтобы вы могли отделить компоненты, которые быстро изменяются от тех, чьё изменение нечасто.

Используйте инструменты для того чтобы узнать, что исправить

  • HttpWatch
    • HttpWatch - это программа предназначеная для просмотра HTTP и отладчик, который интегрируется с IE и Firefox, чтобы обеспечить бесшовный ( так в оригинале - прим перев .) HTTP и HTTPS мониторинг
  • Firebug
    • С Firebug можно редактировать, отлаживать и контролировать CSS, HTML, JavaScript живьём в любой веб -странице.
  • Fiddler
    • Fiddler является отладочным веб прокси, который регистрирует весь HTTP (S) трафик между вашим компьютером и Интернетом.
  • Анализатор сетевых протоколов:

Ещё инструменты

YSlow
  • YSlow анализирует веб-страницы, и предлагает пути совершенствования их работы на основе неких правил для высокой производительности веб-страниц. YSlow является Add-ном Firefox, интегрирован с инструментом Firebug. YSlow оценивает веб-страницы на основе одного из трех предопределенных набор правил или определенный пользователем набор правил. YSlow даёт предложения по улучшению производительности страницы, анализирует компоненты страницы, отображает статистику о странице, а также предоставляет инструменты для анализа производительности.
  • Page Speed http://code.google.com/speed/page-speed/
    • Веб-мастера и веб-разработчики могут использовать Page Speed
  • Pagetest
    • Pagetest получает адрес веб-страницы для проверки Испытания будут проводиться в месте, указанном и Вам будет предоставлен график работы загрузки вашей страницы, а также сравнения с оптимизацией перечень.
  • Visual Round Trip Analyzer
    • Мелкософтовский визуализатор производительности и анализатор
  • neXpert Performance Tool
    • neXpert является дополнением к Web Debugger Fiddler, который помогает в выполнении тестирования веб приложений. neXpert является аддоном Fiddler , для сокращения времени, необходимого для поиска проблем с производительностью и выработки действий, которые могут осуществляться разработчиками
  • MSFast
    • MSFast является плагином для браузеров , он помогает разработчикам улучшить производительность своего кода, фиксируя и измерения возможные узкие места на своих веб-страницах.

  • Версия для печати