Comments 29
Спасибо за статью! Как раз недавно сталкивались с такой же проблемой, в итоге все же пришли к раздельным PNG-шным спрайтам для обычных мониторов и ретины.
Скажите, а эта проблема затрагивает только chromium-based браузеры?
Просто посмотрев ваши демки в своем Firefox, я не заметил прироста в 100 мб на второй ссылке.
Просто посмотрев ваши демки в своем Firefox, я не заметил прироста в 100 мб на второй ссылке.
Не в chromium-based, я не проверял. Размер выделяемой памяти, может зависеть от вашего разрешения. Сегодня вечером, сделаю замеры в других браузерах. Но теоретически, потребление памяти должно возрасти в любом браузере.
Firefox 19.0.2 скачка потребления памяти нет. Под IE10 тоже проблем не наблюдаю.
Разрешение 1600*1200+1920*1080.
Возможно это некорректная обработка конкретным браузером.
Разрешение 1600*1200+1920*1080.
Возможно это некорректная обработка конкретным браузером.
Chrome 27.0.1438.7 dev linux. Не могу определить скачек памяти.
FF 19.0.2 linux. C em и px для SVG разное отображение, память вроде бы в норме.
Opera 12.14 linux. То же что и с FF.
Как определить потребление памяти?
FF 19.0.2 linux. C em и px для SVG разное отображение, память вроде бы в норме.
Opera 12.14 linux. То же что и с FF.
Как определить потребление памяти?
В chrome я проверял через встроенный диспетчер задач. А каким образом, вы проверяете в FF и других браузерах?
Открывал top смотрел сколько памяти потребляется сейчас, открывал вкладку и смотрел как изменяется потребляемая процессом память. Возможно подход не лучший, поэтому и спрашиваю.
В FF есть about:memory…
Я тоже не наблюдаю скачка на FF (Linux, 20 beta) и тоже вижу разный результат.
Я тоже не наблюдаю скачка на FF (Linux, 20 beta) и тоже вижу разный результат.
UFO just landed and posted this here
UFO just landed and posted this here
Возможно, потому что неверно установлены параметры viewBox и enable-background?
UFO just landed and posted this here
Вероятнее всего баг в Chromium. Субъективные наблюдения: при зуме страницы потребление памяти увеличивается до 500МиБ, но на зуме в 400% потребление уменьшается до 100МиБ, при зуме 500% приходит в норму 30-40МиБ — это меньше, чем на зуме 100%. Это на демке с процентами.
У меня есть вопрос: в случае где вы используете svg с размером указанным в em у Вас выставлены размеры 30х160 em, что у моем браузере (Chrome 25.0.1364.152 m) соответствует 460x2560 px и группа со спрайтами занимает около 56% от всего размера svg (почти нет свободного места), а в случае где вы используете svg с размером указанным в px у Вас выставлены размеры 360x1920 px и группа со спрайтами занимает около 0.4% от всего размера svg (практически вся svg — белый фон). Если я изменю размеры svg указанной в пикселях хотя бы на 360х160 px (убрал белый фон) то потребление памяти лично у меня рез уменьшилось — со 100МБ до 20МБ. Может проблема не в px/em а в том, сколько из него вы реально используете?
UFO just landed and posted this here
Кстати и это тоже вполне может влиять на расход памяти. Но я имел ввиду немного другое: в случае с пикселями автор рендрит во много раз больше пустого пространсва в svg чем в случае с em… и если его убрать, то пожирается не так много памяти ( я убрал большую часть и добился приблизительно такого же потребления памяти как и в случае с em). На мой взгляд нужно сделать две одинаково заплненных svg и сравнить уже их. Мне лично кажется что результаты не будут сильно отличаться.
Все верно, видимо, как раз на эту площадь тратится память. Дело в том, что если задать размер задаваемый в px маленьким мы ограничим возможность масштабировать SVG. И конечно такой размер я выбрал, так как столкнулся с проблемой именно на большом холсте. А большой холст рисуют, чтобы потом можно было добавлять новые иконки. Хотя в этой статье www.broken-links.com/2012/08/14/better-svg-sprites-with-fragment-identifiers/
приведен метод, как можно достать нужный элемент из спрайта, не прибегая к расчету. Своим постом я хотел предостеречь разработчиков от возможной ошибки не верно применить SVG для бэкграунда.
приведен метод, как можно достать нужный элемент из спрайта, не прибегая к расчету. Своим постом я хотел предостеречь разработчиков от возможной ошибки не верно применить SVG для бэкграунда.
Мне не очень хорошо видно — svg — векторы?
Надо в багтрекер Хромиума с такими вопросами идти и репортить.
Всё же предлагаю поправить название топика («анализ хабра-сообществом… на retina-дисплееях в chromium-based браузерах»).
UFO just landed and posted this here
Sign up to leave a comment.
Анализ применения SVG в качестве background-image