Przytnij

Przytnij obraz Przytnij zdjęcie do koła

Optymalizuj

Kompresuj obraz Powiększ obraz Usuń tło

Edytuj

Zmień rozmiar obrazu

Konwertuj

Inne

JPG do PDF

Jak działa RoundCut

Szczegóły techniczne na temat tego, co robią narzędzia, gdzie działają i jak możesz to zweryfikować samodzielnie.

Krótka odpowiedź

RoundCut używa architektury hybrydowej: większość narzędzi działa w całości w Twojej przeglądarce z zerowym wysyłaniem, a garstka wysyła pojedyncze żądanie sieciowe przez naszą własną infrastrukturę, gdy przeglądarka nie potrafi dorównać jakości, zawsze z niewidocznym mechanizmem zapasowym po stronie klienta. Mówimy Ci, na której jesteś ścieżce, w każdym narzędziu i na tej stronie.

Poniższa tabela jest reprezentatywna, nie wyczerpująca (nowe narzędzia pojawiają się regularnie). Pokazuje po jednym przykładzie każdego rodzaju ścieżki:

Przykładowe narzędzieGdzie odbywa się praca
Kadrowanie do koła (tylko przeglądarka)100% w Twojej przeglądarce, Canvas API. Bez wysyłania, działa offline.
Podgląd kompresji (tylko przeglądarka)100% w Twojej przeglądarce, canvas.toBlob. Bez wysyłania. Suwak pozostaje natychmiastowy.
Końcowe pobranie kompresji (dotyka serwera)Jedna podróż w obie strony do naszej usługi na api.roundcut.com.br (Fastify + sharp + libvips na VPS w Niemczech), z mechanizmem zapasowym w przeglądarce.
Usuwanie tła (dotyka serwera)Jedna podróż w obie strony do Cloudflare Workera, który uruchamia BiRefNet na brzegowych GPU Cloudflare, z mechanizmem zapasowym na WebAssembly w Twojej przeglądarce, gdy chmura jest nieosiągalna.

Kadrowanie, zmiana rozmiaru, konwersja formatu (poza kodowaniem AVIF) i podgląd kompresji działają w pełni w Twojej przeglądarce. Usuwanie tła, pobranie kompresji, powiększanie z AI, kodowanie AVIF i PDF z wieloma obrazami każde wysyła pojedyncze żądanie i wraca do przeglądarki, gdy chmura jest nieosiągalna.

Możesz sprawdzić twierdzenia o stronie klienta w około 30 sekund: otwórz DevTools → Network, wyczyść dziennik, potem użyj narzędzia działającego tylko w przeglądarce, jak Kadrowanie do koła albo suwak podglądu kompresji, zobaczysz zero żądań wynoszących bajty Twojego obrazu poza stronę. Dla narzędzi dotykających serwera zobaczysz dokładnie jedno wysłanie na operację, do nazwanych punktów końcowych.

Dlaczego hybryda

Większość internetowych narzędzi do obrazów siedzi na jednym ekstremum: wyślij-wszystko-na-serwer (czekasz na podróże w obie strony, a operator przechowuje Twój plik) albo wszystko-w-przeglądarce (płacisz jakością i szybkością na krokach kodowania/AI). Żadne ekstremum nie wygrywa wszędzie.

Wybraliśmy stronę klienta tam, gdzie przeglądarki są już doskonałe, element <canvas> obsługuje kadrowanie, obracanie, zmianę rozmiaru i stratne kodowanie podglądu w JPG/WebP, oraz stronę serwera tam, gdzie przeglądarka wciąż mierzalnie przegrywa:

  • Kompresja obrazów, przy końcowym pobraniu. Serwerowe sharp + libvips 8.17 daje pliki o 10-15% mniejsze bajt w bajt niż kodery przeglądarki przy tej samej jakości wizualnej i daje dostęp do strojenia szybkości/chromy AVIF oraz wyjścia JPEG XL, których przeglądarka nie udostępnia. Suwak i podgląd nadal działają w Twojej przeglądarce, aby iteracja pozostawała natychmiastowa, przez naszą usługę przechodzi tylko dotknięcie „Download”.
  • Usuwanie tła z AI i powiększanie z AI, na ścieżce domyślnej. Modele (BiRefNet do segmentacji, superrozdzielczość do powiększania) potrzebują prawdziwego GPU, aby skończyć w sekundy. Mechanizmy zapasowe w przeglądarce działają, ale są wolniejsze i dają widocznie bardziej surowy wynik na włosach, futrze i drobnych krawędziach.
  • Kodowanie AVIF, przy konwersji. Wbudowany w przeglądarkę koder AVIF jest na niektórych urządzeniach wolny, więc wyjście AVIF wysyła jedno żądanie do Workera kompresji, z kodowaniem w przeglądarce w głównym wątku jako mechanizm zapasowy.

Koszt, który akceptujemy za bycie po stronie serwera na tych ścieżkach, to jedna podróż w obie strony na operację. Koszt, którego unikamy, pozostając po stronie klienta wszędzie indziej, to opłata za podróż w obie strony na tych częściach procesu, które iterują najszybciej.

Potok, krok po kroku

1. Wybierasz plik

Przez wybór pliku, przeciągnij i upuść lub wklejenie przeglądarka przekazuje JavaScriptowi obiekt File. JavaScript czyta bajty za pomocą FileReader lub Blob.arrayBuffer(). W żadnym momencie tego kroku plik nie jest wysyłany przez sieć, niezależnie od tego, którego narzędzia używasz.

2. Przeglądarka dekoduje obraz

Nowoczesne przeglądarki natywnie dekodują JPG, PNG, WebP, GIF i AVIF. Używamy createImageBitmap(), aby zamienić surowe bajty w bitmapę, z którą GPU może pracować, poza głównym wątkiem. Dla HEIC w przeglądarkach, które go natywnie nie dekodują, wracamy do dekodera WebAssembly działającego lokalnie w Twojej przeglądarce.

3. Narzędzie robi swoje, tu właśnie ścieżki się rozchodzą

  • Narzędzia tylko w przeglądarce (kadrowanie, zmiana rozmiaru, konwersja formatu do PNG/JPEG/WebP, podgląd kompresji). Transformacja pikseli w Canvas 2D lub kodek WebAssembly ponownie koduje bitmapę lokalnie. Wynik jest gotowy bez żadnego wysyłania. Cropper.js obsługuje interaktywną ramkę kadrowania w narzędziach do kadrowania, a canvas.toBlob obsługuje ponowne kodowanie podglądu. W całości w Twojej przeglądarce.
  • Kompresja, pobranie. Gdy dotykasz „Download”, obraz jest raz wysyłany do api.roundcut.com.br (usługa Fastify działająca na 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 swojej ścieżce serwerowej). Jest ponownie kodowany z tymi samymi parametrami, które ustawiłeś w podglądzie, a bajty wracają strumieniem do Twojej przeglądarki. Usługa trzyma izolowany na najemcę, adresowany treścią bufor (skrót bajtów wejściowych + parametrów) ograniczony do 500 MB, aby ponowne pobranie tego samego obrazu z tymi samymi ustawieniami odtwarzało zbuforowane bajty, bufor nie jest indeksowany po Tobie, IP ani nazwie pliku. Jeśli usługa jest nieosiągalna, narzędzie wraca do bloba podglądu w przeglądarce.
  • Usuwanie tła, domyślna ścieżka w chmurze. Obraz jest raz wysyłany do Cloudflare Workera, tymczasowo umieszczany w prywatnym kubełku R2, przetwarzany przez transformację cf.image.segment Cloudflare, która uruchamia model BiRefNet na brzegowych GPU Cloudflare, a wycinek wraca strumieniem. Tymczasowy obiekt R2 jest usuwany w ciągu godziny przez regułę cyklu życia R2, niezależnie od wyniku. Typowe zdjęcie kończy się w 1-3 sekundy. Dzienne limity na IP i wysyłka do 5 MB utrzymują darmowy poziom na zrównoważonym poziomie.
  • Inne narzędzia wspierane chmurą (powiększanie z AI, kodowanie AVIF, PDF z wieloma obrazami) idą za tym samym schematem: jedno żądanie do nazwanej infrastruktury (chmurowe API do obrazów na superrozdzielczość, Worker kompresji na kodowanie AVIF, nasza usługa VPS na PDF z wieloma obrazami), wynik strumieniem z powrotem i przezroczysty mechanizm zapasowy w przeglądarce, jeśli to żądanie zawiedzie.
  • Mechanizm zapasowy na WebAssembly. Jeśli odpowiednia ścieżka w chmurze jest nieosiągalna (Twoja sieć padła, jesteś za surową zaporą, dzienny limit się wyczerpał albo plik przekracza limit chmury), narzędzie w sposób przezroczysty przełącza się na lokalny model lub kodek działający w Twojej przeglądarce, na przykład model usuwania tła ISNet przez ONNX Runtime Web z WebAssembly. Pierwsze uruchomienie pobiera model i jest wolniejsze, kolejne uruchomienia są szybsze. Bez żadnego wysyłania na tych ścieżkach zapasowych, możesz to sprawdzić w DevTools.

4. Pobierasz wynik

Wynikowa bitmapa jest kodowana w Blob, owijana w object URL i oferowana standardowemu oknu zapisu pliku Twojej przeglądarki. Plik pojawia się na Twoim dysku.

Jak sprawdzić to samodzielnie

Wybierz to, co wolisz:

Metoda 1. Obserwuj zakładkę Network

  1. Otwórz RoundCut w nowej karcie i otwórz DevTools → Network.
  2. Użyj narzędzia tylko w przeglądarce, Kadrowania do koła lub suwaka podglądu kompresji. Zobaczysz żądania tylko o HTML/CSS/JS/czcionki, plus odpowiednie moduły WebAssembly przy pierwszym użyciu. Żadne żądanie nie wyniesie bajtów Twojego obrazu.
  3. Teraz użyj narzędzia dotykającego serwera, Kompresja → Download lub Usuwanie tła. Zobaczysz dokładnie jedno POST niosące Twój obraz i jedną odpowiedź wracającą z wynikiem. Najedź na dowolne żądanie, aby zobaczyć rozmiar i czas.

Kolumna „Initiator” mówi Ci, który skrypt wywołał każde żądanie, a kolumna „Type” mówi, co zostało wysłane. Nie ukrywamy żadnej z nich.

Metoda 2. Użyj narzędzi offline

  1. Załaduj dowolną stronę narzędzia RoundCut. Użyj Usuwania tła raz na małym obrazie, aby model ISNet w przeglądarce trafił do bufora.
  2. Otwórz DevTools → Network → zaznacz Offline (lub wyłącz Wi-Fi).
  3. Przeładuj stronę, statyczne zasoby są zbuforowane, więc nadal się ładuje.
  4. Wypróbuj narzędzia:
    • Narzędzia tylko w przeglądarce (Kadrowanie do koła, zmiana rozmiaru, podgląd kompresji) działają dalej, nigdy nie potrzebowały sieci.
    • Pobranie kompresji wraca do bloba podglądu w przeglądarce (kodowanie nieco mniej wydajne, ale działające).
    • Usuwanie tła wraca do modelu ISNet na WebAssembly i działa bez żadnego żądania wychodzącego.

Jeśli narzędzia zadziałały offline (te wspierane chmurą lekko osłabione, te tylko w przeglądarce identyczne), to z definicji żaden serwer nie zobaczył Twojego obrazu.

Co widzimy, a czego nie

Na ścieżkach strony klienta nie widzimy nic o Twoim obrazie. Nie ma żądania do obejrzenia, nie ma bufora, by go przechować, nie ma linii dziennika do przeszukania.

Na ścieżkach strony serwera:

  • Usługa kompresji i PDF widzi bajty obrazu na czas kodowania (zwykle kilkaset milisekund), trzyma wpis bufora adresowany treścią przez TTL bufora, i tyle. Bufor nie jest indeksowany po użytkowniku, IP, nazwie pliku ani żadnym identyfikatorze, którego moglibyśmy użyć, by znaleźć „Twoje” obrazy. Nie logujemy treści obrazu. Usługa kodowania jest współdzielona przez tych samych dwóch najemców, których v1 obsługiwała przed migracją, z CORS na najemcę, limitami tempa i kanonicznymi URL podpisanymi HMAC.
  • Usuwanie tła i inne ścieżki AI widzą obraz na czas tymczasowego wysłania i wywołania modelu (zwykle kilka sekund), po czym tymczasowa kopia jest usuwana przez regułę cyklu życia R2. Model BiRefNet działa wewnątrz własnej infrastruktury Cloudflare, nie na zewnętrznym API w stylu remove.bg / fal.ai / Replicate.

Na każdej ścieżce nasz dostawca analityki (Cloudflare Web Analytics) zapisuje zagregowane dane o odsłonach. URL, kraj, rodzina przeglądarki, Core Web Vitals. Bez ciasteczek, bez trwałych identyfikatorów, niczego powiązanego z osobą.

Dla narzędzi, które pobierają moduł WebAssembly przy pierwszym użyciu (dekoder HEIC, model ISNet ONNX), nasz dostawca hostingu widzi, że ktoś pobrał moduł, tak samo jak widzi, że ktoś pobiera plik CSS. Sam moduł nie zawiera żadnej informacji o Twoim obrazie.

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

Stos technologiczny

Dla ciekawych:

  • Astro, generator statycznych stron. Każda strona jest dostarczana jako czysty HTML z progresywnie ulepszanymi „wyspami” JavaScript tylko tam, gdzie żyją interaktywne narzędzia.
  • Czysty CSS z właściwościami niestandardowymi, bez Tailwind, bez CSS-in-JS. Cały system projektowy to jeden plik tokens.css.
  • canvas.toBlob / <canvas>. Kodowanie do JPEG, PNG, WebP, AVIF (wspierane przez przeglądarkę) w narzędziach tylko w przeglądarce, oraz cała praca kadrowania i zmiany rozmiaru.
  • Cropper.js, warstwa interakcji prostokąta kadrowania.
  • ONNX Runtime Web, uruchamia mechanizm zapasowy ISNet na WebAssembly dla Usuwania tła.
  • Cloudflare Pages, hostuje statyczny build, serwuje go z brzegu sieci.
  • Cloudflare Workers + R2 + cf.image.segment (BiRefNet), domyślny potok Usuwania tła.
  • Fastify + sharp 0.34 + libvips 8.17 na Node 24, usługa kompresji i PDF na api.roundcut.com.br, na VPS Hostinger w Niemczech.
  • Cloudflare Web Analytics, zagregowane liczenie odsłon bez ciasteczek.

Wsparcie przeglądarek

Każde narzędzie działa w bieżącej i poprzedniej wersji Chrome, Firefox, Safari i Edge, na desktopie i mobilnie. Strona używa progresywnego ulepszania: gdzie przeglądarka wspiera nowsze API (np. showSaveFilePicker, OffscreenCanvas), używamy go, gdzie nie wspiera, wracamy do starszego odpowiednika. Nie ma żadnej ściany „twoja przeglądarka nie jest wspierana”.

Jedyne twarde wymagania to JavaScript (dla dowolnego narzędzia) i połączenie sieciowe (tylko przy używaniu narzędzia wspieranego chmurą na jego ścieżce domyślnej, narzędzia tylko w przeglądarce działają w pełni offline po pierwszym załadowaniu strony).

Pytania

Czegoś nie omówiliśmy? Pisz na support@roundcut.app. Pytania techniczne mile widziane.