search

lucaong / jQCloud

jQuery plugin for drawing neat word clouds that actually look like clouds
MIT License
646 stars 293 forks source link

More efficient css #6

Open ghost opened 13 years ago

ghost commented 13 years ago

I'm no css expert, but I think your css could be more efficient.

http://css-tricks.com/efficiently-rendering-css/

A couple examples:

slow: div.jqcloud a div.jqcloud span.w10

faster: a.jqcloud span.jqcloud.w10 or span.jqcloud-w10

Basically, just a couple class attributes needs to added or changed in the generated html.

lucaong commented 13 years ago

Thank you ake, what you say is absolutely true, but I fear that this would make CSS customization a little less straightforward. I'm testing if the changes you propose have measurable effects on rendering efficiency, and will consider applying them if they do. In the meantime, I'd be more than happy to read opinions on CSS efficiency vs. simplicity

ghost commented 13 years ago

I don't quite understand your point about "this would make CSS customization a little less straightforward". Can you explain a bit more. Imho, the change is fairly trivial. But as I said, I'm no expert.

lucaong commented 13 years ago

ake, the change is absolutely trivial, but if there are no measurable benefits (which may not be the case) I personally think that having a meaningful namespace class for the container element (jqcloud) and ten classes of weight for the single words (w1, w2, ...) makes styling more straightforward for those who want to come up with their own custom CSS. In other words I'm not worried about the difficulty I would personally incur in when introducing this change, but more about complicating (even if by a tiny amount) the process of customizing the word cloud style for a particular project, starting from the standard CSS. That said, if these changes are capable of reducing rendering time (which is an issue in my mind), I would certainly apply them. I still have to test this out, and any experiment or figures are very appreciated.

ghost commented 13 years ago

Just be clear, I wasn't suggesting that you remove the class attribute from the container.

now: <div class="jqcloud"><span class="w1"><a></a></span></div>

my suggestion: <div class="jqcloud"><span class="jqcloud w1"><a class="jqcloud"></a></span></div>

The current css file would still work with this change.

igorparrabastias commented 13 years ago

I just was breaking keyboards. I added url attributes to the cloud and all "weight" feature was lost. Mayb eyou could add font-size:inherit; to your css definition:

div.jqcloud a { color: inherit; text-decoration: none; font-size:inherit; // <-- }

Thanks for such terrrific plugin! Igor.-