blakeembrey / free-style

Make CSS easier and more maintainable by using JavaScript
MIT License
707 stars 29 forks source link

Allow custom namespace to hashes #30

Closed carloslfu closed 8 years ago

carloslfu commented 8 years ago

Hi, great library. In my team we use free-style in production and is very useful. In our experience, when debug with devtools, only can see class hashes. In larger proyects or heavly styled components, this is confusing. One solution can be use another FreeStyle instance with a custom hash algorithm but is so expensive.

I propose that methods like registerStyle and registerKeyframes have a second parameter with a custom namespace (empty by default), hash algorithm can put this at start of the hash, and give some meaning to the style. In this way we can see more understanable class hashes at devtools. See:

var STYLE = Style.registerStyle({
  display: 'flex',
  flexDirection: 'column'
}, 'dashboard-header-cancelButton')
//=> "dashboard-header-cancelButton--fibanyf"

Hope your thoughts, thanks.

blakeembrey commented 8 years ago

Makes sense. I think this was something I wanted to add a while back too. Do you think it should exist on every style or on an instance of FreeStyle? The only note would be to remember that de-duping will no longer occur and it's (however unlikely) now possible that in development a hash wouldn't collide while in production it could (assuming you're switching between these to shrink the size in production). The other part is how to make it not suck when you want the debug-ability in development and not in production - what do you think about using process.env.NODE_ENV for this?

carloslfu commented 8 years ago

I think it should exist on every style. Use process.env.NODE_ENV looks like a good solution.

basarat commented 8 years ago

only note would be to remember that de-duping will no longer occur

Aphrodite https://github.com/Khan/aphrodite doesn't seem to care : sample. I would have liked if it did but ¯\_(ツ)_/¯ :rose:

blakeembrey commented 8 years ago

Thanks @basarat. I'll bundle this with changes for a 2.0 release, but I'll make sure de-duping still occurs in production.