Translation API

Tags: #<Tag:0x00007f305d7c9c20>

It would be useful to translate text directly in the browser. This could simply rely on existing browser capabilities.


> translate('Hello!', 'en', 'it');

This would open new possibilities to web apps, that could control how, when and what is translated.

Another, very simple, API that would be useful for translations is the ability to trigger the browser translation prompt programmatically:


// on click on a flag inside the page...

This should be straightforward in Chrome, and it’s strange that is not already available.

I know that Google’s Chrome uses machine translations for their “auto-translate” features. But that seems a built-in feature of Chrome (Firefox doesn’t prompt me). I presume that’s because Google also has Google Translate while Firefox has not related translation service.

I understand where you’re coming from, but I think it would be problematic for this to exist as a specification.

  1. Where does the translation engine exist? In the browser or an external service?
  2. If the translation engine lives in the browser, which languages? And how are their rules-engines and corpus loaded?
  3. If this API is just a pointer to a service, is it the end-user or developer that decides the service to use?

I also struggle with use-case here. If an organization needs copy translated for their website, why would they risk on-the-fly machine translation where they have no oversight into what’s translated? It seems risky to entrust the browser for translating their content. This kind of API would make translation a developer’s job rather than a real human translator’s.

  1. The API is exposed by the browser. Then the browser is free to decide how to implement that (and would not be part of the spec).
  2. They can use any external translation service if they want.
  3. No, it’s not the developer that decides the service to use, otherwise it would be useless to define an API. The API is meant to access the browser capabilities (when present) and provide a better UX.

risk on-the-fly machine translation

It would be especially useful for dynamic data, like chats. Or think about the translation of user generated content (like descriptions in Instagram posts).

I’m thinking of how the speech recognition API works in Chrome. What you’re proposing could be very similar to that.

I could see an API that’s built very similarly:

  • translate start/end events
  • result event
  • a SpeechGrammar object that includes src and possibly even weight that can help us assess accuracy of the translation

I’d also want this to be async.

Additionally, developers and possibly end-users should be able to choose translation services.

Chrome and Edge already have a translation feature and iOS Safari is going to have automatic translations (starting from iOS 14).

It would be great to have more control on this.

Basic support: trigger the translation prompt programmatically, for example when the user clicks on a different flag or language select inside the page. This would improve the UI and would be very simple to implement.


Advanced support: use Javascript to translate some specific text (or the text inside specific elements) from a language to another language.

translate('Hello!', 'en', 'it');
// or 
DOMElement.translate('en', 'it');