What are the benefits of React's keyMirror?

Question

I have worked through a number of React tutorials recently, specifically those employing the Flux architecture. All of these tutorials have utilised react/lib/keymirror in various forms.

I understand what it does, but I am not convinced I fully understand the benefits it provides. However, that may suggest my understanding of what it does isn't quite correct!

My understanding is:

1. It produces an enumerable.
2. Enumerables are typically used in functional languages, but are also useful in object-orientated code.
3. There are benefits to minification although, I'm not sure I fully understand these in this case.
4. Bill Fisher states that it would not be unreasonable to use Strings in place of the constants, and that really the benefit comes when you have a large number of constants.

I suppose the question is, in small-medium scale applications, does defining constants once within the keyMirror and then requiring and referencing them in two different locations (actions and stores) provide any tangible benefit compared to Strings, referenced only in actions and stores?

If, as Bill says, it helps to see a list of the constants in one place, it would still be less code to just keep a txt file with the string constants listed there.

Answer 1

You'll have to wait for someone from the React team to confirm this, but I'm guessing one reason is because constant string literals in business logic are not encouraged by their style guide. In situations with a lot of developers working on the same code, if logic is built by setting and checking hard-coded strings, it is less obvious where to go to find the origin of any term.

The second reason is related, but certain IDEs will let you automatically find, complete, or refactor property names, but not literal strings. Having the string defined in one place makes those workflows much easier.

Finally, better optimization is possible since all the enumerable references can be processed by UglifyJS, which can rename the symbol to be shorter without affecting either the legibility of dev code or the robustness of any references.

So I would say for anything but small short-term applications, moving literal strings into well-organized constant objects is a good idea. KeyMirror is just one kind of helper for this that guarantees the property values will match the keys. I believe this is so that you can re-use the value of any property as a valid key.