What is JavaScript's CompositionEvent? Please give examples

MDN is very vague about what the CompositionEvent means. There are no examples and the correlated events, such as compositionstart, compositionupdate and compositionend, also have no examples and don't explain it much better.

Quoting MDN:

The DOM CompositionEvent represents events that occur due to the user indirectly entering text.

And, for events:

The compositionstart event is fired when the composition of a passage of text is prepared (similar to keydown for a keyboard input, but fires with special characters that require a sequence of keys and other inputs such as speech recognition or word suggestion on mobile). [...] Gecko fires this event when IME starts composition, and some platforms don't have an API for canceling composition once it's begun.

This answer states that CompositionEvents are mostly used for non-latin characters (such as when user inputs Japanese characters). I think anything that needs an IME (= input method?) can trigger these composition events. I only use latin characters, so I have never used an IME, I guess. Although IME apparently also relates to Android keyboard's composition.

My question: What are CompositionEvents used for and when will these events be triggered? Please give concrete examples to clarify its uses. And also: can it be used for composing unicode characters such as ô, ç and ü?

from What is JavaScript's CompositionEvent? Please give examples