SVG ID最適化 — 短いIDに整理＆参照も自動更新

操作方法

1. 入力
   • テキストエリアにSVGソースを貼り付ける、またはSVGファイルを選択。
2. オプション
   • 未使用IDを削除：チェックONで、参照されていないid属性を削除。
3. 実行
   • 最適化ボタン → 右下にプレビュー、中央に変換後ソース。
4. 出力
   • コピーでソースをクリップボードへ。
   • ダウンロードでoptimized.svgを保存。

成果物（得られるもの）

• **短縮ID（a, b, …, aa …）**に置換されたSVG
• url(#id) / href / xlink:href / fill / stroke / filter / clip-path / mask / marker-* などの参照の一括更新
• <style>やstyle属性内の**url(#id)/#id文字列の置換**
• （任意）未使用IDの削除

注意点

• CSSセレクタでのID参照に注意：#logo { ... } のようなセレクタ参照は検出対象外のため、
  • 「未使用IDを削除」をOFFにする、または
  • 変換後にプレビュー崩れがないか確認してください。
• 色コード衝突の可能性：<style>内で#abcのようなカラーコードとID名が一致すると、#abcが誤置換される恐れ。IDが短い（例：abc）場合は特に注意。
• スクリプト安全性：プレビューはinnerHTMLでSVGを差し込みます。外部由来のSVGには<script>が含まれる可能性があるため、信頼できるソースのみで使用してください。
• 削除判定の範囲：未使用判定は主に**属性参照／url(#...)**を見ています。SMILや複雑なCSS参照は見逃す可能性あり。
• クォータ：短縮IDの生成は最大で数万件規模まで（a…zzz）。桁外れにIDが多いSVGでは不足の可能性。
• 互換：replaceAll等、モダンブラウザ前提。古い環境では動作しない場合あり。