Prefix-free is a cool plugin by Lea Verou. It helps the developer to write CSS3 selectors with no prefix. I wonder if it is worthy to include it in my site.

I have a website with some CSS3 and I want to know if loading a JS file that changes the CSS after page loads may decrease my pages' render speed and affect the client side performance?

Prefix-free is a cool plugin by Lea Verou. It helps the developer to write CSS3 selectors with no prefix. I wonder if it is worthy to include it in my site.

I have a website with some CSS3 and I want to know if loading a JS file that changes the CSS after page loads may decrease my pages' render speed and affect the client side performance?

• javascript
• html
• css

• 2 Mostly properties, but also selectors sometimes (like ::-moz-selection) – BoltClock Commented Aug 14, 2012 at 8:08

2 Answers 2

Of course will the execution of a Javascript altering you CSS decrease the performance of your Site, both in terms of javascript-execution time and (re-)rendering-speed of you site.

It is very costly to let javascript examine and alter all your CSS. I prefer such preprocessors like SASS or LESS which let you write prefix-free CSS and produce the according prefixed CSS before delivering it to the client. Of course this has the drawback of having bigger css-files to transfer, but still this is the solution I prefer.

You don't need to write the necessary mixins for yourself, there are basically countless extensions, that will do the work for you and provide ready-to-use mixins.

Just out of the top of my head: for less, one could use http://lessprefixer./ - for Sass http://pass-style/

Yes, you can expect decrease in page load time and possibly FOUC.

If you don't want to promise end-user experience I would remend you to use tools such as LESS. Less enables you to write more pact, managable css markup that gets transformed to regular css before sending from server to client. It will easily handle css-prefix problem.