بچووککەرەوە و باشترکەری SVGی بەخۆڕایی

چۆن کار دەکات

ئەم ئامرازە قەبارەی فایلی SVG کەم دەکاتەوە بە بەکارهێنانی باشترکەرێکی دەستنووس کە تەواو لە وێبگەڕەکەتدا ڕادەبات — هیچ کتێبخانە، سێرڤەر. تێکەڵی دوو تێپەڕ دەکات: DOMParser/XMLSerializerی سەرەکی وێبگەڕ بۆ کاری وردی ئاستی-تایبەتمەندی، و جێگۆڕکێی ڕێجێکسی ئامانجدار بۆ لادانی لێدوان، لابردنی داتای وردەکاری، و دادڕمانی بۆشایی.

1. 1
   DOMParser SVGـەکە سەلامەت دەکات

   پێش هەر باشترکردنێک، DOMParserی سەرەکی وێبگەڕ SVGـەکە وەک XML دەخوێنێتەوە و هەر توخمێک دەگەڕێت. تاگی سکریپت، کۆنترۆڵکەری ڕووداو (هەر تایبەتمەندییەکی on*)، توخمی ئەنیمەیشن، و ئاماژەی URLی دەرەکی بەبێ مەرج لادەبردرێن — ئەمە ڕادەبات بێگومان لە کام بژاردەی باشترکردن هەڵدەبژێریت.
2. 2
   خڕکردنەوەی دەیی بەسەر بنەمای DOM

   ئەگەر خڕکردنەوەی دەیی چالاکبێت، باشترکەرەکە DOMی شیکراو جارێکی دووەم دەگەڕێت و خڕکردنەوە تەنها بۆ تایبەتمەندی ژمارەیی زانراو جێبەجێدەکات (داتای dی path، کۆردینەیت، نرخی transform، پانی stroke، هتد)، بە بەکارهێنانی ڕێجێکسێک کە ژمارەی هەڵبژیوسی تاک هاوتا دەکات بەبێ تێکدانی نرخی بەیەکەوەبەستراوی path وەک .5.5.
3. 3
   تێپەڕی ڕێجێکس نیشانەی سیریالایزکراو پاک دەکاتەوە

   XMLSerializer XMLی ستانداردکراو دروستدەکات، پاشان جێگۆڕکێی ڕیزبەندی ئامانجدار لێدوانی HTML، داتای وردەکاری دەستکاریکەری Inkscape/Sodipodi، ڕاگەیاندنی XML، تایبەتمەندی بنەڕەتی زیادە (وەک version="1.1")، و بۆشایی نێوان-تاگ لادەبات — هەر تێپەڕێک بە فراوانی سووک بۆیە ناوەڕۆکی گرێی دەق هەرگیز دەستکاری ناکرێت.
4. 4
   قەبارەی Gzip و فۆرماتی دەرهێنان

   APIی CompressionStreamی وێبگەڕ قەبارەی ڕاستەقینەی gzipی هەردوو داخڵ و دەرچوون ژمێردەکات، چونکە ئەوە ئەوەیە کە بەڕاستی تێچووی گواستنەوە لەسەر وێبدا دیاری دەکات. SVGی باشترکراو دەتوانرێت داگیرێت، وەک SVGی خاو کۆپی بکرێت، بۆ تایبەتمەندی camelCaseی ئامادەی JSXی React بگۆڕدرێت، یان وەک لینکی داتای CSS کۆدبکرێت — هەموو گۆڕینەکان بەشێوەیەکی ناوخۆیی ڕوودەدەن.

ئامرازە پەیوەندیدارەکان