Jak działa Kompresor SVG
Plik SVG zapisany w Illustratorze, Inkscape, Figmie lub Sketchu zwykle zawiera wiele rzeczy, których przeglądarka nigdy nie używa: metadane edytora, komentarze, ukryte warstwy, wartości domyślne zapisane w całości i współrzędne z ośmioma lub więcej miejscami po przecinku. To narzędzie usuwa to wszystko za pomocą SVGO, optymalizatora SVG open source, na którym polega większość narzędzi do budowania i aplikacji projektowych, więc rysunek wygląda tak samo, a plik jest mniejszy.
SVGO przechodzi przez plik w kilku przebiegach. Scala i skraca ścieżki, zaokrągla liczby do wybranej precyzji, zwija zbędne grupy, usuwa puste elementy i zapisuje kolory w najkrótszej postaci. viewBox jest zachowywany, więc plik SVG nadal skaluje się do dowolnego rozmiaru, a identyfikatory, do których odwołują się inne części pliku, są skracane wraz z aktualizacją odwołań, więc gradienty i maski nadal działają.
Precyzja to jedyne ustawienie, które ma znaczenie. Wysoka zachowuje trzy miejsca po przecinku, co przy każdym normalnym rozmiarze jest niewidoczne i stanowi bezpieczny wybór dla ikon i logo. Zrównoważona zachowuje dwa, a Najmniejsza jedno, co pasuje do dużych ilustracji, w których jedna dziesiąta jednostki to znacznie mniej niż piksel, ale może zniekształcić bardzo małe ikony. Jeśli wynik wygląda nie tak, skompresuj oryginał ponownie z wyższą precyzją.
Optymalizator, około 200 KB, ładuje się przy pierwszym naciśnięciu przycisku. Twoje pliki SVG są odczytywane i zapisywane na nowo w tej karcie i nigdy nie są przesyłane, co ma znaczenie w przypadku nieopublikowanych logo i grafik klientów.
Kompresor SVG: opcje
| Wysoka | Trzy miejsca po przecinku. Bezpieczne dla ikon, logo i wszystkiego, co małe. |
|---|---|
| Zrównoważona | Dwa miejsca po przecinku. Dobre dla większości ilustracji. |
| Najmniejszy plik | Jedno miejsce po przecinku. Do dużych grafik; potem sprawdź małe ikony. |
| Zachowywane | viewBox, identyfikatory, do których są odwołania, gradienty, maski i wygląd rysunku. |
| Usuwane | Metadane edytora, komentarze, ukryte i puste elementy, nadmiarowa precyzja. |
Kiedy go używać
Kompresuj pliki SVG przed umieszczeniem ikon i logo na stronie internetowej, gdzie każdy kilobajt wydłuża ładowanie strony, przed osadzeniem pliku SVG w HTML lub komponencie React, przed dodaniem zasobów projektowych do repozytorium kodu albo gdy formularz przesyłania ogranicza rozmiar pliku.
Zachowaj oryginalny, edytowalny plik SVG do swojej aplikacji projektowej. Optymalizacja usuwa dane edytora, takie jak nazwy warstw i linie pomocnicze, więc gdy chcesz edytować grafikę, otwórz oryginał.
O optymalizatorze SVG
SVGO, skrót od „SVG Optimizer”, to narzędzie open source stojące za optymalizacją SVG w większości narzędzi do budowania stron i w aplikacjach projektowych oferujących zoptymalizowany eksport. Parsuje plik SVG do drzewa, przepuszcza je przez zestaw dobrze przetestowanych kroków porządkujących i zapisuje z powrotem, powtarzając to, dopóki nie da się nic więcej zaoszczędzić. Każdy krok, który tu wykonuje, zachowuje wygląd rysunku, dlatego jego ustawieniom domyślnym ufa się w środowiskach produkcyjnych. Wersja używana na tej stronie działa w całości w przeglądarce i jest ładowana z CDN jsDelivr przy pierwszym użyciu narzędzia.
Kompresor SVG: rozwiązywanie problemów
„już zoptymalizowany; zwrócono bez zmian”
Plik SVG został już zoptymalizowany, więc nie dało się niczego usunąć bez jego zmiany. Oferowany jest z powrotem oryginalny plik.
Część rysunku przesunęła się lub wygięła
Bardzo małe ikony mogą się przesunąć przy niskiej precyzji. Skompresuj oryginał ponownie z precyzją Wysoka.
„nie jest plikiem SVG”
Plik nie zawiera rysunku SVG. Plików wyeksportowanych jako SVG, które jedynie opakowują obraz bitmapowy, też nie da się znacząco zmniejszyć; zamiast tego skompresuj obraz, który zawierają.
Jak używać Kompresora SVG krok po kroku
- Naciśnij „Wybierz pliki SVG” lub przeciągnij pliki na pole.
- W razie potrzeby ustaw opcje; ustawienia domyślne sprawdzają się w większości zastosowań.
- Naciśnij „Kompresuj SVG”. Praca odbywa się na twoim urządzeniu.
- Zapisz wynik jego przyciskiem pobierania.
Czy robienie tego online jest bezpieczne?
W większości narzędzi online „online” oznacza, że twój plik jest przesyłany na serwer firmy, tam przetwarzany i przechowywany przez jakiś czas, zanim zostanie usunięty. Tutaj tak nie jest. Strona pobiera kod narzędzia do twojej przeglądarki, a twój plik jest odczytywany i przetwarzany w karcie, na twoim własnym urządzeniu. Nigdy nie jest wysyłany do TapToConvert ani do nikogo innego.
Możesz to sprawdzić sam: gdy strona i jej silnik się załadują, wyłącz Wi-Fi, a narzędzie nadal działa. Oznacza to również brak kolejki, brak dziennego limitu i brak limitu rozmiaru pliku narzuconego przez serwer; jedynym ograniczeniem jest pamięć, jaką przeglądarka przydziela jednej karcie.
Kompresor SVG: najczęstsze pytania
Czy kompresja zmieni wygląd mojego pliku SVG?
Przy precyzji Wysoka nie ma widocznych zmian. Niższa precyzja mocniej zaokrągla współrzędne, co może wygiąć bardzo drobne szczegóły.
O ile mniejszy będzie plik?
Pliki SVG wyeksportowane z aplikacji projektowych często zmniejszają się o 30 do 70 procent. Pliki SVG, które już były zoptymalizowane, zmniejszają się niewiele lub wcale.
Czy nadal mogę edytować skompresowany plik SVG?
Tak, ale nazwy warstw, linie pomocnicze i ustawienia edytora znikają. Do edycji zachowaj oryginał.
Czy moje pliki są przesyłane?
Nie. SVGO działa w twojej przeglądarce, więc plik SVG nigdy nie opuszcza twojego urządzenia.
Czy to jest darmowe?
Tak. Bez rejestracji, bez znaku wodnego i bez limitu użycia. TapToConvert utrzymuje się z reklam.
Czy moje pliki są przesyłane?
Nie. Wszystko odbywa się w karcie przeglądarki, na twoim własnym urządzeniu.