Guidance for naming events

[LeaVerou]

The only guidance we currently have about naming events is that if they consist of multiple words, the words should be concatenated, but there is no guidance on how these words should be selected or ordered.

One very prominent pattern is that most event names end in verbs, and these verbs are in the present tense: mousemove (not mousemoved), open (not opened), load (not loaded), change (not changed) and so on. Instead, event names with verbs in the past tense like appinstalled and connected (and its composites, e.g. gamepadconnected) are outliers and thus should be considered antipatterns.

Other patterns I observed, which we may or may not want to mention:

• Nouns come before verbs (e.g. mousemove, not movemouse, hashchange, not changehash, timeupdate not updatetime)
• When before or after are part of the name, they are the first word (e.g. beforeunload, afterscriptexecute, beforeinstallprompt). When start or end are part of the name, they are the last word (e.g. transitionstart, animationend, dragstart, audioend, touchstart, selectionstart). We should also elaborate on when to use (before|after).* and when to use .*(start|end).

List of all events, for anyone who wants to find more patterns

[bradkemper]

Start and end can be verbs, so that still fits.

[bradkemper]

Event names ending in prepositions are pretty common too, especially wrt input-related events:

• focusin/focusout
• keydown/keyup
• mousedown/mouseover/mouseout/mouseup
• dragover
• timeout