Разделы презентаций
- Разное
- Английский язык
- Астрономия
- Алгебра
- Биология
- География
- Геометрия
- Детские презентации
- Информатика
- История
- Литература
- Математика
- Медицина
- Менеджмент
- Музыка
- МХК
- Немецкий язык
- ОБЖ
- Обществознание
- Окружающий мир
- Педагогика
- Русский язык
- Технология
- Физика
- Философия
- Химия
- Шаблоны, картинки для презентаций
- Экология
- Экономика
- Юриспруденция
Уменьшение файлов в размере
Содержание
- 1. Уменьшение файлов в размере
- 2. СодержаниеАрхивирование HTML и нагрузка на серверСжатие CSS- и JavaScript-файловСжатие изображенийУменьшение в размере заголовков2 / 23webo.in
- 3. Архивирование HTML и нагрузка на серверwebo.in3 / 23
- 4. Изучаем сжатиеФормальная модельИздержки процессораФайловая системаПостоянные издержкиТестированиеИзменяем размер файлов4 / 23webo.in
- 5. График издержек на сжатие5 / 23webo.in
- 6. Издержки на сжатие и канал6 / 23webo.in
- 7. Эффективность сжатия7 / 23webo.in
- 8. Gzip-сжатие на сервереУменьшение размера объектов до 88%Простота
- 9. Статическое архивированиеПриемлемо для мало изменяющихся файловНа сервере
- 10. Сжатие CSS- и JavaScript-файловwebo.in10 / 23
- 11. Сжатие CSS-файловВ обычных случаях достаточно регулярного выражения
- 12. Сжатие CSS-файлов12 / 23webo.in
- 13. Сжатие JavaScript-файловJSmin для простых случаевПортирован на большинство
- 14. Сжатие JavaScript-файлов14 / 23webo.in
- 15. Сжатие изображенийwebo.in15 / 23
- 16. PNG против GIFPNG8 лучше справляется со сжатием
- 17. GIF против PNGАнимированные GIF не имеют кроссбраузерных
- 18. favicon.icoМешается в очереди на загрузкуЗагружается с того
- 19. Полезные советыПереводим bmp в png: bmp2pngПереводим gif
- 20. Уменьшаем заголовкиwebo.in20 / 23
- 21. Влияние на скорость доставкиДо 80% от размераДля небольших файлов (
- 22. Уменьшаем влияние cookieВынесение статики на отдельный хостКуда
- 23. В следующей лекции КэшированиеОсновы кэширования: Cache-ControlУсловное кэширование:
- 24. Скачать презентанцию
СодержаниеАрхивирование HTML и нагрузка на серверСжатие CSS- и JavaScript-файловСжатие изображенийУменьшение в размере заголовков2 / 23webo.in
Слайды и текст этой презентации
Слайд 2Содержание
Архивирование HTML и нагрузка на сервер
Сжатие CSS- и JavaScript-файлов
Сжатие изображений
Уменьшение
в размере заголовков
Слайд 4Изучаем сжатие
Формальная модель
Издержки процессора
Файловая система
Постоянные издержки
Тестирование
Изменяем размер файлов
4 / 23
webo.in
Слайд 8Gzip-сжатие на сервере
Уменьшение размера объектов до 88%
Простота применения
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType
DEFLATE text/css
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE application/x-javascript
DeflateCompressionLevel 7
Пропорциональное ускорение предзагрузки
8 /
23webo.in
Слайд 9Статическое архивирование
Приемлемо для мало изменяющихся файлов
На сервере размещается подготовленный .gz
архив
Есть сложности с размещением
Нужна поддержка для «старых» браузеров
9 / 23
webo.in
Слайд 11Сжатие CSS-файлов
В обычных случаях достаточно регулярного выражения (-30% размера)
php /
perl / shell / python / ruby
YUI Compressor для автоматизации
и максимального сжатияjava
CSS Tidy для всех остальных случаев
php
11 / 23
webo.in
Слайд 13Сжатие JavaScript-файлов
JSmin для простых случаев
Портирован на большинство языков
YUI Compressor для
автоматизации
java
Dean Edwards Packer, максимальное сжатие без gzip
php
13 / 23
webo.in
Слайд 16PNG против GIF
PNG8 лучше справляется со сжатием изображений
PNG32 может содержать
полноцветную палитру
Полупрозрачность для PNG в IE6/7 через фильтры
Проблемы совпадения цветов
решаются удалением чанков16 / 23
webo.in
Слайд 17GIF против PNG
Анимированные GIF не имеют кроссбраузерных PNG-аналогов
Небольшие GIF-изображения обычно
меньше
GIF не имеют проблемы с совпадением цветов
17 / 23
webo.in
Слайд 18favicon.ico
Мешается в очереди на загрузку
Загружается с того же домена
Нельзя отвечать
404-ошибкой
Оптимальный размер ~1Кб
Эффективно архивируется
AddOutputFilterByType DEFLATE image/x-icon
PNG не поддерживается в IE
18
/ 23webo.in
Слайд 19Полезные советы
Переводим bmp в png: bmp2png
Переводим gif в png: gif2png
Урезаем
png: pngcrush, pngout, TweakPNG
Урезаем JPEG: jpegtran
19 / 23
webo.in
Слайд 21Влияние на скорость доставки
До 80% от размера
Для небольших файлов (
стоит выставлять то, что не используется
Например, ETag для динамических файлов
Самый
критичный компонент: cookieЖестко следим за размером cookie
21 / 23
webo.in
Слайд 22Уменьшаем влияние cookie
Вынесение статики на отдельный хост
Куда не передаются cookie
Выставление
cookie только для отдельных директорий
Выставление cookie на ограниченное время
Уменьшение размера
ключей и значений22 / 23
webo.in
Слайд 23В следующей лекции
Кэширование
Основы кэширования: Cache-Control
Условное кэширование: ETag
Настройка и сброс кэширования
Кэширования
для IE: post-check, pre-check
Кэширование и архивирование для iPhone
23 / 23
webo.in
