Комментарии 36
и чем это круче IE6/7 хаков?
* html
*+html
* html
*+html
CSS-правило, полученное моим методом, проходит валидацию
Все валидно что в браузере видно, метериал интересный но больше познавательный, чем практический.
:) * html, *+html — валидные селекторы
www.w3.org/TR/css3-selectors/
www.w3.org/TR/css3-selectors/
в любом случае спасибо автору за еще один вариант
behaviour — это не атрибут, а свойство.
А кто может мне объяснить в трех словах, зачем это нужно?
Я в верстке не шарю, стало интересно…
Я в верстке не шарю, стало интересно…
чтобы уменьшить число запросов с 2 до 1, но увеличить трафик на 30% х)
Хех) Спасибо)
Аж стало интересно, что покажет в адресной строке браузер, если кликнуть «Открыть изображение в новой вкладке»
Аж стало интересно, что покажет в адресной строке браузер, если кликнуть «Открыть изображение в новой вкладке»
<a href=«data:text/html;base64;charset=utf-8,ZGF0YSAtICYjMTA5MDsmIzEwNzI7JiMxMDgyOyYjMTA4NjsmIzEwODE7ICYjMTA3ODsmIzEwNzc7ICYjMTA4NzsmIzEwODg7JiMxMDg2OyYjMTA5MDsmIzEwODY7JiMxMDgyOyYjMTA4NjsmIzEwODM7ICYjMTA4OTsgJiMxMDkwOyYjMTA4NjsmIzEwOTU7JiMxMDgyOyYjMTA4MDsgJiMxMDc5OyYjMTA4ODsmIzEwNzc7JiMxMDg1OyYjMTA4MDsmIzExMDM7IHVyaSAmIzEwODI7JiMxMDcyOyYjMTA4MjsgJiMxMDgwOyBodHRwICYjMTA4MDsmIzEwODM7JiMxMDgwOyB1cm4=»data:text/html;base64;charset=utf-8,ZGF0YSAtICYjMTA5MDsmIzEwNzI7JiMxMDgyOyYjMTA4NjsmIzEwODE7ICYjMTA3ODsmIzEwNzc7ICYjMTA4NzsmIzEwODg7JiMxMDg2OyYjMTA5MDsmIzEwODY7JiMxMDgyOyYjMTA4NjsmIzEwODM7ICYjMTA4OTsgJiMxMDkwOyYjMTA4NjsmIzEwOTU7JiMxMDgyOyYjMTA4MDsgJiMxMDc5OyYjMTA4ODsmIzEwNzc7JiMxMDg1OyYjMTA4MDsmIzExMDM7IHVyaSAmIzEwODI7JiMxMDcyOyYjMTA4MjsgJiMxMDgwOyBodHRwICYjMTA4MDsmIzEwODM7JiMxMDgwOyB1cm4=
data:text/html;base64;charset=utf-8,ZGF0YSAtICYjMTA5MDsmIzEwNzI7JiMxMDgyOyYjMTA4NjsmIzEwODE7ICYjMTA3ODsmIzEwNzc7ICYjMTA4NzsmIzEwODg7JiMxMDg2OyYjMTA5MDsmIzEwODY7JiMxMDgyOyYjMTA4NjsmIzEwODM7ICYjMTA4OTsgJiMxMDkwOyYjMTA4NjsmIzEwOTU7JiMxMDgyOyYjMTA4MDsgJiMxMDc5OyYjMTA4ODsmIzEwNzc7JiMxMDg1OyYjMTA4MDsmIzExMDM7IHVyaSAmIzEwODI7JiMxMDcyOyYjMTA4MjsgJiMxMDgwOyBodHRwICYjMTA4MDsmIzEwODM7JiMxMDgwOyB1cm4=
Кстати, трафик не всегда растёт на 30 %. Base64-кодирование конечно увеличивает, но потом gzip обратно уменьшает.
ничего подобного. для хорошего зипования нужны длинные повторяющиеся последовательности, а base64 за счёт преобразования 3 байт в 4 уменьшает их повторяемость, ибо исходные данные не выстроены по 3-хбайтовой сетке
Большинство упаковщиков данных используют не только алгоритмы удаления повторяющихся блоков, но и уменьшения средней длинны слов (байт) за счет изменения количество бит в слове для каждого значения (читать Префиксный код и алгоритм Хаффмана)
Например конкретно эту последовательность base64 длиной 394 байт bzip2 уменьшил до 240 байт — 40%
Например конкретно эту последовательность base64 длиной 394 байт bzip2 уменьшил до 240 байт — 40%
А вы не путаете с LZW? Разве gzip не по алгоритму Хаффмана работает?
да без разницы какой алгоритм, ибо в исходных данных увеличивается энтропия
«base64 » — YmFzZTY0ICA=
" base64 " — IGJhc2U2NCA=
" base64" — ICBiYXNlNjQ=
если исходный текст можно закодировать всего 2 словами " " и «base64», то для закодированного в base64 нам потребуется словарь по крупнее
«base64 » — YmFzZTY0ICA=
" base64 " — IGJhc2U2NCA=
" base64" — ICBiYXNlNjQ=
если исходный текст можно закодировать всего 2 словами " " и «base64», то для закодированного в base64 нам потребуется словарь по крупнее
Извините, вы ошибаетесь, gzip использует алгоритм DEFLATE, который построен на комбинации алгоритмов LZ77 и Хаффмана. И ему для хорошего сжатия не нужны «длинные повторяющиеся последовательности», ему важен размер таблицы вхождений и равномерность распределения.
Чтобы уменьшить число http-запросов к серверу. Если есть много мелких картинок, то достаточно много времени тратится на такие запросы. С аналогичных
рассуждений, кстати, склеивают много картинок в одну (спрайтинг) — выгоднее грузить одну большую картинку одним запросом.
рассуждений, кстати, склеивают много картинок в одну (спрайтинг) — выгоднее грузить одну большую картинку одним запросом.
Неплохо! Как раз думал, как попроще прифигачить data:uri не запариваясь за mhtml, только я наверное бы сделал это не через htc, а через одноразовый экспрешн
Кстати, data:url очень хорош в email-письмах, отправляемых в html формате. Это позволяет обойти столь неприятную ситуацию, когда многие почтовые клиенты рубят все подгружаемые извне изображения
А почему нельзя просто написать 2 правила background-image:
Сначала background-image: url(habr.png);
Потом background-image: url(data:image/png; далее_base64_кодировка...); для тех кто поймет DataURI?
Сначала background-image: url(habr.png);
Потом background-image: url(data:image/png; далее_base64_кодировка...); для тех кто поймет DataURI?
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Поддержка Data:URL Internet Explorer'ом