ویب پرفارمنس اور SVG فائل کا سائز
جدید ویب ڈیزائن اور ڈیولپمنٹ میں اسکیل ایبل ویکٹر گرافکس (SVG) کو ایک اہم مقام حاصل ہے۔ چونکہ یہ فائلیں XML فارمیٹ پر مبنی ہوتی ہیں، اس لیے ان میں گرافک کی جیومیٹری کے ساتھ ساتھ بہت سا ایسا ڈیٹا بھی شامل ہو جاتا ہے جو براؤزر میں تصویر دکھانے کے لیے ضروری نہیں ہوتا۔ جب آپ السٹریٹر یا دیگر ڈیزائن ٹولز سے SVG ایکسپورٹ کرتے ہیں، تو فائل میں ایڈیٹر میٹا ڈیٹا، تبصرے اور غیر ضروری اسپیسنگ شامل رہ جاتی ہے۔
ویب سائٹ کی لوڈنگ کی رفتار اور صارف کے تجربے (User Experience) کا براہ راست تعلق فائل کے سائز سے ہوتا ہے۔ خاص طور پر جب ان لائن (inline) SVG کا استعمال کیا جائے، تو کوڈ کا سائز براہ راست HTML دستاویز کے حجم کو بڑھا دیتا ہے۔ اس اضافی اور غیر ضروری کوڈ کو صاف کر کے فائل کا سائز چھوٹا کرنا ویب پیج کی کارکردگی کو بہتر بنانے کے لیے انتہائی مفید ثابت ہوتا ہے۔
محفوظ اور بغیر نقصان کے آپٹمائزیشن (Lossless Optimization)
گرافکس کے تناظر میں "Lossless" یا بغیر نقصان کے آپٹمائزیشن سے مراد ایسا عمل ہے جس میں فائل کا سائز تو کم ہو جاتا ہے لیکن تصویر کی ظاہری شکل اور کوالٹی پر کوئی اثر نہیں پڑتا۔ یہ ٹول اسی اصول کے تحت کام کرتا ہے۔
یہ آپٹمائزر کوڈ کو صاف کرتے وقت درج ذیل تبدیلیاں کرتا ہے:
- کوڈ میں موجود تبصرے (comments) اور میٹا ڈیٹا (metadata) کو ختم کرتا ہے۔
- ایڈیٹر نیم اسپیسز (editor namespaces) اور غیر استعمال شدہ نیم اسپیسز کو ہٹاتا ہے۔
- ایٹریبیوٹس کے درمیان موجود اضافی اسپیسنگ کو صاف کرتا ہے۔
- رنگوں کے کوڈز کو ان کے مختصر ترین مساوی رنگوں (shorter equivalent colors) سے بدل دیتا ہے۔
محفوظ کلین اپ کو یقینی بنانے کے لیے یہ ٹول پاتھ ری رائٹس (path rewrites)، آئی ڈی کا نام بدلنے (ID renaming)، viewBox کو ہٹانے اور پریسیشن راؤنڈنگ (precision rounding) سے مکمل گریز کرتا ہے۔ اس طرح آپ کی فائل کا viewBox، آئی ڈیز، لیبلز اور اصل جیومیٹری مکمل طور پر برقرار رہتے ہیں۔
سیکیورٹی اور XML اینٹیٹی پارسنگ
ویب ایپلی کیشنز میں XML فائلوں کو پارس کرنے کے حوالے سے سیکیورٹی کے سنگین خطرات پیدا ہو سکتے ہیں۔ خاص طور پر ایسے SVG جن میں ڈاکیومنٹ ٹائپ (document type) یا کسٹم اینٹیٹی ڈیکلریشنز (custom entity declarations) شامل ہوں، وہ پارسنگ کے عمل کو غیر محفوظ بنا سکتے ہیں۔
سیکیورٹی کو برقرار رکھنے کے لیے یہ ٹول ایسے تمام SVGs کو بلاک کر دیتا ہے جن میں ڈاکیومنٹ ٹائپ یا کسٹم اینٹیٹی ڈیکلریشنز موجود ہوں۔ اگر آپ کی فائل میں یہ عناصر موجود ہوں تو آپٹمائزیشن سے پہلے انہیں دستی طور پر ہٹانا لازمی ہے۔
پروسیسنگ اور رازداری کی پالیسی
اس ٹول کو استعمال کرتے وقت آپ کی رازداری کا مکمل خیال رکھا جاتا ہے۔ آپ کا SVG کوڈ آپ کے براؤزر میں ہی آپٹمائز کیا جاتا ہے۔ BroBroGo پر کچھ بھی اپ لوڈ نہیں کیا جاتا۔ تمام تر پروسیسنگ مقامی طور پر آپ کے اپنے کمپیوٹر یا موبائل کے براؤزر کے اندر انجام پاتی ہے۔
ٹول کے استعمال کے اصول اور حدود
بہتر کارکردگی اور سسٹم کے استحکام کے لیے اس ٹول میں کچھ تکنیکی حدود اور قوانین وضع کیے گئے ہیں:
- ان پٹ کی حد: ان پٹ ایریا میں پیسٹ کیا گیا SVG کوڈ ایک مخصوص کریکٹر لمیٹ کے اندر ہونا چاہیے۔
- ٹائم آؤٹ کی حد: اگر آپٹمائزیشن کا عمل 15 سیکنڈ سے زیادہ وقت لے تو براؤزر پر بوجھ سے بچنے کے لیے عمل کو روک دیا جاتا ہے۔
- عمل کی منسوخی: اگر آپٹمائزیشن کے دوران ان پٹ کو صاف (clear) کیا جائے یا اس میں کوئی تبدیلی کی جائے، تو جاری عمل فوری طور پر ختم ہو جاتا ہے۔
ان پٹ اور پروسیسنگ کے دوران پیش آنے والی مختلف صورتحال کے مطابق ٹول درج ذیل پیغامات ظاہر کرتا ہے:
- اگر ان پٹ خالی ہو تو پیغام ملتا ہے: "پہلے SVG کوڈ پیسٹ کریں۔"
- اگر ان پٹ میں کوئی SVG ایلیمنٹ موجود نہ ہو تو ٹول ظاہر کرتا ہے: "کوئی <svg> ایلیمنٹ نہیں ملا۔"
- اگر فائل میں ڈاکیومنٹ ٹائپ یا کسٹم اینٹیٹی ہو تو پیغام آتا ہے: "یہ SVG ایک ڈاکیومنٹ ٹائپ یا کسٹم اینٹیٹی استعمال کرتا ہے۔ آپٹمائز کرنے سے پہلے اسے ہٹائیں۔"
- اگر فائل مقررہ حد سے بڑی ہو تو پیغام ظاہر ہوتا ہے: "یہ SVG اس ٹول کے لیے بہت بڑا ہے۔ اسے
{max}حروف سے کم رکھیں۔" - اگر پروسیسنگ میں 15 سیکنڈ سے زیادہ وقت لگے تو ٹول کہتا ہے: "اس میں بہت زیادہ وقت لگا اور عمل روک دیا گیا — کوئی چھوٹا SVG آزمائیں۔"
- اگر کامیابی سے سائز کم ہو جائے تو پیغام ملتا ہے: "آپٹمائز کر دیا گیا —
{pct}% چھوٹا ({saved}کی بچت)۔" - اگر کوڈ صاف ہو جائے لیکن سائز میں کوئی کمی نہ ہو تو پیغام ظاہر ہوتا ہے: "آپٹمائز کر دیا گیا۔ محفوظ کلین اپ سیٹ کے ساتھ سائز میں کوئی بچت نہیں ہوئی۔"
- کسی بھی نامعلوم خرابی کی صورت میں ٹول ظاہر کرتا ہے: "اس SVG کو آپٹمائز نہیں کیا جا سکا۔"
اکثر پوچھے گئے سوالات (FAQ)
یہ کیا چیزیں ہٹاتا ہے؟
یہ تبصرے، میٹا ڈیٹا، ایڈیٹر نیم اسپیسز، ایٹریبیوٹ کی اضافی اسپیسنگ، غیر استعمال شدہ نیم اسپیسز اور مختصر مساوی رنگوں کو ہٹا دیتا ہے۔ یہ viewBox، آئی ڈیز، لیبلز اور جیومیٹری کو برقرار رکھتا ہے۔
کیا یہ ہر SVG کو آپٹمائز کر سکتا ہے؟
یہ عام ان لائن SVG کوڈ کو ہینڈل کرتا ہے۔ ایسے SVGs جن میں ڈاکیومنٹ ٹائپ یا کسٹم اینٹیٹی ڈیکلریشنز ہوں انہیں بلاک کر دیا جاتا ہے کیونکہ وہ پارسنگ کو غیر محفوظ بنا سکتے ہیں۔ ان ڈیکلریشنز کو ہٹائیں اور دوبارہ کوشش کریں۔
کیا اس سے گرافک کی ظاہری شکل بدل جائے گی؟
آپٹمائزر پاتھ ری رائٹس، آئی ڈی کا نام بدلنے، viewBox کو ہٹانے اور پریسیشن راؤنڈنگ سے گریز کرتا ہے۔ اگر آپ کا SVG ڈیزائن ورک فلو کے لیے تبصروں یا میٹا ڈیٹا پر انحصار کرتا ہے، تو اصل کی ایک کاپی اپنے پاس محفوظ رکھیں۔
کیا میرا کوڈ کسی سرور پر بھیجا جاتا ہے؟
جی نہیں، آپ کا SVG کوڈ آپ کے براؤزر میں ہی آپٹمائز کیا جاتا ہے۔ BroBroGo پر کچھ بھی اپ لوڈ نہیں کیا جاتا۔