javascript - Modernizer Polyfill vs Prefixed CSS3 -

i using polyfill box-sizing should work js enabled browsers prevent layout problems looks this:

<script type="text/javascript"> //extend modernizer modernizr.addtest("boxsizing", function() {     return modernizr.testallprops("boxsizing") && (document.documentmode === undefined || document.documentmode > 7);     }); $(function(){     if( !($('html').hasclass('boxsizing')) ){         $('.boxsized, .boxsized *').each(function(){             var fullw = $(this).outerwidth(),                 actualw = $(this).width(),                 wdiff = fullw - actualw,                 neww = actualw - wdiff;              $(this).css('width',neww);         });     } });  </script> 

however looking @ code when ever browser doesn't have box-sizing: enabled resort use of short polyfill don't think should impact site performance ?

my problem follows @ moment using prefixed elements e.g.

-moz-box-sizing:border-box; /* firefox */ -webkit-box-sizing:border-box; /* safari */ 

i wondering if prefixed elements redundant polyfill overrides them or if there still benefit having them etc?

modernizr include prefixed styles in detection, yes, should keep them.

if drop them, site break because browsers require prefix detected modernizr supporting feature , , won't run javascript code, won't have style @ browsers.

the javascript code used ie7^* or earlier, box-sizing style not supported @ all.

(^* ...or other really old browsers opera 9 or firefox 1, realistically no-one using those)