Chrome Translator API Quick Reference

3 min
chrometranslatorapiweb-ai

Summarize the easy usage of the Translator API.

Feature Detection

if ("Translator" in self) {
  // API is supported
}

Check Availability

const canTranslate = await self.Translator.availability({
  sourceLanguage: "en",
  targetLanguage: "ja",
});
// Returns: "downloadable" | "downloading" | "available" | "unavailable"
  • "downloadable" - Supported but needs to download model
  • "downloading" - Supported but download in progress
  • "available" - Ready to use without download
  • "unavailable" - Not supported

Create Translator

const translator = await self.Translator.create({
  sourceLanguage: "en",
  targetLanguage: "ja",
  monitor(m) {
    // Optional: Monitor download progress for large AI models
    m.addEventListener("downloadprogress", (e) => {
      console.log(`Progress: ${Math.round((e.loaded / e.total) * 100)}%`);
    });
  },
});

The monitor callback receives a CreateMonitor instance that emits downloadprogress events when downloading AI models.

Translate

Synchronous

const result = await translator.translate("Hello world");
console.log(result);

Streaming

const stream = translator.translateStreaming("Hello world");
for await (const chunk of stream) {
  console.log(chunk);
}

Note: Streaming currently returns all at once known issue.

Demo

Live Demo

References