Акысыз SVG оптималдаштыруучу жана кыскартуучу

Метаберилиштерди алып салыңыз, боштуктарды кыскартыңыз жана ондук сандарды тегеректеп, SVG файл көлөмүн айкын кыскартыңыз — адаттагы кыскартуу 30-70%. Визуалдык алдын ала көрүү эч нерсе бузулбаганын тастыктайт.

Жүктөлгөндөн кийин оффлайн иштейт

Файлдарды бул жерге таштаңыз же серептөө үчүн чыкылдатыңыз

SVG · Файлдын өлчөмүнө чектөө жок

же буферден коюу үчүн Ctrl+V басыңыз

Файлдарды карап чыгуу
— же төмөндөн SVG чаптаңыз —

Файлдарыңыз түзмөгүңүздөн эч качан кетпейт. Бардык иштетүүлөр браузериңизде локалдуу түрдө ишке ашат.

Бул кантип иштейт

Бул курал SVG файл өлчөмүн толугу менен браузериңизде иштеген кол менен жазылган оптимизатор колдонуп азайтат — китепкана жок, сервер жок. Ал эки өтүштү бириктирет: атрибут-деңгээлдеги так иш үчүн браузердин курулма DOMParser/XMLSerializer жана комментарий алуу, метамаалымат алуу жана боштук кысуу үчүн максаттуу регекс алмаштыруу.

  1. 1
    DOMParser SVGди тазалайт
    Каалаган оптимизациядан мурун, браузердин DOMParser SVGди XML катары окуйт жана ар бир элементти басып өтөт. Скрипт тегдер, окуя иштеткичтер (каалаган on* атрибуту), анимация элементтери жана тышкы URL шилтемелери шартсыз алынат — бул кайсы оптимизация параметрлерин тандаганыңызга карабастан болот.
  2. 2
    DOM-негизделген ондук тегерету
    Эгер ондук тегерету иштетилсе, оптимизатор талданган DOMду экинчи ирет басып өтөт жана тегеретүүнү белгилүү сандык атрибуттарга гана (жол d маалыматы, координаттар, айландыруу маанилери, сызык туурасы, ж.б.) колдонот, .5.5 сыяктуу бириктирилген жол маанилерин бузбай жеке калкыма-чекит сандарды дал келтирген регекс колдонуп.
  3. 3
    Регекс өтүштөрү сериализацияланган белгилөөнү тазалайт
    XMLSerializer нормалдаштырылган XML жаратат, андан кийин максаттуу саб алмаштыруулар HTML комментарийлерин, Inkscape/Sodipodi редактор метамаалыматын, XML декларациясын, артыкча демейки атрибуттарды (version="1.1" сыяктуу) жана тегдер-ортосу боштукту алат — ар бир өтүш тар масштабдалган, ошондуктан текст түйүн мазмуну эч качан тийилбейт.
  4. 4
    Gzip өлчөм жана экспорт форматтары
    Браузердин CompressionStream API киргизүүнүн жана чыгуунун чыныгы gzip өлчөмдөрүн эсептейт, анткени бул тармактагы жиберүү наркын чын эле аныктаган нерсе. Оптимизацияланган SVGди жүктөп алса, чийки SVG катары көчүрсө, React JSX-даяр camelCase атрибуттарына айландырса же CSS маалымат URI катары кодддосо болот — бардык айландыруу жергиликтүү болот.

SVGиз браузер табыңыздын ичинде толугу менен окулуп иштетилет — файл байттары эч качан түзмөгүңүздөн чыкпайт.

Байланыштуу куралдар

Көп берилүүчү суроолор