Chrome 84 начали пропадать SVG иконки
После обновления Chrome до 84.0.4147.89 на сайтах начали пропадать svg-иконки размеченные с помощью тега use. Что более удивительно - не все и после обновления они возвращаются.
<svg><use xlink:href="sprite.svg#pencil"></use></svg>
Есть какая-нибудь информация по этой проблеме?
Ответы (1 шт):
Автор решения: Иван Антонов
→ Ссылка
Самое простое решение для меня стало подключение SVG-спрайтов в тело документа.
Было
<svg><use xlink:href="sprite.svg#pencil"></use></svg>
Стало
<svg><use xlink:href="#pencil"></use></svg>
<svg><use xlink:href="#delete"></use></svg>
<div style="display:none">
<svg>
<symbol id="pencil">...</symbol>
<symbol id="delete">...</symbol>
</svg>
</div>
Минусы:
- Увеличение DOM,
- SVG-спрайт больше не кешируется и загружается при каждой загрузке страницы,
- Нужно контролировать id. Потому что если на странице появится второй элемент с одинаковым id, может что-то сломаться в JS или не будет работать иконка.
Плюсы:
- Не создает лишних запросов,
- Фиксит проблему 84 хрома.