Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Should I include "prefix-free" plugin in my website

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?

like image 489
benams Avatar asked Aug 14 '12 07:08

benams


People also ask

Does Box Shadow need prefixes?

Short Answer. Specifically for box-shadow and border-radius , probably not. You only need them if: It's a rare situation where the square-corner or no-shadow fallback hurts the experience.

What are vendor prefixes?

A vendor prefix is a special prefix that is added to a CSS property. Each rendering engine has its own prefix which will only apply the property to that particular browser. The vendor prefix is supported by the following browsers: Internet Explorer: -ms- Chrome: -webkit-

Is transition a prefix?

The word “transition” is taken from two familiar components, though you might not see the second component at first sight. The prefix “trans-” means across.

What is prefixfree JS?

A script that lets you use only unprefixed CSS properties everywhere. It works behind the scenes, adding the current browser's prefix to any CSS code, only when it's needed.


1 Answers

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.com/ - for Sass http://compass-style.org/

like image 109
Christoph Avatar answered Nov 14 '22 23:11

Christoph