Клиентская оптимизация / Динамические стили: быстро и просто
Тестовое окружение
Поскольку скорость загрузки отдельного CSS-файла достаточна велика, а требуется рассмотреть, как его содержимое может повлиять на скорость его динамического применения к документу, то нам нужны сотни или даже тысячи правил. В качестве отправной точки была опять взята главная страница Яндекса, стили которой были вынесены в отдельный файл и скопированы 10 раз. Это дало необходимую задержку (которая существенно больше погрешности, вносимой браузерами) и не сильно увеличило сжатый с помощьюgzip
файл.
Все варианты представлены на тестовой странице, вкратце опишу основные подходы.
Источник: Уроки CSS на Хабрахабре
Если Вы хотите оставить заказ на разработку сайта или получить предварительную консультацию воспользуйтесь формой по ссылке ниже.
Обратная связь
Наш специалист ответит вам в течении суток.
Похожие публикации
Клиентская оптимизация / Выносим CSS в пост-загрузку
После сравнительной заметки о CSS Sprites и data:URL все мои мысли были направлены на решение основной проблемы: В общем случае [при использовании data:URL], загрузка страницы не ускорится,... читать далее
Клиентская оптимизация / Ссылка Клиентская оптимизация: лучше меньше, да лучше
Частичная перепечатка моей статьи в Терминал.Ру. "Еще во времена HTML 3.2 разработчики стали задумываться над тем, как сократить время загрузки сайтов, перегруженных информацией и графикой. С тех пор... читать далее
[Из песочницы] Сохранение JS и CSS ресурсов в Локальном хранилище браузера
Вопрос, стоит ли хранить javascript и css ресурсы веб-страницы в LocalStorage браузера или позволить ему самому отрабатывать кэширование, не имеет однозначного ответа. Есть плюсы и минусы. С моей... читать далее
Web-разработка / Странное ограничение IE на количество внешних CSS
Разрабатывая проект наткнулся на странный глюк в IE. Некоторые стили просто не применялись к странице. Т.к. проект большой и стилей много, на этапе разработки CSS был разбит на много файлов для... читать далее
Web-разработка / альтернатива HTML5 прямо сейчас
Пока все обсуждают HTML5 я тут пошевелил извилинами и придумал, в общем-то, тривиальную, но полезную концепцию и решение всех ваших проблем с языками разметки. Оно работает уже сейчас в Mozilla,... читать далее
[Из песочницы] Above-the-Fold CSS — как ускорить загрузку сайта не замедлив разработку
В старые добрые времена мы с Google PageSpeed Insights были на короткой ноге. Я — клепал дешевые шаблоны, Google — ставил высокую оценку за скорость их загрузки. Однако со временем многое поменялось,... читать далее
Прокомментировать
Облако тегов
angular CSS css es6 frontend habrahabr.ru HTML html html5 javascript JavaScript js react ReactJS seo SEO на Хабрахабре skillfactory vue Блог компании RUVDS.com Блог компании SkillFactory Веб-дизайн Дизайн Интернет-маркетинг Поисковая оптимизация Программирование Разработка веб-сайтов Уроки CSS на Хабрахабре автомобильный сайт браузеры верстка вёрстка дайджест дизайн интернет-магазин корпоративный сайт модуль разработка ссылки фронтенд
Реклама на сайте
кадиллак прокат на свадьбу