Jak działa Araluma

Krótka odpowiedź

Araluma stosuje architekturę hybrydową: dwa narzędzia działają w całości w przeglądarce bez przesyłania danych, natomiast dwa pozostałe kierują pojedyncze żądanie sieciowe przez własną infrastrukturę, gdy przeglądarka nie jest w stanie zapewnić porównywalnej jakości. Na każdym etapie — zarówno w narzędziu, jak i na tej stronie — informujemy, która ścieżka jest aktualnie aktywna.

Narzędzie	Gdzie odbywa się przetwarzanie
Circle Crop	W 100% w przeglądarce, Canvas API. Brak przesyłania, działa offline.
Compress — podgląd (suwak + porównanie formatów)	W 100% w przeglądarce, canvas.toBlob. Brak przesyłania.
Compress — finalne pobieranie	Jedno żądanie do naszego serwisu pod adresem api.araluma.com (Fastify + sharp + libvips na serwerze VPS w Niemczech).
Remove Background	Jedno żądanie do Cloudflare Worker uruchamiającego BiRefNet na GPU brzegowych Cloudflare, z awaryjnym trybem WebAssembly w przeglądarce, gdy usługa chmurowa jest niedostępna.

Twierdzenia o przetwarzaniu po stronie klienta można zweryfikować w ciągu około 30 sekund: wystarczy otworzyć DevTools → Network, wyczyścić log, a następnie skorzystać z narzędzia Circle Crop lub suwaka podglądu w Compress — nie pojawi się żadne żądanie przenoszące bajty obrazu poza stronę. W przypadku dwóch narzędzi korzystających z serwera widoczne będzie dokładnie jedno żądanie przesłania danych na operację, kierowane do wymienionych powyżej punktów końcowych.

Dlaczego architektura hybrydowa

Większość internetowych narzędzi do obróbki obrazów sytuuje się na jednym z dwóch krańców spektrum: albo przesyłają wszystko na serwer (użytkownik czeka na dwa przejazdy przez sieć, a operator przechowuje plik), albo działają wyłącznie w przeglądarce (kosztem jakości i szybkości na etapach kodowania i AI). Żadne z tych podejść nie jest optymalne we wszystkich przypadkach.

Przyjęto rozwiązanie po stronie klienta tam, gdzie przeglądarki osiągają już doskonałą jakość — element <canvas> obsługuje kadrowanie, obracanie i podgląd stratnego kodowania w JPG/WebP — oraz rozwiązanie serwerowe tam, gdzie przeglądarka mierzalnie ustępuje:

• Kompresja obrazu, przy finalnym pobieraniu. Serwerowe sharp + libvips 8.17 generuje pliki o 10–15% mniejsze bajt do bajtu niż kodery przeglądarki przy tej samej jakości wizualnej, a ponadto umożliwia dostęp do strojenia szybkości/chrominancji AVIF oraz wyjścia JPEG XL, które nie są dostępne z poziomu przeglądarki. Suwak i podgląd nadal działają w przeglądarce, dzięki czemu iteracja pozostaje natychmiastowa; jedynie naciśnięcie „Pobierz” trafia do naszego serwisu.
• Usuwanie tła z wykorzystaniem AI, na domyślnej ścieżce. Model BiRefNet uruchamiany przez Cloudflare cf.image.segment (ta sama architektura co remove.bg) wymaga prawdziwego GPU, aby zakończyć działanie w 1–3 sekundy. Tryb awaryjny działający w przeglądarce (ISNet przez ONNX Runtime + WebAssembly) jest funkcjonalny, ale przy pierwszym uruchomieniu trwa 20–40 sekund, a każde kolejne 2–10 sekund, i generuje wyraźnie grubsze wycinki na włosach, sierści i drobnych krawędziach.

Kosztem przyjętym za przetwarzanie serwerowe na tych dwóch ścieżkach jest jedno żądanie na operację. Kosztem, którego unika się dzięki przetwarzaniu po stronie klienta w pozostałych przypadkach (Circle Crop, podgląd Compress), jest opłata za przejazd sieciowy na częściach przepływu pracy, które wymagają najszybszej iteracji.

Potok przetwarzania krok po kroku

1. Użytkownik wybiera plik

Za pośrednictwem okna wyboru pliku, przeciągania i upuszczania lub wklejania przeglądarka przekazuje do JavaScript obiekt File. JavaScript odczytuje bajty przy użyciu FileReader lub Blob.arrayBuffer(). Na żadnym etapie tego kroku plik nie jest wysyłany przez sieć, niezależnie od używanego narzędzia.

2. Przeglądarka dekoduje obraz

Nowoczesne przeglądarki natywnie dekodują JPG, PNG, WebP, GIF i AVIF. Używamy createImageBitmap(), aby poza głównym wątkiem przekształcić surowe bajty w bitmapę gotową do pracy z GPU. W przypadku HEIC w przeglądarkach, które nie obsługują tego formatu natywnie, stosowany jest dekoder WebAssembly działający lokalnie w przeglądarce.

3. Narzędzie wykonuje swoje zadanie — tutaj ścieżki się rozchodzą

• Circle Crop. Transformacja pikseli Canvas 2D z okrągłą ścieżką przycinania. Bitmapa jest rysowana na <canvas> przy wybranej rotacji i zoomie, stosowane jest okrągłe przycinanie, a wnętrze okręgu jest odczytywane z powrotem jako ImageData. Cropper.js obsługuje interaktywną ramkę kadrowania. W całości w przeglądarce.
• Compress — podgląd i suwak. Ponowne kodowanie JPG, PNG, WebP lub AVIF przy użyciu canvas.toBlob, tak aby podgląd obok siebie aktualizował się podczas przesuwania suwaka jakości. W całości w przeglądarce. Brak przesyłania na tym etapie.
• Compress — Pobieranie. Po naciśnięciu „Pobierz” obraz jest wysyłany jednorazowo do api.araluma.com (serwis Fastify działający na serwerze VPS w Niemczech obsługiwanym przez Hostinger, Node 24 + sharp 0.34 + libvips 8.17, te same biblioteki C, których Squoosh używa na ścieżce serwerowej). Obraz jest ponownie kodowany z parametrami ustawionymi w podglądzie, a bajty są przesyłane strumieniowo z powrotem do przeglądarki. Serwis utrzymuje izolowaną dla każdego dzierżawcy pamięć podręczną adresowaną treścią (skrót bajtów wejściowych + parametrów) o pojemności ograniczonej do 500 MB, dzięki czemu ponowne pobranie tego samego obrazu z tymi samymi ustawieniami odtwarza zapisane bajty — pamięć podręczna nie jest indeksowana według użytkownika, adresu IP ani nazwy pliku. Jeśli serwis jest niedostępny, narzędzie cofa się do obiektu blob podglądu w przeglądarce.
• Remove Background — domyślna ścieżka chmurowa. Obraz jest przesyłany jednorazowo do Cloudflare Worker (araluma-bg-remover), tymczasowo przechowywany w prywatnym zasobniku R2 (araluma-bg-temp), przetwarzany przez transformację Cloudflare cf.image.segment uruchamiającą model BiRefNet na GPU brzegowych Cloudflare, a wycięty obraz jest przesyłany strumieniowo z powrotem. Tymczasowy obiekt R2 jest usuwany w ciągu jednej godziny przez regułę cyklu życia R2, niezależnie od wyniku operacji. Typowe zdjęcie jest przetwarzane w 1–3 sekundy. Dzienne limity dla adresu IP oraz limit 5 MB przesyłanego pliku pozwalają utrzymać bezpłatny poziom usługi.
• Remove Background — tryb awaryjny WebAssembly. Jeśli Worker jest niedostępny (przerwane połączenie sieciowe, restrykcyjna zapora, wyczerpany dzienny limit lub plik przekracza limit 5 MB dla chmury), narzędzie przejrzyście przełącza się na model ISNet działający lokalnie w przeglądarce za pośrednictwem ONNX Runtime Web z WebAssembly. Pierwsze uruchomienie pobiera model o rozmiarze ~80 MB i trwa 20–40 sekund; kolejne uruchomienia zajmują 2–10 sekund. Brak przesyłania na tej ścieżce — można to zweryfikować w DevTools.

4. Użytkownik pobiera wynik

Wyjściowa bitmapa jest kodowana do obiektu Blob, owijana w object URL i oferowana standardowemu oknu dialogowemu zapisu pliku w przeglądarce. Plik pojawia się na dysku.

Jak to samodzielnie zweryfikować

Do wyboru dwie metody:

Metoda 1 — Obserwacja zakładki Network

1. Otwórz Araluma w nowej zakładce i otwórz DevTools → Network.
2. Skorzystaj z Circle Crop lub suwaka podglądu Compress. Widoczne będą jedynie żądania dotyczące HTML/CSS/JS/czcionek oraz odpowiednich modułów WebAssembly przy pierwszym użyciu. Żadne żądanie nie będzie zawierało bajtów obrazu.
3. Teraz skorzystaj z Compress → Pobierz lub Remove Background. Widoczne będzie dokładnie jedno żądanie POST do api.araluma.com (Compress) lub do Worker usuwania tła, przenoszące obraz — oraz jedna odpowiedź z wynikiem. Po najechaniu kursorem na żądanie widoczny jest rozmiar i czas przetwarzania.

Kolumna „Initiator” wskazuje, który skrypt wywołał każde żądanie, a kolumna „Type” informuje, co zostało wysłane. Żadna z tych informacji nie jest ukrywana.

Metoda 2 — Korzystanie z narzędzi w trybie offline

1. Załaduj dowolną stronę narzędzia Araluma. Skorzystaj z Remove Background raz na małym obrazie, aby model ISNet w przeglądarce został zbuforowany.
2. Otwórz DevTools → Network → zaznacz pole Offline (lub wyłącz Wi-Fi).
3. Przeładuj stronę — zasoby statyczne są zbuforowane, więc strona nadal się wczyta.
4. Przetestuj każde narzędzie:
   • Circle Crop i podgląd Compress działają nadal — nigdy nie potrzebowały sieci.
   • Compress Pobierz cofa się do obiektu blob podglądu w przeglądarce (nieco mniej wydajne kodowanie, lecz funkcjonalne).
   • Remove Background przełącza się na model ISNet WebAssembly i działa bez żadnego żądania wychodzącego.

Jeśli cztery narzędzia działały offline (jedno nieco zdegradowane, trzy identycznie), żaden serwer nie miał dostępu do obrazu.

Co jest widoczne po naszej stronie — i co nie

Na ścieżkach po stronie klienta żadne informacje o obrazie nie są dostępne. Nie ma żądania do analizy, pamięci podręcznej do przechowywania danych ani linii logu do przeszukania.

Na ścieżkach po stronie serwera:

• Compress Pobierz ma dostęp do bajtów obrazu przez czas trwania kodowania (zazwyczaj kilkaset milisekund), przechowuje wpis pamięci podręcznej adresowanej treścią przez czas TTL i na tym koniec. Pamięć podręczna nie jest indeksowana według użytkownika, adresu IP, nazwy pliku ani żadnego identyfikatora, który mógłby posłużyć do odnalezienia konkretnego obrazu. Treść obrazów nie jest logowana. Serwis kodowania jest współdzielony przez dwóch dzierżawców, którym służył v1 przed migracją, z izolacją CORS, limitami przepustowości i kanonicznymi adresami URL podpisanymi HMAC na poziomie dzierżawcy.
• Remove Background ma dostęp do obrazu przez czas trwania tymczasowego przesłania i wywołania segmentacji (łącznie zazwyczaj 1–3 sekundy), po czym kopia tymczasowa jest usuwana przez regułę cyklu życia R2. Bajty obrazu nie są przekazywane do żadnego zewnętrznego dostawcy modelu — model BiRefNet działa wyłącznie w infrastrukturze Cloudflare, a nie przez zewnętrzne API w stylu remove.bg, fal.ai czy Replicate.

Na każdej ścieżce nasz dostawca analityki (Cloudflare Web Analytics) rejestruje zagregowane dane odsłon stron — adres URL, kraj, rodzinę przeglądarki, Core Web Vitals. Bez plików cookie, bez trwałych identyfikatorów, bez powiązania z konkretną osobą.

W przypadku narzędzi pobierających moduł WebAssembly przy pierwszym użyciu (dekoder HEIC, model ONNX ISNet), nasz dostawca hostingu widzi, że ktoś pobrał moduł — tak samo jak widzi pobranie pliku CSS. Sam moduł nie zawiera żadnych informacji o obrazie.

Pełny inwentarz danych znajduje się w naszej polityce prywatności.

Stos technologiczny

Dla zainteresowanych:

• Astro — generator stron statycznych. Każda strona jest dostarczana jako zwykły HTML z progresywnie ulepszonymi JavaScript „islands” wyłącznie tam, gdzie znajdują się interaktywne narzędzia.
• Vanilla CSS z właściwościami niestandardowymi — bez Tailwind, bez CSS-in-JS. Cały system projektowania to jeden plik tokens.css.
• canvas.toBlob / <canvas> — kodowanie JPEG, PNG, WebP, AVIF (obsługiwanych przez przeglądarkę) w podglądzie Compress oraz całe Circle Crop.
• Cropper.js — warstwa interakcji ramki kadrowania.
• ONNX Runtime Web — uruchamia awaryjny model ISNet WebAssembly dla Remove Background.
• Cloudflare Pages — hostuje statyczny build i dostarcza go z węzłów brzegowych.
• Cloudflare Workers + R2 + cf.image.segment (BiRefNet) — domyślny potok Remove Background.
• Fastify + sharp 0.34 + libvips 8.17 na Node 24 — serwis pobierania Compress pod adresem api.araluma.com, na serwerze VPS Hostinger w Niemczech.
• Cloudflare Web Analytics — zagregowane, pozbawione plików cookie zliczanie odsłon.

Obsługa przeglądarek

Wszystkie narzędzia działają w bieżącej i poprzedniej wersji Chrome, Firefox, Safari oraz Edge — zarówno na komputerze, jak i na urządzeniach mobilnych. Witryna stosuje progresywne ulepszanie: tam, gdzie przeglądarka obsługuje nowsze API (np. showSaveFilePicker, OffscreenCanvas), jest ono wykorzystywane; tam gdzie nie, stosowany jest starszy odpowiednik. Nie istnieje żaden ekran „Twoja przeglądarka nie jest obsługiwana”.

Jedynymi twardymi wymaganiami są JavaScript (dla dowolnego narzędzia) oraz połączenie sieciowe (wyłącznie przy korzystaniu z Compress Pobierz lub domyślnej ścieżki Remove Background — pozostałe ścieżki działają w pełni offline po pierwszym załadowaniu strony).

Pytania

Brakuje czegoś w powyższym opisie? Zapraszamy do kontaktu: support@araluma.com. Pytania techniczne są mile widziane.