SVG ليس خيارًا جيدًا للألعاب

نشرت: 2023-02-05

SVG ، أو Scalable Vector Graphics ، هو تنسيق ملف لرسومات متجهة ثنائية الأبعاد . يعتمد على XML ، مما يعني أنه يمكن إنشاؤه وتحريره باستخدام محرر نصوص ، وغالبًا ما يستخدم في الرسوم التوضيحية والمخططات والشعارات. ومع ذلك ، فإن SVG غير مناسب تمامًا للألعاب لعدة أسباب. أولاً ، تكون ملفات SVG بشكل عام أكبر من الصور النقطية مثل PNG أو JPG. هذا لأنها تحتوي على الكثير من المعلومات التفصيلية حول الأشكال داخل الصورة. بالنسبة لصورة بسيطة ، فهذه ليست مشكلة كبيرة ، ولكن بالنسبة للصورة الكبيرة أو المعقدة ، يمكن أن تجعل الملف كبيرًا بشكل كبير. ثانيًا ، لا تدعم جميع متصفحات الويب ملفات SVG بشكل مباشر. Internet Explorer ، على سبيل المثال ، يدعم ملفات SVG فقط من الإصدار 9 فصاعدًا. هذا يعني أن المتصفحات أو الأجهزة القديمة قد لا تكون قادرة على عرض صور SVG بشكل صحيح ، أو قد لا تتمكن على الإطلاق. ثالثًا ، والأهم من ذلك ، لم يتم تصميم SVG للرسوم المتحركة. بخلاف التنسيقات مثل GIF أو Flash ، لا يدعم SVG الرسوم المتحركة القائمة على الإطارات. هذا يعني أنك إذا كنت تريد إنشاء رسم متحرك بسيط ، مثل شعار دوار ، فستحتاج إلى إنشاء كل إطار من الرسم المتحرك كملف SVG منفصل. هذا يستغرق وقتًا طويلاً وغير عملي. لهذه الأسباب ، فإن SVG غير مناسب تمامًا للاستخدام في الألعاب. ومع ذلك ، يظل تنسيقًا شائعًا للرسوم التوضيحية والرسوم البيانية والشعارات ، نظرًا لصغر حجم الملف وسهولة التحرير ودعم المستعرض الواسع.

نظرًا لوجود العديد من الميزات المضمنة في عنصر SVG في HTML5 ، يمكن لمطوري الألعاب استخدامها بسهولة لتحسين تطوير ألعابهم. في معظم الحالات ، يعمل عنصر Canvas بشكل جيد مع بيئة لعبة قماشية ؛ ومع ذلك ، من المهم للغاية مراعاة اللعبة نفسها عند اختيار عنصر لوحة الرسم. المفتاح هو أن تكون على دراية بتقلبات الأعمال التجارية. الأمر متروك لك فيما إذا كنت تريد استخدام تقنية معينة لعنصر لعبة معين. تُستخدم بيانات المتجه ثنائية الأبعاد في SVG ، وهي تقنية رائعة. تتيح الطبيعة النظرية لهذا النموذج استخدام العمليات الحسابية ثنائية الأبعاد. إنه متوفر في أي متصفح تقريبًا ويعمل بسرعة. بالإضافة إلى ذلك ، يمكنك حفظ الصورة كملف SVG عن طريق رسم الأصول في أي برنامج متجه مثل Inkscape أو Illustrator ، ثم تصدير ورقة الرموز المتحركة وتحميلها.

إنها فكرة جيدة أن تقوم بتجميع الصور في SVG ، لذلك بمجرد أن تكون على العميل ، يمكنك تحويلها إلى صور نقطية واستخدامها لتقديم لعبتك. تتمثل ميزة وجود مقياس منفصل لصور SVG والصور الصغيرة في قدرتك على إنشاء صور مستقلة عالية الدقة.

سيتمكن مطورو الألعاب من الاستفادة من العديد من الميزات التي تم تضمينها بالفعل في عنصر SVG ، والتي يمكن الوصول إليها في html5. هناك بعض المواقف التي يمكن أن تكون فيها مزايا SVG مفيدة ، ولكن من الواضح أن العنصر غير مناسب لكل مفهوم لعبة.

تمت إزالة هذه الميزة من قائمة الميزات الموصى بها. هناك متصفحات تستمر في دعمها ، ولكن ربما تمت إزالتها بالفعل من معايير الويب ذات الصلة ، أو في طور الإزالة ، أو الغرض منها فقط استخدامها لأسباب تتعلق بالتوافق.

هناك عيوب في استخدام صور SVG ، وأبرزها عدم قدرتها على توفير الكثير من التفاصيل مثل التنسيقات الأخرى. نظرًا لأن SVGs مبنية على النقاط والمسارات بدلاً من وحدات البكسل ، فإنها لا توفر قدرًا كبيرًا من التفاصيل مثل تنسيقات الصور التقليدية.

لماذا لا تستخدم Svg؟

لماذا لا تستخدم Svg؟
مصدر الصورة: Clipground

هناك عدة أسباب قد تجعل شخصًا ما يختار عدم استخدام SVG. أولاً ، نظرًا لأن SVG هو تنسيق متجه ، فقد يكون إنشاء رسومات معقدة أكثر صعوبة. إذا كنت بحاجة إلى إنشاء رسم بألوان أو تدرجات مختلفة ، فقد تجد أنه من الأسهل استخدام تنسيق نقطي مثل PNG أو JPG. ثانيًا ، يمكن أن تكون ملفات SVG أكبر من الملفات النقطية ، لذا فقد لا تكون مثالية للاستخدام على مواقع الويب حيث يكون وقت تحميل الصفحة مصدر قلق. أخيرًا ، لا تدعم بعض المتصفحات القديمة (بما في ذلك Internet Explorer 8 والإصدارات الأقدم) SVG ، لذلك ستحتاج إلى توفير تنسيق احتياطي لهؤلاء المستخدمين.

نظرًا لأنه يعتمد على المتجهات ، فإنه لا يعاني من نفس مشكلات JPEG ، والتي تهتم بشكل أساسي بالتفاصيل والأنسجة. بالإضافة إلى ذلك ، يتوافق SVG مع غالبية المتصفحات الحديثة ، مما يجعله خيارًا رائعًا لأي مشروع.


لعبة Svg

لعبة Svg
مصدر الصورة: shopify

SVG (Scalable Vector Graphics) هو تنسيق صورة متجه مستند إلى XML للرسومات ثنائية الأبعاد مع دعم للتفاعلية والرسوم المتحركة. مواصفات SVG هي معيار مفتوح تم تطويره بواسطة World Wide Web Consortium (W3C) منذ 1999. يتم تعريف صور SVG وسلوكياتها في ملفات نصية XML. هذا يعني أنه يمكن البحث عنها وفهرستها وبرمجتها وضغطها. كملفات XML ، يمكن إنشاء صور SVG وتحريرها باستخدام أي محرر نصوص ، ولكن غالبًا ما يتم إنشاؤها باستخدام برامج الرسم . ثم يتم دمجها في ملف واحد ، مما يسهل توزيعها ومعالجتها.

قماش مقابل Svg

توجد بعض الاختلافات الرئيسية بين Canvas و svg: - يتم عرض Canvas بكسل ببكسل بينما تعتمد svg على المتجهات - تعد Canvas رائعة للرسومات والرسوم المتحركة المعقدة بينما تعد svg أفضل للرسومات والرموز البسيطة - لا تعد اللوحة القماشية تفاعلية بينما تكون svg - لا يمكن الوصول إلى Canvas أثناء وجود svg - يمكن أن يكون أداء Canvas أفضل أو أسوأ اعتمادًا على المتصفح بينما يكون svg ثابتًا دائمًا

Scalable Vector Graphics (SVG) هو اسم آخر لـ Scalable Graphics. يتم رسم الرسومات على صفحة ويب باستخدام عنصر Canvas HTML. سنستعرض الاختلافات الرئيسية في كل من هذين الخيارين في غضون لحظة. بالإضافة إلى ذلك ، نناقش الاختلافات الرئيسية بين الرسوم البيانية وجداول المقارنة.

يمكن استخدام الرسومات المتجهة ، مثل SVG ، لمجموعة متنوعة من التطبيقات. نظرًا لأن الأشكال سهلة التلاعب بها باستخدام برامج المتجهات ، فيمكن استخدامها لإنشاء رسومات. باستخدام هذا التنسيق ، يكون أداء عدد أصغر من الكائنات أو الأسطح الأكبر أفضل. من ناحية أخرى ، يعد Canvas تنسيقًا رسوميًا أكثر تقليدية يمكن استخدامه لمجموعة واسعة من الرسومات. كجزء من التطبيق ، يتلقى المستخدم سلسلة من الصور على التوالي. بالمقارنة مع SVG ، قد يكون هذا التنسيق أكثر كثافة في استخدام الموارد وقد لا يوفر أداءً جيدًا للأسطح الأصغر أو لعدد أكبر من الكائنات. من الأهمية بمكان تحديد تنسيق مناسب لمشروع معين.

اللغتان: Svg Vs. اللوحة القماشية

يعد الرسم باستخدام الرسومات المتجهة طريقة شائعة لاستخدام لغة SVG . يستخدم Canvas أسلوبًا قائمًا على البيانات النقطية لرسم وحدات البكسل.