RoundCut hoạt động như thế nào

Câu trả lời ngắn gọn

RoundCut dùng một kiến trúc lai: hầu hết công cụ chạy hoàn toàn trong trình duyệt của bạn với mức tải lên bằng không, và một số ít định tuyến một yêu cầu mạng duy nhất qua hạ tầng của chính chúng tôi khi trình duyệt không thể sánh được về chất lượng, luôn kèm một dự phòng phía máy khách vô hình. Chúng tôi cho bạn biết bạn đang đi trên đường nào, trong mỗi công cụ và trên trang này.

Bảng dưới đây mang tính đại diện, không phải đầy đủ (công cụ mới ra mắt thường xuyên). Nó nêu một ví dụ cho mỗi loại đường:

Công cụ ví dụ	Nơi công việc diễn ra
Circle Crop (chỉ trình duyệt)	100% trong trình duyệt của bạn, Canvas API. Không tải lên, hoạt động ngoại tuyến.
Xem trước khi nén (chỉ trình duyệt)	100% trong trình duyệt của bạn, canvas.toBlob. Không tải lên. Thanh trượt luôn tức thì.
Bản tải về cuối cùng khi nén (có chạm tới máy chủ)	Một vòng đi về tới dịch vụ của chúng tôi tại api.roundcut.com.br (Fastify cùng sharp cùng libvips trên một VPS tại Đức), kèm một dự phòng trình duyệt.
Xóa Nền (có chạm tới máy chủ)	Một vòng đi về tới một Cloudflare Worker chạy BiRefNet trên các GPU biên của Cloudflare, kèm một dự phòng WebAssembly trong trình duyệt của bạn khi đám mây không truy cập được.

Cắt ảnh, đổi kích thước, chuyển đổi định dạng (trừ mã hóa AVIF), và phần xem trước khi nén đều chạy đầy đủ trong trình duyệt của bạn. Xóa nền, bản tải về khi nén, phóng to bằng AI, mã hóa AVIF, và PDF nhiều ảnh mỗi thứ định tuyến một yêu cầu và quay về trình duyệt khi đám mây không truy cập được.

Bạn có thể kiểm chứng các tuyên bố phía máy khách trong khoảng 30 giây: mở DevTools → Network, xóa nhật ký, rồi dùng một công cụ chỉ chạy trong trình duyệt như Circle Crop hoặc thanh trượt xem trước khi nén, bạn sẽ thấy không có yêu cầu nào mang các byte ảnh của bạn rời khỏi trang. Đối với các công cụ có chạm tới máy chủ, bạn sẽ thấy đúng một lần tải lên cho mỗi thao tác, tới các điểm cuối có tên gọi rõ ràng.

Vì sao chọn kiến trúc lai

Hầu hết công cụ ảnh trực tuyến nằm ở một thái cực: tải-mọi-thứ-lên-máy-chủ (bạn chờ các vòng đi về và bên vận hành giữ lại tệp của bạn), hoặc tất-cả-trong-trình-duyệt (bạn trả giá về chất lượng và tốc độ ở các bước mã hóa hoặc AI). Cả hai thái cực đều không thắng ở mọi nơi.

Chúng tôi chọn phía máy khách ở nơi trình duyệt vốn đã xuất sắc, phần tử <canvas> xử lý việc cắt, xoay, đổi kích thước, và mã hóa xem trước có mất mát ở JPG hoặc WebP, còn phía máy chủ ở nơi trình duyệt vẫn thua một cách đo được:

• Nén ảnh, ở bản tải về cuối cùng. sharp cùng libvips 8.17 phía máy chủ tạo ra các tệp nhỏ hơn 10 đến 15% theo từng byte so với các bộ mã hóa trình duyệt ở cùng chất lượng hình ảnh, và cho quyền truy cập vào việc tinh chỉnh tốc độ/sắc độ AVIF cùng đầu ra JPEG XL mà trình duyệt không phơi bày. Thanh trượt và bản xem trước vẫn chạy trong trình duyệt của bạn nên việc tinh chỉnh luôn tức thì, chỉ có cú chạm “Tải về” đi qua dịch vụ của chúng tôi.
• Xóa nền bằng AI và phóng to bằng AI, ở đường mặc định. Các mô hình (BiRefNet cho phân đoạn, siêu phân giải cho phóng to) cần một GPU thật để hoàn thành trong vài giây. Các dự phòng trong trình duyệt vẫn chạy được nhưng chậm hơn và cho ra kết quả thô hơn thấy rõ ở tóc, lông và các cạnh mảnh.
• Mã hóa AVIF, ở việc chuyển đổi. Bộ mã hóa AVIF trong trình duyệt chậm trên một số thiết bị, nên đầu ra AVIF định tuyến một yêu cầu tới Worker nén, với một bản mã hóa trình duyệt trên luồng chính làm dự phòng.

Cái giá chúng tôi chấp nhận khi đứng phía máy chủ trên các đường đó là một vòng đi về cho mỗi thao tác. Cái giá chúng tôi tránh được khi giữ phía máy khách ở mọi nơi khác là phí vòng đi về trên những phần của luồng công việc tinh chỉnh nhanh nhất.

Quy trình, từng bước một

1. Bạn chọn một tệp

Qua bộ chọn tệp, kéo-thả, hay dán, trình duyệt trao cho JavaScript một đối tượng File. JavaScript đọc các byte bằng FileReader hoặc Blob.arrayBuffer(). Ở không một thời điểm nào trong bước này tệp được gửi qua mạng, bất kể bạn đang dùng công cụ nào.

2. Trình duyệt giải mã ảnh

Các trình duyệt hiện đại giải mã nguyên bản JPG, PNG, WebP, GIF và AVIF. Chúng tôi dùng createImageBitmap() để biến các byte thô thành một bitmap mà GPU có thể làm việc, ngoài luồng chính. Với HEIC trên các trình duyệt không giải mã nó nguyên bản, chúng tôi quay về một bộ giải mã WebAssembly chạy cục bộ trong trình duyệt của bạn.

3. Công cụ làm phần việc của nó, đây là nơi các đường rẽ nhánh

• Công cụ chỉ trình duyệt (cắt, đổi kích thước, chuyển định dạng sang PNG/JPEG/WebP, xem trước khi nén). Một phép biến đổi pixel Canvas 2D hoặc một codec WebAssembly mã hóa lại bitmap cục bộ. Kết quả sẵn sàng mà không cần tải lên. Cropper.js xử lý khung cắt tương tác cho các công cụ cắt, và canvas.toBlob xử lý việc mã hóa lại bản xem trước. Hoàn toàn trong trình duyệt của bạn.
• Nén, tải về. Khi bạn chạm “Tải về”, ảnh được gửi một lần tới api.roundcut.com.br (một dịch vụ Fastify chạy trên một VPS tại Đức do Hostinger vận hành, Node 24 cùng sharp 0.34 cùng libvips 8.17, đúng các thư viện C mà Squoosh dùng trên đường máy chủ của nó). Nó được mã hóa lại với đúng các tham số bạn đặt trong bản xem trước, và các byte được phát trở lại trình duyệt của bạn. Dịch vụ giữ một bộ nhớ đệm cô lập theo bên thuê, định địa chỉ theo nội dung (một hàm băm của các byte đầu vào cộng tham số) giới hạn ở 500 MB sao cho việc tải lại cùng một ảnh với cùng cài đặt phát lại các byte đã lưu, bộ nhớ đệm không được lập chỉ mục theo bạn, IP hay tên tệp. Nếu dịch vụ không truy cập được, công cụ quay về blob xem trước trong trình duyệt.
• Xóa Nền, đường đám mây mặc định. Ảnh được tải lên một lần tới một Cloudflare Worker, để tạm trong một bucket R2 riêng tư, được xử lý bởi phép biến đổi cf.image.segment của Cloudflare vốn chạy mô hình BiRefNet trên các GPU biên của Cloudflare, và phần cắt ra được phát trở lại. Đối tượng R2 để tạm được xóa trong vòng một giờ bởi một quy tắc vòng đời R2, bất kể kết quả. Một tấm ảnh điển hình hoàn thành trong 1 đến 3 giây. Các giới hạn theo IP mỗi ngày và giới hạn tải lên 5 MB giúp gói miễn phí bền vững.
• Các công cụ có đám mây hậu thuẫn khác (phóng to bằng AI, mã hóa AVIF, PDF nhiều ảnh) theo cùng một hình thái: một yêu cầu tới hạ tầng có tên gọi rõ ràng (một API hình ảnh đám mây cho siêu phân giải, Worker nén cho mã hóa AVIF, dịch vụ VPS của chúng tôi cho PDF nhiều ảnh), kết quả được phát trở lại, và một dự phòng trong trình duyệt trong suốt nếu yêu cầu đó thất bại.
• Dự phòng WebAssembly. Nếu đường đám mây liên quan không truy cập được (mạng của bạn rớt, bạn ở sau một tường lửa nghiêm ngặt, hạn mức ngày đã đầy, hoặc tệp vượt quá giới hạn đám mây), công cụ chuyển trong suốt sang một mô hình hoặc codec cục bộ chạy trong trình duyệt của bạn, ví dụ mô hình xóa nền ISNet qua ONNX Runtime Web với WebAssembly. Lần chạy đầu tải mô hình về và chậm hơn, các lần chạy sau nhanh hơn. Không tải lên trên các đường dự phòng này, bạn có thể kiểm chứng trong DevTools.

4. Bạn tải kết quả về

Bitmap đầu ra được mã hóa thành một Blob, bọc trong một object URL, và đưa cho hộp thoại lưu tệp tiêu chuẩn của trình duyệt. Tệp xuất hiện trên đĩa của bạn.

Cách tự bạn kiểm chứng

Chọn cách nào bạn thích:

Cách 1. Quan sát tab Network

1. Mở RoundCut trong một tab mới và mở DevTools → Network.
2. Dùng một công cụ chỉ trình duyệt, Circle Crop hoặc thanh trượt xem trước khi nén. Bạn sẽ thấy các yêu cầu chỉ cho HTML/CSS/JS/phông chữ, cùng các mô-đun WebAssembly liên quan ở lần dùng đầu. Không yêu cầu nào sẽ mang các byte ảnh của bạn.
3. Giờ dùng một công cụ có chạm tới máy chủ, Nén → Tải về hoặc Xóa Nền. Bạn sẽ thấy đúng một POST mang ảnh của bạn, và một phản hồi quay về với kết quả. Di chuột lên bất kỳ yêu cầu nào để xem kích thước và thời gian.

Cột “Initiator” cho bạn biết kịch bản nào kích hoạt mỗi yêu cầu, và cột “Type” cho bạn biết cái gì đã được gửi đi. Chúng tôi không giấu cái nào.

Cách 2. Dùng các công cụ ngoại tuyến

1. Tải bất kỳ trang công cụ RoundCut nào. Dùng Xóa Nền một lần trên một ảnh nhỏ để mô hình ISNet trong trình duyệt được lưu vào bộ nhớ đệm.
2. Mở DevTools → Network → tích Offline (hoặc tắt Wi-Fi).
3. Tải lại trang, các tài nguyên tĩnh đã được lưu đệm, nên nó vẫn nạp được.
4. Thử các công cụ:
   • Công cụ chỉ trình duyệt (Circle Crop, đổi kích thước, xem trước khi nén) vẫn chạy, chúng chưa bao giờ cần đến mạng.
   • Nén Tải về quay về blob xem trước trong trình duyệt (mã hóa hơi kém hiệu quả hơn một chút, nhưng vẫn dùng được).
   • Xóa Nền quay về mô hình WebAssembly ISNet và chạy mà không cần bất kỳ yêu cầu đi ra nào.

Nếu các công cụ chạy được ngoại tuyến (loại có đám mây hậu thuẫn hơi giảm chất lượng, loại chỉ trình duyệt thì y hệt), thì theo định nghĩa không máy chủ nào thấy ảnh của bạn.

Những gì chúng tôi thấy, và những gì không

Trên các đường phía máy khách, chúng tôi không thấy gì về ảnh của bạn. Không có yêu cầu nào để xem, không có bộ nhớ đệm nào để lưu nó, không có dòng nhật ký nào để grep.

Trên các đường phía máy chủ:

• Dịch vụ nén và PDF thấy các byte ảnh trong suốt thời gian mã hóa (thường vài trăm mili giây), giữ một mục bộ nhớ đệm định địa chỉ theo nội dung trong khoảng TTL của bộ đệm, và chỉ vậy thôi. Bộ nhớ đệm không được lập chỉ mục theo người dùng, IP, tên tệp, hay bất kỳ định danh nào chúng tôi có thể dùng để tìm ra ảnh “của bạn”. Chúng tôi không ghi nhật ký nội dung ảnh. Dịch vụ mã hóa được dùng chung cho đúng hai bên thuê mà v1 phục vụ trước khi chuyển đổi, với CORS theo từng bên thuê, các giới hạn tốc độ, và các URL chuẩn được ký HMAC.
• Xóa Nền và các đường AI khác thấy ảnh trong suốt thời gian tải lên tạm và lời gọi mô hình (thường vài giây), sau đó bản tạm bị xóa bởi một quy tắc vòng đời R2. Mô hình BiRefNet chạy bên trong hạ tầng của chính Cloudflare, chứ không phải trên một API bên ngoài kiểu remove.bg, fal.ai hay Replicate.

Trên mọi đường, nhà cung cấp phân tích của chúng tôi (Cloudflare Web Analytics) ghi lại dữ liệu lượt xem trang tổng hợp. URL, quốc gia, dòng trình duyệt, Core Web Vitals. Không cookie, không định danh bền vững, không gì gắn với một con người.

Với các công cụ tải về một mô-đun WebAssembly ở lần dùng đầu (bộ giải mã HEIC, mô hình ISNet ONNX), nhà cung cấp lưu trữ của chúng tôi thấy có ai đó đã lấy mô-đun đó, giống cách nó thấy họ lấy tệp CSS. Bản thân mô-đun không chứa thông tin nào về ảnh của bạn.

Bản kiểm kê dữ liệu đầy đủ nằm trong chính sách quyền riêng tư của chúng tôi.

Ngăn xếp công nghệ

Dành cho những ai tò mò:

• Astro, trình tạo trang tĩnh. Mỗi trang ra mắt dưới dạng HTML thuần với các “hòn đảo” JavaScript được tăng cường dần chỉ ở nơi có công cụ tương tác.
• CSS thuần với thuộc tính tùy chỉnh, không Tailwind, không CSS-in-JS. Toàn bộ hệ thống thiết kế là một tệp tokens.css duy nhất.
• canvas.toBlob / <canvas>. Mã hóa JPEG, PNG, WebP, AVIF (mà trình duyệt hỗ trợ) trong các công cụ chỉ trình duyệt, và toàn bộ phần việc cắt và đổi kích thước.
• Cropper.js, lớp tương tác hình chữ nhật cắt.
• ONNX Runtime Web, chạy dự phòng WebAssembly ISNet cho Xóa Nền.
• Cloudflare Pages, lưu trữ bản dựng tĩnh, phục vụ nó từ biên.
• Cloudflare Workers cùng R2 cùng cf.image.segment (BiRefNet), quy trình Xóa Nền mặc định.
• Fastify cùng sharp 0.34 cùng libvips 8.17 trên Node 24, dịch vụ nén và PDF tại api.roundcut.com.br, trên một VPS Hostinger tại Đức.
• Cloudflare Web Analytics, số đếm lượt xem trang tổng hợp, không cookie.

Hỗ trợ trình duyệt

Mọi công cụ chạy trên phiên bản hiện tại và phiên bản trước đó của Chrome, Firefox, Safari và Edge, cả máy bàn lẫn di động. Trang web dùng tăng cường dần: ở nơi một trình duyệt hỗ trợ một API mới hơn (ví dụ showSaveFilePicker, OffscreenCanvas), chúng tôi dùng nó, ở nơi nó không hỗ trợ, chúng tôi quay về tương đương cũ hơn. Không có bức tường “trình duyệt của bạn không được hỗ trợ”.

Các yêu cầu cứng duy nhất là JavaScript (cho bất kỳ công cụ nào) và một kết nối mạng (chỉ khi dùng một công cụ có đám mây hậu thuẫn ở đường mặc định của nó, các công cụ chỉ trình duyệt chạy hoàn toàn ngoại tuyến sau lần nạp trang đầu tiên).

Câu hỏi

Có gì chúng tôi chưa nói tới? Gửi email tới support@roundcut.app. Hoan nghênh các câu hỏi kỹ thuật.