Читать «Разгони свой сайт» онлайн - страница 2
Николай Мациевский
CSS Image map
Статичные картинки
Онлайн-генераторы
Полезные советы
4.4. Картинки в теле страницы с помощью data:URI
Поддержка браузерами
Схема data:URI
CSS и встроенные изображения
Проблемы data:URI
Работа в Internet Explorer
Преимущества и недостатки data:URI
Дополнительные соображения по оптимизации
Кроссбраузерное использование data:URI
О, этот странный Microsoft!
Объединяем несовместимое
Панацея или ящик Пандоры?
Валидность
Некоторые итоги
Включение музыки (base64)
4.5. CSS Sprites и data:URI
Проблемы при верстке
Проблемы при загрузке
Проблемы при использовании
Шаг за шагом
Выносим CSS-файлы в пост-загрузку
Теоретическое решение
На практике
А доступность?
Делаем решение кроссбраузерным
Выигрыш
4.6. Методы экстремальной оптимизации
Объединение JavaScript и CSS в одном файле
Рассмотрим на примере
Объединение HTML, CSS и JavaScript в одном файле
Глава 5. Параллельные соединения
5.1. Обходим ограничения браузера на число соединений
Издержки на доставку объектов
Ограничения спецификации HTTP/1.1
Времена меняются
«Режем» соединения
Реальный выигрыш
Подводим итоги
5.2. Content Delivery Network и Domain Name System
Подключаем CDN
Yahoo! и Google
Количество DNS-запросов
5.3. Балансировка на стороне клиента
Round-Robin DNS
Балансировка на сервере
Балансировка на стороне клиента
Осуществляем кросс-доменные запросы
А если все же AJAX?
Преимущества балансировки на стороне клиента
Используем Cloud Computing для балансировки на стороне клиента
Пример приложения
Логика для скрипта, запускающегося по расписанию
5.4. Редиректы, 404-ошибки и повторяющиеся файлы
Редиректы
404-ошибки
5.5. Асинхронные HTTP-запросы
Моделируем параллельные запросы
Предварительные выводы
Влияние заголовков
5.6. Уплотняем поток загрузки
Реальная ситуация
Шаг первый: простая страница
Шаг второй: уменьшаем изображения
Шаг третий: все-в-одном
Шаг четвертый: нарезаем поток
Шаг пятой: алгоритмическое кэширование
Итоговая таблица
Шаг шестой: балансируем стадии загрузки
Шаг седьмой: балансируем кэширование
Заключение
Глава 6. CSS оптимизация
6.1. Оптимизируем CSS expressions
CSS-выражения
Динамические выражения
Вычисление постоянных
Использование
Реализация
Все так просто? Нет, еще проще
6.2. Что лучше, id или class?
Методика. Размер файлов
Время открытия страницы
Результаты
Выводы
6.3. Влияние семантики и DOM-дерева
Графики влияния DOM-дерева
Выводы по DOM-дереву
Семантическое DOM-дерево
Что быстрее?
Методика для DOCTYPE
Результаты оптимизации
«Экономия на спичках»?
6.4. Ни в коем случае не reflow!
offsetHeight и style.display
Немного теории
Использование Computed Style
Оптимизация: определение класса hide
Заключение
В качестве послесловия: стили или классы?
Перерисовка страницы
Групповое изменение стилей
Два слова о таблицах
Глава 7. Оптимизация JavaScript
7.1. Кроссбраузерный window.onload
Firefox впереди планеты всей
А Internet Explorer?
Условные комментарии
Все так просто?
Двойное выполнение
Избавляемся от внешнего файла
Полное решение
Неблокирующая загрузка JavaScript
Число загрузок с одного хоста
Неблокирующие скрипты
Зависимости
А если по-другому?
В будущем
7.2. Основы «ненавязчивого» JavaScript