Уменьшение файлов в размере

Содержание
Архивирование HTML и нагрузка на сервер
Сжатие CSS- и JavaScript-файлов
Сжатие изображений
Уменьшение в размере заголовков
2 / 23
webo.in

Архивирование HTML и нагрузка на сервер
webo.in
3 / 23

Изучаем сжатие
Формальная модель
Издержки процессора
Файловая система
Постоянные издержки
Тестирование
Изменяем размер файлов
4 / 23
webo.in

График издержек на сжатие
5 / 23
webo.in

Издержки на сжатие и канал
6 / 23
webo.in

Эффективность сжатия
7 / 23
webo.in

Gzip-сжатие на сервере
Уменьшение размера объектов до 88%
Простота применения
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE application/x-javascript
DeflateCompressionLevel 7
Пропорциональное ускорение предзагрузки
8 / 23
webo.in

Статическое архивирование
Приемлемо для мало изменяющихся файлов
На сервере размещается подготовленный .gz архив
Есть сложности с размещением
Нужна поддержка для «старых» браузеров
9 / 23
webo.in

Сжатие CSS- и JavaScript-файлов
webo.in
10 / 23

Сжатие CSS-файлов
В обычных случаях достаточно регулярного выражения (-30% размера)
php / perl / shell / python / ruby
YUI Compressor для автоматизации и максимального сжатия
java
CSS Tidy для всех остальных случаев
php
11 / 23
webo.in

Сжатие CSS-файлов
12 / 23
webo.in

Сжатие JavaScript-файлов
JSmin для простых случаев
Портирован на большинство языков
YUI Compressor для автоматизации
java
Dean Edwards Packer, максимальное сжатие без gzip
php
13 / 23
webo.in

Сжатие JavaScript-файлов
14 / 23
webo.in

Сжатие изображений
webo.in
15 / 23

PNG против GIF
PNG8 лучше справляется со сжатием изображений
PNG32 может содержать полноцветную палитру
Полупрозрачность для PNG в IE6/7 через фильтры
Проблемы совпадения цветов решаются удалением чанков
16 / 23
webo.in

GIF против PNG
Анимированные GIF не имеют кроссбраузерных PNG-аналогов
Небольшие GIF-изображения обычно меньше
GIF не имеют проблемы с совпадением цветов
17 / 23
webo.in

favicon.ico
Мешается в очереди на загрузку
Загружается с того же домена
Нельзя отвечать 404-ошибкой
Оптимальный размер ~1Кб
Эффективно архивируется
AddOutputFilterByType DEFLATE image/x-icon
PNG не поддерживается в IE
18 / 23
webo.in

Полезные советы
Переводим bmp в png: bmp2png
Переводим gif в png: gif2png
Урезаем png: pngcrush, pngout, TweakPNG
Урезаем JPEG: jpegtran
19 / 23
webo.in

Уменьшаем заголовки
webo.in
20 / 23

Влияние на скорость доставки
До 80% от размера
Для небольших файлов (<1Кб)
Не стоит выставлять то, что не используется
Например, ETag для динамических файлов
Самый критичный компонент: cookie
Жестко следим за размером cookie
21 / 23
webo.in

Уменьшаем влияние cookie
Вынесение статики на отдельный хост
Куда не передаются cookie
Выставление cookie только для отдельных директорий
Выставление cookie на ограниченное время
Уменьшение размера ключей и значений
22 / 23
webo.in