Я часто использую встроенные SVG, чтобы поддерживать возможность манипулировать ими с помощью CSS - будь то для парящих эффектов или анимации.
Довольно часто некоторые SVG-файлы могут быть довольно большими, и как только вы начинаете получать некоторые из них на странице, не только код становится грязным, но и загружает больше данных для браузера (так как я понимаю, что встроенные SVG не т кеш).
Я столкнулся со следующей реализацией загрузки SVG через iframe и последующего удаления iframe. Он выглядит довольно аккуратно, поскольку вы получаете преимущества встроенного svg с преимуществами контроля SVG с помощью одного файла (если его когда-либо нужно будет изменить или отредактировать).
Загрузка SVG через кодовый фрейм iframe
<iframe src="signal.svg" onload="this.before(this.contentDocument.children[0]); this.remove();"></iframe>
Безопасен ли этот метод с точки зрения безопасности? Я знаю, что в фреймах много шума, и я не могу сказать, что когда-либо их использовал, но есть ли проблемы с этим? Есть ли альтернативные методы для достижения того же самого без iframe и сохранения возможности манипулировать SVG через CSS?