クロップ

画像を丸く切り抜く 画像を切り抜く

最適化

画像を圧縮 画像を高画質化 背景を削除

編集

画像をリサイズ

変換

その他

JPGをPDFに変換

RoundCutの仕組み

各ツールが何を実行し、どこで実行するか、そしてご自身で検証できる方法の技術的詳細。

要点

RoundCutはハイブリッド構成を採用しています。ほとんどのツールはアップロードなしで完全 にブラウザ内で実行され、一部のツールはブラウザが品質に追いつけないときに、私たち自身のイン フラへネットワークリクエストを1回だけ送ります。その際は常に、目に見えないクライアント側の フォールバックを備えています。あなたがどの経路にいるかは、各ツールでも、このページでもお伝 えします。

下の表は代表例であり、すべてを網羅したものではありません（新しいツールは定期的に登場し ます）。それぞれの種類の経路の一例を示します。

ツールの例作業が行われる場所
円形切り抜き（ブラウザのみ）100%ブラウザ内、Canvas API。アップロードなし、オフラインで動作。
圧縮プレビュー（ブラウザのみ）100%ブラウザ内、canvas.toBlob。アップロードなし。スライダーは常に即座に反映。
圧縮の最終ダウンロード（サーバーに触れる）api.roundcut.com.br上の私たちのサービスへの1往復（Fastify、sharp、libvips、ドイツのVPS上）。ブラウザでのフォールバックを伴う。
背景の除去（サーバーに触れる）CloudflareのエッジGPUでBiRefNetを実行するCloudflare Workerへの1往復。クラウドに到達できないときは、ブラウザ内のWebAssemblyでフォールバック。

切り抜き、リサイズ、フォーマット変換（AVIFのエンコードを除く）、圧縮プレビューは、すべて完 全にブラウザ内で実行されます。背景の除去、圧縮のダウンロード、AIによる拡大、AVIFのエンコー ド、複数枚画像のPDFは、それぞれリクエストを1回だけ送り、クラウドに到達できないときはブラウザ にフォールバックします。

クライアント側の主張は約30秒で確認できます。DevTools → Networkを開き、ログを消去し、次に円形 切り抜きや圧縮プレビューのスライダーのようなブラウザのみのツールを使うと、あなたの画像のバイ トを運ぶリクエストがページから1件も出ていかないのが分かります。サーバーに触れるツールでは、 明示されたエンドポイントへ、操作ごとにちょうど1回のアップロードが見えます。

なぜハイブリッドか

オンラインの画像ツールの多くは、いずれかの極端に位置しています。すべてをサーバーにアップロー ドする方式（往復を待たされ、運営者があなたのファイルを保持します）か、すべてをブラウザ内で行 う方式（エンコードやAIの工程で品質と速度を犠牲にします）です。どちらの極端も、すべての面で勝 つわけではありません。

私たちは、ブラウザがすでに優れている部分ではクライアント側を選びました。<canvas>要素が切り 抜き、回転、リサイズ、そしてJPG/WebPでの非可逆プレビューエンコードを担います。そして、ブラウ ザがまだ明確に劣る部分ではサーバー側を選びました。

  • 画像の圧縮、最終ダウンロードにて。サーバー側のsharpとlibvips 8.17は、同じ見た目の品質で、ブラウザのエンコーダーよりバイト単位で10〜15%小さいファイルを生み出し、ブラウザが公開していないAVIFの速度・クロマ調整やJPEG XL出力にアクセスできます。スライダーとプレビューは引き続きブラウザ内で動くので調整は即座に反映され、「ダウンロード」をタップしたときだけ私たちのサービスを経由します。
  • AIによる背景の除去とAIによる拡大、既定の経路にて。モデル（セグメンテーションのBiRefNet、拡大の超解像）は、数秒で終えるのに本物のGPUを必要とします。ブラウザ内のフォールバックは動作しますが、より遅く、髪、毛、細かい縁では目に見えて粗い結果になります。
  • AVIFのエンコード、変換にて。ブラウザ内のAVIFエンコーダーは一部の端末で遅いため、AVIF出力は圧縮Workerへリクエストを1回送り、メインスレッドのブラウザでのエンコードをフォールバックとします。

これらの経路でサーバー側にする代わりに私たちが受け入れるコストは、操作ごとの1往復です。それ 以外のすべてでクライアント側に留まることで避けられるコストは、最も速く繰り返される工程での往 復の手間です。

パイプライン、ステップごとに

1. ファイルを選ぶ

ファイル選択、ドラッグ＆ドロップ、または貼り付けを通じて、ブラウザはJavaScriptにFileオブ ジェクトを渡します。JavaScriptはFileReaderまたはBlob.arrayBuffer()を使ってバイトを読み込 みます。このステップのどの時点でも、ファイルはネットワーク越しに送られません。どのツール を使っていても同じです。

2. ブラウザが画像をデコードする

最新のブラウザはJPG、PNG、WebP、GIF、AVIFをネイティブにデコードします。私たちは createImageBitmap()を使い、生のバイトを、GPUが扱えるビットマップへメインスレッドの外で変換 します。ネイティブにHEICをデコードしないブラウザでは、あなたのブラウザ内でローカルに動作する WebAssemblyのデコーダーにフォールバックします。

3. ツールが処理を行う、ここで経路が分かれる

  • ブラウザのみのツール（切り抜き、リサイズ、PNG/JPEG/WebPへのフォーマット変換、圧縮プレビュー）。Canvas 2Dのピクセル変換、またはWebAssemblyのコーデックが、ビットマップをローカルで再エンコードします。結果はアップロードなしで用意できます。Cropper.jsが切り抜きツールの対話的な切り抜き枠を担い、canvas.toBlobがプレビューの再エンコードを担います。完全にブラウザ内です。
  • 圧縮、ダウンロード。「ダウンロード」をタップすると、画像は一度だけapi.roundcut.com.brへ送られます（Hostingerが運用するドイツのVPS上で動くFastifyサービス、Node 24にsharp 0.34とlibvips 8.17、SquooshがサーバーパスでもCで使うのと同じライブラリ群です）。プレビューで設定したのと同じパラメーターで再エンコードされ、バイトはあなたのブラウザへストリーミングで返されます。サービスはテナント分離された内容アドレス指定のキャッシュ（入力バイトとパラメーターのハッシュ）を500MBの上限で保持するので、同じ画像を同じ設定で再ダウンロードするとキャッシュ済みのバイトが再生されます。キャッシュはあなた、IP、ファイル名で索引付けされません。サービスに到達できない場合、ツールはブラウザ内のプレビューblobにフォールバックします。
  • 背景の除去、既定のクラウド経路。画像は一度だけCloudflare Workerへアップロードされ、非公開のR2バケットでステージングされ、CloudflareのエッジGPU上でBiRefNetモデルを実行するcf.image.segment変換によって処理され、切り抜きがストリーミングで返されます。ステージングされたR2オブジェクトは、結果にかかわらずR2のライフサイクルルールによって1時間以内に削除されます。一般的な写真は1〜3秒で終わります。IPごと・1日ごとのアップロード上限と5MBの上限が、無料枠を持続可能に保ちます。
  • その他のクラウドベースのツール（AIによる拡大、AVIFのエンコード、複数枚画像のPDF）も同じ形に従います。明示されたインフラへのリクエスト1回（超解像にはクラウドの画像API、AVIFのエンコードには圧縮Worker、複数枚画像のPDFには私たちのVPSサービス）、結果のストリーミング返却、そしてそのリクエストが失敗した場合のブラウザ内での目立たないフォールバックです。
  • WebAssemblyフォールバック。該当するクラウド経路に到達できない場合（ネットワークが切れた、厳しいファイアウォールの内側にいる、1日の上限に達した、ファイルがクラウドの上限を超えた）、ツールはあなたのブラウザ内で動作するローカルのモデルやコーデックへ目立たず切り替わります。たとえば、ONNX Runtime WebとWebAssemblyを通じた背景除去モデルISNetです。最初の実行ではモデルをダウンロードするため遅く、以降の実行は速くなります。これらのフォールバック経路ではアップロードはありません。DevToolsで確認できます。

4. 結果をダウンロードする

出力ビットマップはBlobにエンコードされ、object URLにラップされ、あなたのブラウザの標準の ファイル保存ダイアログに提示されます。ファイルがディスク上に現れます。

自分で確認する方法

お好みの方をどうぞ。

方法1. Networkタブを見る

  1. 新しいタブでRoundCutを開き、DevTools → Networkを開きます。
  2. ブラウザのみのツール、円形切り抜きや圧縮プレビューのスライダーを使います。HTML/CSS/JS/フォントのリクエストと、初回利用時の該当WebAssemblyモジュールだけが見えます。どのリクエストもあなたの画像のバイトを運びません。
  3. 次にサーバーに触れるツール、圧縮 → ダウンロード、または背景の除去を使います。あなたの画像を運ぶPOSTがちょうど1つ、そして結果が返ってくるレスポンスが1つ見えます。どれかのリクエストにポインターを合わせると、サイズと所要時間が見えます。

「Initiator」列はどのスクリプトが各リクエストを発生させたかを示し、「Type」列は何が送られたか を示します。私たちはそのどちらも隠しません。

方法2. ツールをオフラインで使う

  1. RoundCutのいずれかのツールページを読み込みます。小さな画像で背景の除去を一度使い、ブラウザ内のISNetモデルをキャッシュさせます。
  2. DevTools → Networkを開き、Offlineにチェックを入れます（またはWi-Fiを切ります）。
  3. ページを再読み込みします。静的アセットはキャッシュ済みなので、それでも読み込まれます。
  4. ツールを試します。
    • ブラウザのみのツール（円形切り抜き、リサイズ、圧縮プレビュー）は動き続けます。もともとネットワークは不要でした。
    • 圧縮のダウンロードはブラウザ内のプレビューblobにフォールバックします（エンコードはやや効率が落ちますが機能します）。
    • 背景の除去はISNetのWebAssemblyモデルにフォールバックし、外向きのリクエストなしで動作します。

ツールがオフラインで動いたなら（クラウドベースのものはわずかに劣化、ブラウザのみのものは同一）、 定義上、どのサーバーもあなたの画像を見ていません。

私たちが見るもの、見ないもの

クライアント側の経路では、私たちはあなたの画像について何も見ません。見るべきリクエストも、 保存するキャッシュも、検索するログ行もありません。

サーバー側の経路では、

  • 圧縮とPDFのサービスは、エンコードの間（通常は数百ミリ秒）だけ画像のバイトを見て、キャッシュのTTLの間だけ内容アドレス指定のキャッシュエントリーを保持し、それだけです。キャッシュはユーザー、IP、ファイル名、その他「あなたの」画像を見つけるために使えるどんな識別子でも索引付けされていません。画像の内容はログに記録しません。エンコードサービスは、移行前にv1が提供していたのと同じ2つのテナントで共有され、テナントごとのCORS、レート制限、HMAC署名付きの正規URLを備えています。
  • 背景の除去とその他のAI経路は、ステージングのアップロードとモデル呼び出しの間（通常は数秒）だけ画像を見て、その後ステージングされたコピーはR2のライフサイクルルールによって削除されます。BiRefNetモデルはCloudflare自身のインフラ内で実行され、remove.bg / fal.ai / Replicate のような外部APIでは実行されません。

どの経路でも、私たちの分析プロバイダー（Cloudflare Web Analytics） はページビューの集計データを記録します。URL、国、ブラウザの種類、Core Web Vitalsです。クッキー も、永続的な識別子も、個人に結びつくものも一切ありません。

初回利用時にWebAssemblyモジュールをダウンロードするツール（HEICデコーダー、ISNetのONNXモデル） については、私たちのホスティングプロバイダーは、CSSファイルの取得を見るのと同じように、誰かが そのモジュールを取得したことを見ます。モジュール自体には、あなたの画像に関する情報は含まれて いません。

データの全目録は、私たちのプライバシーポリシーにあります。

技術スタック

興味のある方へ。

  • Astro、静的サイトジェネレーター。各ページはプレーンなHTMLとして出力され、対話的なツールがある場所だけにプログレッシブエンハンスメントのJavaScript「アイランド」が載ります。
  • カスタムプロパティを使ったバニラCSS、Tailwindなし、CSS-in-JSなし。デザインシステム全体が単一のtokens.cssファイルです。
  • canvas.toBlob / <canvas>。ブラウザのみのツールでのJPEG、PNG、WebP、AVIF（ブラウザ対応）のエンコード、そして切り抜きとリサイズのすべての作業。
  • Cropper.js、切り抜き矩形の対話レイヤー。
  • ONNX Runtime Web、背景の除去のためのISNet WebAssemblyフォールバックを実行します。
  • Cloudflare Pages、静的ビルドをホストし、エッジから配信します。
  • Cloudflare Workers、R2、cf.image.segment（BiRefNet）、既定の背景の除去のパイプライン。
  • Node 24上のFastify、sharp 0.34、libvips 8.17、ドイツのHostinger VPS上にあるapi.roundcut.com.brの圧縮とPDFのサービス。
  • Cloudflare Web Analytics、集計された、クッキーなしのページビュー数。

ブラウザ対応

すべてのツールは、Chrome、Firefox、Safari、Edgeの現行版と1つ前の版で、デスクトップとモバイルの 両方で動作します。サイトはプログレッシブエンハンスメントを使います。新しいAPI（たとえば showSaveFilePicker、OffscreenCanvas）に対応するブラウザではそれを使い、対応しない場合は古い 同等のものにフォールバックします。「お使いのブラウザはサポートされていません」という壁はありま せん。

唯一の厳しい要件は、JavaScript（どのツールにも）とネットワーク接続（クラウドベースのツールを既 定の経路で使うときだけ。ブラウザのみのツールは、最初のページ読み込みのあとは完全にオフラインで 動きます）です。

ご質問

取り上げていないことがありますか。support@roundcut.appまで メールをお寄せください。技術的なご質問も歓迎します。