Why Google Plus load CSS with XHR and append it to a <style> instead using <link>?
css, google-plus, javascript
Solution
This is the answer given by Mark Knichel, an engineer on the Google+ infrastructure team.
"you may have noticed that we load our CSS via a XHR instead of a style tag - that is not for optimization reasons, that’s because we hit Internet Explorer’s max CSS selector limit per stylesheet!"
Read the whole thing at https://plus.google.com/u/0/115060278409766341143/posts/ViaVbBMpSVG
Problem
Analyzing the new Google Plus's javascripts, I realized that Google Plus instead of using `<link>` to reference a CSS file, it uses XHR to load it from a file, then creates a `<style>` and then loads the CSS content to `<style>`. What is the reason that Google uses this method to load the CSS? Proof: ``` D = function(a) { var b = document.createElement("style"); b.type = "text/css"; document.getElementsByTagName("head")[0].appendChild(b); b.styleSheet ? b.styleSheet.cssText = a : b.appendChild(document.createTextNode(a)) }; var ia = function(a, b) { if(4 == b.readyState) { var d = window; $("xcl"); b.onreadystatechange = k; var c = b.status; if(400 > c) { try { var e = b.getResponseHeader("X-Framework-CSS-Blocks"), f = b.responseText; if(e) { for(var e = e.split(","), g = c = 0;g < e.length;g++) { var V = Number(e[g]); D(f.substr(c, V)); c += V } c < f.length && D(f.substr(c)) }else { D(f), ha() && C("css", a, d.OZ_lang, "nooffsets") } d.setTimeout(function() { for(var b = i, c = 0, e = document.styleSheets.length;c < e;c++) { var g = document.styleSheets[c], g = g.cssRules || g.rules; 0 < g.length && "sentinel" == g[g.length - 1].selectorText && (b = !0) } b || C("css", a, d.OZ_lang, "truncated." + f.length) }, 1E3) }catch(W) { throw d.console && d.console.warn(W), C("css", a, d.OZ_lang, "error"), W; } }else { C("css", a, d.OZ_lang, "status." + c) } $("xcr") } }, ja = function() { var a = window.OZ_cssUrl; $("xcs"); var b = ga(); b.open("GET", a, !0); b.onreadystatechange = function() { ia(a, b) }; b.send(h) } window.OZ_cssUrl && ja() ```