مفت SVG آپٹیمائزر اور منیفائر

یہ کیسے کام کرتا ہے

یہ ٹول SVG فائل سائز کو ایک ہاتھ سے لکھے گئے آپٹیمائزر کا استعمال کرتے ہوئے کم کرتا ہے جو مکمل طور پر آپ کے براؤزر میں چلتا ہے — کوئی لائبریری، کوئی سرور نہیں۔ یہ دو پاسز کو ملاتا ہے: خصوصیت کی سطح کی درست کاری کے کام کے لیے براؤزر کا بلٹ ان DOMParser/XMLSerializer، اور comment ہٹانے، metadata ہٹانے، اور خالی جگہ سکیڑنے کے لیے ہدف شدہ regex متبادلے۔

1. 1
   DOMParser SVG کو صاف کرتا ہے

   کسی بھی آپٹیمائزیشن سے پہلے، براؤزر کا DOMParser SVG کو XML کے طور پر پڑھتا ہے اور ہر عنصر سے گزرتا ہے۔ اسکرپٹ ٹیگز، ایونٹ ہینڈلرز (کوئی بھی on* خاصیت)، اینیمیشن عناصر، اور بیرونی URL حوالہ جات کو غیر مشروط طور پر ہٹا دیا جاتا ہے — یہ اس بات سے قطع نظر چلتا ہے کہ آپ کون سا آپٹیمائزیشن اختیار منتخب کرتے ہیں۔
2. 2
   DOM پر مبنی اعشاریہ گول کرنا

   اگر اعشاریہ گول کرنا فعال ہو، تو آپٹیمائزر پارس شدہ DOM سے دوبارہ گزرتا ہے اور صرف معلوم عددی خاصیتوں (path d ڈیٹا، کوآرڈینیٹس، transform اقدار، اسٹروک چوڑائیاں، وغیرہ) پر گول کرنا لاگو کرتا ہے، ایک regex کا استعمال کرتے ہوئے جو انفرادی floating-point نمبروں سے مماثل ہو بغیر .5.5 جیسی جڑی ہوئی path اقدار کو خراب کیے۔
3. 3
   Regex پاسز سیریلائز شدہ مارک اپ کو صاف کرتے ہیں

   XMLSerializer عام کردہ XML تیار کرتا ہے، پھر ہدف شدہ اسٹرنگ متبادلے HTML comments، Inkscape/Sodipodi ایڈیٹر metadata، XML اعلامیہ، زائد ڈیفالٹ خاصیتیں (جیسے version="1.1")، اور ٹیگز کے درمیان خالی جگہ ہٹاتے ہیں — ہر پاس تنگ طور پر محدود ہے تاکہ متن نوڈ مواد کبھی چھوا نہ جائے۔
4. 4
   Gzip سائز اور ایکسپورٹ فارمیٹس

   براؤزر کا CompressionStream API ان پٹ اور آؤٹ پٹ دونوں کے حقیقی gzip سائز کا حساب لگاتا ہے، کیونکہ یہی وہ چیز ہے جو ویب پر منتقلی کی لاگت کا تعین کرتی ہے۔ آپٹیمائزڈ SVG کو ڈاؤن لوڈ کیا جا سکتا ہے، خام SVG کے طور پر کاپی کیا جا سکتا ہے، React JSX-تیار camelCase خاصیتوں میں تبدیل کیا جا سکتا ہے، یا CSS ڈیٹا URI کے طور پر انکوڈ کیا جا سکتا ہے — تمام تبدیلیاں مقامی طور پر ہوتی ہیں۔

متعلقہ ٹولز