Obsługa nowych kodeków, zaktualizowany wygląd i obsługa interfejsu wiersza poleceń
Squoosh to aplikacja do kompresji obrazów, którą nasz zespół stworzył i zaprezentował na konferencji Chrome Dev Summit 2018. Została ona opracowana, aby ułatwić eksperymentowanie z różnymi kodekami obrazów i zaprezentować możliwości nowoczesnego internetu.
Dziś udostępniamy dużą aktualizację aplikacji, która obejmuje obsługę większej liczby kodeków, nowy wygląd i nowy sposób korzystania z Squoosh w wierszu poleceń – Squoosh CLI.
Obsługa nowych kodeków
Oprócz kodeków natywnie obsługiwanych w przeglądarce obsługujemy teraz kodeki OxiPNG, MozJPEG, WebP i AVIF. Nowy kodek został ponownie udostępniony dzięki WebAssembly. Dzięki skompilowaniu kodera i dekodera kodeka jako modułu WebAssembly użytkownicy mogą uzyskiwać dostęp do nowszych kodeków i eksperymentować z nimi, nawet jeśli ich preferowana przeglądarka ich nie obsługuje.
Uruchamianie Squoosh w wierszu poleceń
Od czasu premiery w 2018 roku użytkownicy często prosili o możliwość programowego korzystania z Squoosh bez interfejsu. Mieliśmy co do tego mieszane uczucia, ponieważ nasza aplikacja była interfejsem opartym na narzędziach kodeków w wierszu poleceń. Rozumiemy jednak chęć korzystania z całego pakietu kodeków zamiast z wielu narzędzi. Squoosh CLI właśnie to umożliwia.
Wersję beta Squoosh CLI możesz zainstalować, uruchamiając npm i @squoosh/cli, lub uruchomić ją
bezpośrednio za pomocą npx @squoosh/cli [parameters].
Squoosh CLI jest napisany w Node i korzysta z tych samych modułów WebAssembly, których używa PWA. Dzięki szerokiemu wykorzystaniu instancji roboczych wszystkie obrazy są dekodowane, przetwarzane i kodowane równolegle.
Używamy też Rollup, aby spakować wszystko w jednym pliku JavaScript, co zapewnia szybką i bezproblemową instalację za pomocą
npx. Interfejs wiersza poleceń oferuje też automatyczną kompresję, która polega na maksymalnym zmniejszeniu
jakości obrazu bez pogorszenia jego jakości wizualnej
(przy użyciu metryki Butteraugli).
Za pomocą Squoosh CLI możesz kompresować obrazy w aplikacji internetowej do wielu formatów i używać elementu
<picture>
aby przeglądarka mogła wybrać najlepszą wersję. Planujemy też utworzyć
wtyczki do Webpack, Rollup i innych narzędzi do kompilacji, aby kompresja obrazów
stała się automatyczną częścią procesu kompilacji.
Zmiana procesu kompilacji z Webpack na Rollup
Ten sam zespół, który stworzył Squoosh, poświęcił w tym roku dużo czasu na analizę narzędzi do kompilacji na potrzeby raportu Tooling Report i postanowił zmienić proces kompilacji z Webpack na Rollup.
Projekt został początkowo rozpoczęty z Webpack, ponieważ chcieliśmy wypróbować to narzędzie jako zespół, a w tamtym czasie w 2018 roku Webpack był jedynym narzędziem, które dawało nam wystarczającą kontrolę, aby skonfigurować projekt tak, jak chcieliśmy. Z czasem stwierdziliśmy, że prosty system wtyczek i prostota Rollup w przypadku ESM sprawiły, że jest to naturalny wybór dla tego projektu.
Zaktualizowany wygląd interfejsu
Zaktualizowaliśmy też wygląd interfejsu aplikacji, w którym elementem wizualnym jest blobs. To mały
żart dotyczący sposobu, w jaki traktujemy dane w naszym kodzie. Squoosh przekazuje dane obrazu jako blob, więc naturalne było uwzględnienie w projekcie kilku blobów.
Udoskonaliliśmy też użycie kolorów, tak aby kolor był nie tylko akcentem, ale też wektorem, który pozwala odróżnić i wzmocnić, który obraz jest w kontekście opcji. Podsumowując, strona główna jest nieco bardziej żywa, a samo narzędzie – bardziej przejrzyste i zwięzłe.
Co dalej?
Planujemy dalsze prace nad Squoosh. Gdy pojawi się nowy format obrazu, chcemy, aby użytkownicy mogli eksperymentować z kodekiem bez konieczności wykonywania skomplikowanych czynności. Mamy też nadzieję na rozszerzenie użycia Squoosh CLI i lepsze zintegrowanie go z procesem kompilacji aplikacji internetowej.
Squoosh zawsze był projektem open source, ale nigdy nie skupialiśmy się na rozwijaniu społeczności. W 2021 roku, planujemy zwiększyć liczbę współtwórców i ulepszyć proces wdrażania do projektu.
Masz jakieś pomysły na Squoosh? Podziel się nimi w naszym narzędziu do śledzenia problemów. Nasz zespół udaje się na dłuższe zimowe wakacje, ale obiecujemy, że wrócimy do Ciebie w nowym roku.