Верстаю сайт и встал вопрос использования svg.
Является ли проблемой (для скорости загрузки сайта) наличие svg иконок в html в теговом виде? Примерно как на картинке
(и это ДЕЛЕКО не конец)
в самом коде у меня всё прилично, то есть подключаются иконки с папки images по названию, которое состоит из "x-название-иконки", примерно так: <x-my-icon class="..."/>
Руководитель frontend направления, предприниматель
1. Не стоит добавлять в тело сайта того чего там быть не должно.
2. Встраивать svg в тело страницы это нормально и в целом хорошо (если там нет лишнего мусора, конечно же).
3. «x-my-icon» — если это веб-компонент, или компонент на базе какой-нить либы типа Vue, то все ок, в противном случае это дичь.
«x-my-icon» - это в ларавель дополнение. Оно возвращает как раз то, что на фото и больше ничего. А что за лишний мусор? Если о svg самом, то там вроде все нужное. Делалось в фигме
В идеале так должно быть ТОЛЬКО если это компонент, формируемый программно, то есть каждый раз разное содержимое, в остальных случаях - вынести в файл и загружать из файла.
Это даст а) Кэшируемость, и б) асинхронность загрузки.
я про компонент в предыдущем коменте написал.
У меня есть выбор: либо заюзать плагин, который позволяет мне просто прописать
при этом поменять цвет изображения по желанию.. в коде оно будет простынёй
или что-то делать с этим свг спрайтом.. однако я смотрю, что в коде оно не сильно то и отличается (больше вложенностей и да и все..)
+ у меня на сайте не так много свг:
1) На главной 2 картинки (но по коду большие)
2) В футере социальные сети и лого (нужно менять фон)
3) Остальные по мелочи (из 2-3 path элементов svg)
так вот, есть ли вообще смысл заморачиваться со спрайтом? или лучше уже вставить через плагин и может быть через src="blabla.svg" сделать статические?
Простой
