SVG ოპტიმიზატორი და მინიფიკატორი უფასოდ
ამოიღეთ მეტამონაცემები, ჩაიკეცოს სივრცეები და მომრგვალეთ ათობითი ნიშნები SVG ფაილის ზომის მნიშვნელოვნად შემცირებისთვის — ტიპიური შემცირება 30-70%. ვიზუალური გადახედვა ამოწმებს, რომ არაფერი დამტყდება.
ჩააგდეთ ფაილი აქ ან დააწკაპუნეთ არჩევისთვის
SVG · მუშავდება თქვენს მოწყობილობაზე
ან დააჭირეთ Ctrl+V-ს ბუფერიდან ჩასასმელად
თქვენი ფაილები არასოდეს ტოვებს თქვენს მოწყობილობას. ყველა დამუშავება ხდება ადგილობრივად თქვენს ბრაუზერში.
გავრცელებული გამოყენება
- SVG ხელსაწყო პროდუქცია გამოისაჭირო მეტა-ემოცია icon SVG-ი დან წინ აგზავნა - ტიპიკური 50-80% მცირე.
- ბრენდი ლოგო SVG-ი გამოიშეამცირეთ SVG ლოგოს ფაილის ზომა ვებსაიტის სწრაფი ჩატვირთვისთვის ხარისხის დაკარგვის გარეშე.
- ილუსტრაციები და Hero SVG-ი გამოიუფრო დიდი ილუსტრაციებისთვის (qvnebi, dekorative გრაფიკა), optimization შეუძლია 30-70% ფajლი ზომა ამ.
- JavaScript Bundle ზომა შემცირებაროდესაც SVG-ი დაკარგული React ელემენტი ან code შიგნით დაკარგული, optimization დაკარგული JS bundle.
- Figma / Sketch SVG ექსპორტი სუფთაFigma და Sketch SVG ექსპორტი აქვს ფართო meta-ბანკი. მოხსნა production before გამოი.
როგორ მუშაობს
ეს ხელსაწყო SVG ფაილის ზომას ამცირებს, ხელით დაწერილი ოპტიმიზატორის გამოყენებით, რომელიც მთლიანად თქვენს ბრაუზერში მუშაობს — ბიბლიოთეკის, სერვერის გარეშე. ის ორ გავლას აერთიანებს: ბრაუზერის ჩაშენებულ DOMParser/XMLSerializer-ს, ატრიბუტ-დონის ზუსტი მუშაობისთვის, და მიზნობრივ regex ჩანაცვლებებს, კომენტარების მოშორების, მეტამონაცემების ამოღებისა და ცარიელი-ადგილის შემცირებისთვის.
- 1DOMParser ასუფთავებს SVG-სნებისმიერი ოპტიმიზაციის წინ, ბრაუზერის DOMParser კითხულობს SVG-ს XML-ად და გადის ყოველ ელემენტზე. Script ტეგები, ღონისძიების დამმუშავებლები (ნებისმიერი on* ატრიბუტი), ანიმაციის ელემენტები და გარე URL მითითებები ამოღებულია უპირობოდ — ეს ხდება იმისგან დამოუკიდებლად, რომელ ოპტიმიზაციის ვარიანტს აირჩევთ.
- 2DOM-ზე დაფუძნებული ათწილადის დამრგვალებათუ ათწილადის დამრგვალება ჩართულია, ოპტიმიზატორი ხელახლა გადის დამუშავებულ DOM-ზე და დამრგვალებას მხოლოდ ცნობილ, რიცხვით ატრიბუტებზე იყენებს (path d მონაცემები, კოორდინატები, transform მნიშვნელობები, ხაზის სისქეები და ა.შ.), regex-ის გამოყენებით, რომელიც ცალკეულ მცურავ-წერტილიან რიცხვებს ედარება, ჯაჭვური path მნიშვნელობების, როგორიცაა .5.5, დაზიანების გარეშე.
- 3Regex გავლები ასუფთავებს სერიალიზებულ მარკირებასXMLSerializer ნორმალიზებულ XML-ს გამოსცემს, შემდეგ მიზნობრივი სტრიქონული ჩანაცვლებები შლის HTML კომენტარებს, Inkscape/Sodipodi რედაქტორის მეტამონაცემებს, XML დეკლარაციას, ზედმეტ ნაგულისხმევ ატრიბუტებს (როგორიცაა version="1.1") და ტეგებს-შორის ცარიელ ადგილს — თითოეული გავლა ვიწროდაა შემოსაზღვრული, ასე რომ ტექსტის-კვანძის შიგთავსი არასდროს ეხება.
- 4Gzip ზომა და გამოტანის ფორმატებიბრაუზერის CompressionStream API ითვლის შესატანისა და გამომავალის ნამდვილ gzip ზომებს, რადგან სწორედ ეს განსაზღვრავს გადაცემის რეალურ ღირებულებას ვებში. ოპტიმიზირებული SVG შესაძლებელია ჩამოტვირთოთ, დაუმუშავებელ SVG-დ დააკოპიროთ, React JSX-მზა camelCase ატრიბუტებად გარდაქმნათ, ან CSS მონაცემთა URI-ად ჰკოდირო — ყველა გარდაქმნა ლოკალურად ხდება.
თქვენი SVG მთლიანად თქვენი ბრაუზერის ჩანართში იკითხება და მუშავდება — ფაილის ბაიტები არასდროს ტოვებს თქვენს მოწყობილობას.
დაკავშირებული ინსტრუმენტები
CSS მინიფიკატორი და ბიუტიფაიერი
შეამცირეთ CSS ფაილის ზომა ან გაალამაზეთ მინიფიცირებული CSS წაკითხვადობისთვის. მყისიერი, ბრაუზერში.
GIF-ის შემკუმშველი
შეამცირეთ ანიმირებული GIF-ის ზომა: ჩაატიეთ ზომის ზღვარში, მაგალითად, Discord-ის 256 KB ემოჯის ან 512 KB სტიკერის ზღვარში, ან თავად აირჩიეთ ფერები, სიგანე და კადრები. მუშაობს თქვენს ბრაუზერში; GIF არ იტვირთება.
PDF კომპრესორი
შეკუმშეთ PDF ფაილები ზომის შესამცირებლად. აირჩიეთ ხარისხის დონე — უფრო ძლიერი შეკუმშვა ნიშნავს უფრო პატარა ფაილს, მაგრამ სურათების დაბალ ხარისხს.