为什么内联脚本>外部样式表比外部样式表>脚本快？

Question

1. stylesheet > Script

http://stevesouders.com/cuzillion/?c0=hc1hfff2_0_f&c1=hc1hfff2_0_f&c2=hb0wfff0_0_f&c3=hb0wfff0_0_f&c4=bi1hfff2_0_f&c5=bi1hfff2_0_f&t=1438003196394

2. Script > stylesheet

http://stevesouders.com/cuzillion/?c0=hb0wfff0_0_f&c1=hb0wfff0_0_f&c2=hc1hfff2_0_f&c3=hc1hfff2_0_f&c4=bi1hfff2_0_f&c5=bi1hfff2_0_f&t=1438003184842

My understanding was scripts block the parsing. So having script before stylesheet will slow down the page load. However in the above instance when I have inline script before the CSS files the page load faster?

Can someone explain why?

Answer 1

I am seeing the difference on two events 'DomContentLoaded' and 'Load'

Difference between Load event in the two case is approx 5-15ms ( Second one is faster ) But Difference between DomContentLoaded is 2.5s ( Second one is faster ). I am not sure, Reason behind this should be script is parsed before the css starts downloading from the network.