Przedstawiamy Squoosh v2

Obsługa kodeków, zmieniony wygląd i obsługa interfejsu wiersza poleceń.

Mariko Kosaka

Squoosh to aplikacja do kompresji obrazów stworzona i zaprezentowana przez nasz zespół na konferencji Chrome Dev Summit 2018. Stworzyliśmy ją, żeby ułatwić eksperymentowanie z różnymi kodekami i zaprezentować możliwości współczesnego internetu.

Dzisiaj udostępniamy dużą aktualizację aplikacji o większej obsłudze kodeków, nowego projektu i nowego sposobu korzystania ze Squoosh w wierszu poleceń o nazwie Squoosh CLI.

Obsługa nowych kodeków

Oprócz kodeków natywnie obsługiwanych przez Twoją przeglądarkę obsługujemy obecnie OxiPNG, MozJPEG, WebP i AVIF. Dzięki wykorzystaniu WebAssembly ponownie opracowano nowy kodek. Dzięki kompilowaniu kodera i dekodera w postaci modułu WebAssembly użytkownicy mogą uzyskiwać dostęp do nowszych kodeków i eksperymentować z nimi, nawet jeśli preferowana przez nich przeglądarka ich nie obsługuje.

Uruchamiam Squoosh w wierszu poleceń.

Od premiery w 2018 roku, częstym żądaniem użytkowników jest automatyczna interakcja ze Squoosh bez interfejsu użytkownika. Mieliśmy pewne wątpliwości związane z tą ścieżką, ponieważ nasza aplikacja była interfejsem użytkownika opartym na narzędziach kodeków opartych na wierszu poleceń. Rozumiemy jednak tę potrzebę korzystania z całego pakietu kodeków, a nie z wielu narzędzi. Squoosh CLI właśnie to robi.

Wersję beta Squoosh CLI możesz zainstalować, uruchamiając npm i @squoosh/cli lub bezpośrednio za pomocą npx @squoosh/cli [parameters].

Interfejs wiersza poleceń Squoosh jest napisany w Node i korzysta z dokładnie tych samych modułów WebAssembly, których używa PWA. Dzięki wykorzystaniu instancji roboczych wszystkie obrazy są dekodowane, przetwarzane i kodowane równolegle. Za pomocą usługi o pełnym zakresie łączymy też wszystkie elementy w jednym pliku JavaScript, aby zapewnić szybką i bezproblemową instalację za pomocą platformy npx. Interfejs wiersza poleceń zapewnia również automatyczną kompresję, która pozwala jak najbardziej obniżyć jakość obrazu bez pogorszenia jakości obrazu (przy użyciu danych Butteraugli).

Za pomocą interfejsu wiersza poleceń Squoosh możesz kompresować obrazy z aplikacji internetowej do różnych 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, dzięki którym kompresja obrazów stanie się automatycznie częścią procesu kompilacji.

Zmiana procesu kompilacji z pakietu internetowego na pakiet o pełnym zakresie

Ten sam zespół, który stworzył Squoosh, spędził w tym roku wiele czasu na przygotowywanie narzędzi do tworzenia raportów o narzędziach i zdecydował się zmienić proces kompilacji z Webpack na o pełny zakres.

Początkowo chcieliśmy wypróbować pakiet Webpack w zespole. W 2018 roku Webpack był jedynym narzędziem, które dało nam dostateczną kontrolę i mogło skonfigurować go zgodnie z oczekiwaniami. Z czasem przekonaliśmy się, że rozwiązanie Rollup jest łatwe w obsłudze i prostota obsługi ESM sprawiła, że nasz projekt stał się naturalnym wyborem.

Zaktualizowany interfejs użytkownika

Zmieniliśmy też interfejs aplikacji, dodając do niej blobs. To tylko garść słów na temat tego, jak traktujemy dane w kodzie. Squoosh przekazuje dane obrazu jak obiekty blob, więc naturalnie wydaje się, że w projekcie widać kilka blobów.

Dopracowano też użycie kolorów, dzięki czemu był on czymś więcej niż tylko akcentem, lecz także wektorem do wyróżnienia i uwydatnienia tego, który obraz pasuje do kontekstu. W rezultacie strona główna staje się bardziej urozmaicona, a narzędzie staje się bardziej przejrzyste i zwięzłe.

Co dalej?

Planujemy nadal pracować nad Squoosh. Po wprowadzeniu nowego formatu obrazów chcemy zapewnić użytkownikom miejsce, w którym będą mogli bawić się kodekiem bez ciężkiej pracy. Mamy też nadzieję zwiększyć możliwości korzystania ze Squoosh CLI i jeszcze więcej integracji z procesem tworzenia aplikacji internetowych.

Squoosh zawsze był aplikacją open source, ale nigdy nie koncentrowaliśmy się na rozwijaniu społeczności. W 2021 roku chcemy zwiększyć liczbę współtwórców i usprawnić proces wdrażania projektu.

Masz jakieś pomysły na Squoosh? Skontaktować się z nami, korzystając z naszego narzędzia do śledzenia problemów. Nasz zespół wybierze się na zimowe wakacje, ale obiecujemy wrócić do Ciebie w nowym roku.